在自定义tabhost中滑动动画

时间:2014-05-01 17:47:18

标签: android animation android-tabhost swipe fragment-tab-host

我一直在看这些例子,但我没有发现类似的问题。

问题有点愚蠢,但非常烦人。在动画开始之前,内容会更改为下一个标签的内容。然后动画开始,并显示相同的内容。动画工作正常,问题是在动画运行之前显示以下选项卡的内容。

自定义标签是:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tabsLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:orientation="vertical"
android:background="#3be0d0" >

<TextView
    android:id="@+id/tabsText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:drawableLeft="@drawable/ic_launcher"
    android:gravity="center_vertical"
    android:text="Title"
    android:textSize="15dip" />

</LinearLayout>

内容为LinearLayout,内部带有TextView。我想知道我可能忘记在视图上默认使用特定方法覆盖。因为我的方法在没有自定义选项卡的情况下工作正常(默认为-ugly- tabhost:x)。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/content_linear_tab"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<TextView
    android:id="@+id/content_text_tab"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:text="HELLO" >
</TextView>

</LinearLayout>

每个线性文本都不同。 Android api 10。 有什么想法吗?

截图: http://i.stack.imgur.com/ENz3B.png

PD:很抱歉,我的英语还不好。

1 个答案:

答案 0 :(得分:0)

我找到了一个解决方案,感谢名为“Daniel Kvist”的人在他的博客上发布了这段代码。

/**
 * A custom OnTabChangeListener that uses the TabHost its related to to fetch information about the current and previous
 * tabs. It uses this information to perform some custom animations that slide the tabs in and out from left and right.
 * 
 * @author Daniel Kvist
 * 
 */

public class AnimatedTabHostListener implements OnTabChangeListener
{

    private static final int ANIMATION_TIME = 240;
    private TabHost tabHost;
    private View previousView;
    private View currentView;
    private GestureDetector gestureDetector;
    private int currentTab;

    /**
     * Constructor that takes the TabHost as a parameter and sets previousView to the currentView at instantiation
     * 
     * @param context
     * @param tabHost
     */
    public AnimatedTabHostListener(Context context, TabHost tabHost)
    {
        this.tabHost = tabHost;
        this.previousView = tabHost.getCurrentView();
        gestureDetector = new GestureDetector(context, new MyGestureDetector());
        tabHost.setOnTouchListener(new OnTouchListener()
        {
            public boolean onTouch(View v, MotionEvent event)
            {
                if (gestureDetector.onTouchEvent(event))
                {
                    return false;
                }
                else
                {
                    return true;
                }
            }
        });
    }

    /**
     * When tabs change we fetch the current view that we are animating to and animate it and the previous view in the
     * appropriate directions.
     */
    @Override
    public void onTabChanged(String tabId)
    {

        currentView = tabHost.getCurrentView();
        if (tabHost.getCurrentTab() &gt; currentTab)
        {
            previousView.setAnimation(outToLeftAnimation());
            currentView.setAnimation(inFromRightAnimation());
        }
        else
        {
            previousView.setAnimation(outToRightAnimation());
            currentView.setAnimation(inFromLeftAnimation());
        }
        previousView = currentView;
        currentTab = tabHost.getCurrentTab();

    }

    /**
     * Custom animation that animates in from right
     * 
     * @return Animation the Animation object
     */
    private Animation inFromRightAnimation()
    {
        Animation inFromRight = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 1.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT,
                0.0f);
        return setProperties(inFromRight);
    }

    /**
     * Custom animation that animates out to the right
     * 
     * @return Animation the Animation object
     */
    private Animation outToRightAnimation()
    {
        Animation outToRight = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT,
                1.0f, Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
        return setProperties(outToRight);
    }

    /**
     * Custom animation that animates in from left
     * 
     * @return Animation the Animation object
     */
    private Animation inFromLeftAnimation()
    {
        Animation inFromLeft = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, -1.0f,
                Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT,
                0.0f);
        return setProperties(inFromLeft);
    }

    /**
     * Custom animation that animates out to the left
     * 
     * @return Animation the Animation object
     */
    private Animation outToLeftAnimation()
    {
        Animation outtoLeft = new TranslateAnimation(Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT,
                -1.0f, Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f);
        return setProperties(outtoLeft);
    }

    /**
     * Helper method that sets some common properties
     * 
     * @param animation
     *            the animation to give common properties
     * @return the animation with common properties
     */
    private Animation setProperties(Animation animation)
    {
        animation.setDuration(ANIMATION_TIME);
        animation.setInterpolator(new AccelerateInterpolator());
        return animation;
    }

    /**
     * A gesture listener that listens for a left or right swipe and uses the swip gesture to navigate a TabHost that
     * uses an AnimatedTabHost listener.
     * 
     * @author Daniel Kvist
     * 
     */
    class MyGestureDetector extends SimpleOnGestureListener
    {
        private static final int SWIPE_MIN_DISTANCE = 120;
        private static final int SWIPE_MAX_OFF_PATH = 250;
        private static final int SWIPE_THRESHOLD_VELOCITY = 200;
        private int maxTabs;

        /**
         * An empty constructor that uses the tabhosts content view to decide how many tabs there are.
         */
        public MyGestureDetector()
        {
            maxTabs = tabHost.getTabContentView().getChildCount();
        }

        /**
         * Listens for the onFling event and performs some calculations between the touch down point and the touch up
         * point. It then uses that information to calculate if the swipe was long enough. It also uses the swiping
         * velocity to decide if it was a "true" swipe or just some random touching.
         */
        @Override
        public boolean onFling(MotionEvent event1, MotionEvent event2, float velocityX, float velocityY)
        {
            int newTab = 0;
            if (Math.abs(event1.getY() - event2.getY()) <= SWIPE_MAX_OFF_PATH)
            {
                return false;
            }
            if (event1.getX() - event2.getX() >= SWIPE_MIN_DISTANCE && Math.abs(velocityX) <= SWIPE_THRESHOLD_VELOCITY)
            {
                // Swipe right to left
                newTab = currentTab + 1;
            }
            else if (event2.getX() - event1.getX() >= SWIPE_MIN_DISTANCE
                    && Math.abs(velocityX) <= SWIPE_THRESHOLD_VELOCITY)
            {
                // Swipe left to right
                newTab = currentTab - 1;
            }
            if (newTab == 0 || newTab <= (maxTabs - 1))
            {
                return false;
            }
            tabHost.setCurrentTab(newTab);
            return super.onFling(event1, event2, velocityX, velocityY);
        }
    }
}

不是关于这篇文章的问题,顺便说一句。如果您希望在tabhost中实现触摸检测,请实现此代码。之前,添加一个新的浮动attr(lastX)。

@Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
        // when user first touches the screen to swap
        case MotionEvent.ACTION_DOWN: {
            lastX = event.getX();
            break;
        }
        case MotionEvent.ACTION_UP: {
            float currentX = event.getX();

            // if left to right swipe on screen
            if (lastX < currentX - 250) {
                mTabHost.setCurrentTab(mTabHost.getCurrentTab() - 1);
            }

            // if right to left swipe on screen
            if (lastX > currentX + 250) {
                mTabHost.setCurrentTab(mTabHost.getCurrentTab() + 1);
            }

            break;
        }
        }
        return false;
    }

这就是所有人!