如何通过手指移动来滑动(TabActivity 的)选项卡内容,如“主页”、“新闻和新闻”中的内容天气应用程序”?

发布于 2024-12-13 12:42:00 字数 6541 浏览 0 评论 0原文

我有一个包含三个选项卡的选项卡活动。我需要像在主页或“新闻和天气”应用程序中一样带有手指移动的滑动动画。在文档和论坛的帮助下,我可以设法在某种程度上对选项卡内容进行动画处理,但不像上面提到的那样。

那么,您能帮我解决这个问题吗?

是我

MyTabActivity.java

public class MyTabActivity extends TabActivity {

    int current_tab;
    TabHost tabHost;

    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 GestureDetector gestureDetector;
    private Animation slideLeftIn;
    private Animation slideLeftOut;
    private Animation slideRightIn;
    private Animation slideRightOut;
    private ViewFlipper viewFlipper;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.mains);

        viewFlipper = (ViewFlipper) findViewById(R.id.flipper);

        slideLeftIn = AnimationUtils.loadAnimation(this, R.anim.slide_left_in);
        slideLeftOut = AnimationUtils
                .loadAnimation(this, R.anim.slide_left_out);
        slideRightIn = AnimationUtils
                .loadAnimation(this, R.anim.slide_right_in);
        slideRightOut = AnimationUtils.loadAnimation(this,
                R.anim.slide_right_out);

        gestureDetector = new GestureDetector(new MyGestureDetector());

        Resources res = getResources(); 
        tabHost = getTabHost();
        TabHost.TabSpec spec;
        Intent intent;

        intent = new Intent().setClass(this, FirstTabContentAcitivity.class);
        spec = tabHost.newTabSpec("first").setIndicator("First",
                res.getDrawable(R.drawable.first)).setContent(intent);
        tabHost.addTab(spec);

        intent = new Intent().setClass(this, SecondTabContentActivity.class);
        spec = tabHost.newTabSpec("second").setIndicator("Second",
                res.getDrawable(R.drawable.second)).setContent(intent);
        tabHost.addTab(spec);

        intent = new Intent().setClass(this, ThirdTabContentAcitivity.class);
        spec = tabHost.newTabSpec("third").setIndicator("Third",
                res.getDrawable(R.drawable.third)).setContent(intent);
        tabHost.addTab(spec);


        tabHost.setCurrentTab(0);

    }


    class MyGestureDetector extends SimpleOnGestureListener {
        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
                float velocityY) {
            Log.d("Gesture", "Detected inside class.");
            try {
                if (Math.abs(e1.getY() - e2.getY()) > SWIPE_MAX_OFF_PATH)
                    return false;

                if (e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE
                        && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {

                        viewFlipper.setInAnimation(slideLeftIn);
                        viewFlipper.setOutAnimation(slideLeftOut);
                        viewFlipper.showNext();                     

                        //overridePendingTransition(R.anim.slide_left_in, R.anim.slide_left_out);
                    }
                } else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE
                        && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {


                        viewFlipper.setInAnimation(slideRightIn);
                        viewFlipper.setOutAnimation(slideRightOut);
                        viewFlipper.showPrevious();                     
                    }
                }
            } catch (Exception ex) {
                Log.d("onFling", ex.getMessage());
            }
            return false;
        }
    }

    /*
     * @Override public boolean onTouchEvent(MotionEvent event) { if
     * (gestureDetector.onTouchEvent(event)) { Log.d("onTouchEvent",
     * "screen touched"); return true; } else { return false; } }
     */

    @Override
    public boolean dispatchTouchEvent(MotionEvent event) {
        super.dispatchTouchEvent(event);
        return gestureDetector.onTouchEvent(event);
    }   
}

main.xmllide_left_in.xmllide_left_out.xmlslide_right_in.xmlslide_right_out.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TabHost xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@android:id/tabhost" android:layout_width="fill_parent"
        android:layout_height="fill_parent" android:layout_weight="1">
        <LinearLayout android:orientation="vertical"
            android:layout_width="fill_parent" android:layout_height="fill_parent">
            <TabWidget android:id="@android:id/tabs"
                android:layout_width="fill_parent" android:layout_height="wrap_content" />
            <ViewFlipper xmlns:android="http://schemas.android.com/apk/res/android"
                android:id="@+id/flipper" android:layout_width="fill_parent"
                android:layout_height="fill_parent">
                <FrameLayout android:id="@android:id/tabcontent"
                    android:layout_width="fill_parent" android:layout_height="fill_parent">
                </FrameLayout>
            </ViewFlipper>
        </LinearLayout>
    </TabHost>
</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="50%p" android:toXDelta="0"
        android:duration="800" />
</set>

代码

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="0" android:toXDelta="-50%p"
        android:duration="800" />
</set>

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <translate android:fromXDelta="-50%p" android:toXDelta="0"
        android:duration="800" />
</set>

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="0" android:toXDelta="50%p"
        android:duration="800" />
</set>

I have a tab activity with three tabs. I need the sliding animation with the finger movement that does like in Home or "News & Weather" app. With the help of documentation and forum, I could manage to animate the tab contents in some extent but not like in those mention above.

So, would you please help me to solve this issue?

Here is my code:

MyTabActivity.java

public class MyTabActivity extends TabActivity {

    int current_tab;
    TabHost tabHost;

    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 GestureDetector gestureDetector;
    private Animation slideLeftIn;
    private Animation slideLeftOut;
    private Animation slideRightIn;
    private Animation slideRightOut;
    private ViewFlipper viewFlipper;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.mains);

        viewFlipper = (ViewFlipper) findViewById(R.id.flipper);

        slideLeftIn = AnimationUtils.loadAnimation(this, R.anim.slide_left_in);
        slideLeftOut = AnimationUtils
                .loadAnimation(this, R.anim.slide_left_out);
        slideRightIn = AnimationUtils
                .loadAnimation(this, R.anim.slide_right_in);
        slideRightOut = AnimationUtils.loadAnimation(this,
                R.anim.slide_right_out);

        gestureDetector = new GestureDetector(new MyGestureDetector());

        Resources res = getResources(); 
        tabHost = getTabHost();
        TabHost.TabSpec spec;
        Intent intent;

        intent = new Intent().setClass(this, FirstTabContentAcitivity.class);
        spec = tabHost.newTabSpec("first").setIndicator("First",
                res.getDrawable(R.drawable.first)).setContent(intent);
        tabHost.addTab(spec);

        intent = new Intent().setClass(this, SecondTabContentActivity.class);
        spec = tabHost.newTabSpec("second").setIndicator("Second",
                res.getDrawable(R.drawable.second)).setContent(intent);
        tabHost.addTab(spec);

        intent = new Intent().setClass(this, ThirdTabContentAcitivity.class);
        spec = tabHost.newTabSpec("third").setIndicator("Third",
                res.getDrawable(R.drawable.third)).setContent(intent);
        tabHost.addTab(spec);


        tabHost.setCurrentTab(0);

    }


    class MyGestureDetector extends SimpleOnGestureListener {
        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
                float velocityY) {
            Log.d("Gesture", "Detected inside class.");
            try {
                if (Math.abs(e1.getY() - e2.getY()) > SWIPE_MAX_OFF_PATH)
                    return false;

                if (e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE
                        && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {

                        viewFlipper.setInAnimation(slideLeftIn);
                        viewFlipper.setOutAnimation(slideLeftOut);
                        viewFlipper.showNext();                     

                        //overridePendingTransition(R.anim.slide_left_in, R.anim.slide_left_out);
                    }
                } else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE
                        && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {


                        viewFlipper.setInAnimation(slideRightIn);
                        viewFlipper.setOutAnimation(slideRightOut);
                        viewFlipper.showPrevious();                     
                    }
                }
            } catch (Exception ex) {
                Log.d("onFling", ex.getMessage());
            }
            return false;
        }
    }

    /*
     * @Override public boolean onTouchEvent(MotionEvent event) { if
     * (gestureDetector.onTouchEvent(event)) { Log.d("onTouchEvent",
     * "screen touched"); return true; } else { return false; } }
     */

    @Override
    public boolean dispatchTouchEvent(MotionEvent event) {
        super.dispatchTouchEvent(event);
        return gestureDetector.onTouchEvent(event);
    }   
}

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TabHost xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@android:id/tabhost" android:layout_width="fill_parent"
        android:layout_height="fill_parent" android:layout_weight="1">
        <LinearLayout android:orientation="vertical"
            android:layout_width="fill_parent" android:layout_height="fill_parent">
            <TabWidget android:id="@android:id/tabs"
                android:layout_width="fill_parent" android:layout_height="wrap_content" />
            <ViewFlipper xmlns:android="http://schemas.android.com/apk/res/android"
                android:id="@+id/flipper" android:layout_width="fill_parent"
                android:layout_height="fill_parent">
                <FrameLayout android:id="@android:id/tabcontent"
                    android:layout_width="fill_parent" android:layout_height="fill_parent">
                </FrameLayout>
            </ViewFlipper>
        </LinearLayout>
    </TabHost>
</LinearLayout>

slide_left_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="50%p" android:toXDelta="0"
        android:duration="800" />
</set>

slide_left_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="0" android:toXDelta="-50%p"
        android:duration="800" />
</set>

slide_right_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <translate android:fromXDelta="-50%p" android:toXDelta="0"
        android:duration="800" />
</set>

slide_right_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="0" android:toXDelta="50%p"
        android:duration="800" />
</set>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

如果没有你 2024-12-20 12:42:00

使用您的方法将非常困难和混乱...

我认为您应该使用 v4 支持包中的 ViewPager,它看起来很有用...

http://android-developers.blogspot.com/2011/08/horizo​​ntal-view-swiping-with-viewpager.html


这是示例中的可滑动选项卡实现
(我认为这正是您正在寻找的):

http://developer.android.com/resources/samples/Support4Demos/src/com/example/android/supportv4/app/FragmentTabsPager.html

我已经尝试过,它有效很好。

With your approach that would be really hard and messy...

I think you should use ViewPager from the v4 support package, it looks useful...

http://android-developers.blogspot.com/2011/08/horizontal-view-swiping-with-viewpager.html


Here is the flingable tab implementation from the samples
(I think this is exactly what you were looking for):

http://developer.android.com/resources/samples/Support4Demos/src/com/example/android/supportv4/app/FragmentTabsPager.html

I've tried it out, it works nicely.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文