您的位置:首页 > 移动开发 > Android开发

Android---使用ViewPager来实现屏幕滑动效果

2013-09-12 08:22 901 查看
本文译自:http://developer.android.com/training/animation/screen-slide.html

本文示例代码:http://download.csdn.net/detail/fireofstar/6211781

屏幕滑动是两个整屏窗口之间切换的一种效果,并且常用于安装向导或幻灯片。本文介绍如何通过supportlibrary类库提供的ViewPager类来实现这种效果。ViewPager类能够自动的完成滑屏的动画效果。

创建View

创建一个稍后给Fragment显示内容所要使用的布局文件。下例包含了一个要显示文本的TextView视图:

<com.example.android.animationsdemo.ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"

    android:id="@+id/content"

    android:layout_width="match_parent"

    android:layout_height="match_parent">

        <TextView style="?android:textAppearanceMedium"

            android:padding="16dp"

            android:lineSpacingMultiplier="1.2"

            android:layout_width="match_parent"

            android:layout_height="wrap_content"

            android:text="@string/lorem_ipsum" />

</com.example.android.animationsdemo.ScrollView>

创建Fragment

创建一个Fragment类,并在它的onCreateView()方法中返回你刚刚创建的那个布局文件。然后需要的时候,在该Fragment所在的父Activity中创建它的实例:

publicclassScreenSlidePageFragmentextendsFragment{

    @Override

    public View onCreateView(LayoutInflaterinflater, ViewGroup container,

            Bundle savedInstanceState) {

        ViewGroup rootView = (ViewGroup) inflater.inflate(

                R.layout.fragment_screen_slide_page, container, false);

        return rootView;

    }

}

添加ViewPager

ViewPager类有内置的切换手势,用于页面间的过度。并且默认的情况下,它们会在屏幕上显示滑动的动画,因此你不需要创建任何东西。因为ViewPager要使用PagerAdapter来提供用于显示的新的页面,所以PagerAdapter会使用上面创建的Fragment类。

首先,创建一个包含一个ViewPager类的布局:

<android.support.v4.view.ViewPager
    xmlns:android="http://schemas.android.com/apk/res/android"

    android:id="@+id/pager"

    android:layout_width="match_parent"

    android:layout_height="match_parent" />

然后创建一个做以下事情的Activity

1. 把带有ViewPager类的布局设置给一个内容视图;

2. 创建一个继承于FragmentStatePagerAdapter抽象类的类,并实现它的getItem()方法,以便提供一个ScreenSlidePageFragment实例来作为新的页面。这个也适配器还要求你实现getCount()方法,它会返回这个页面适配器所创建的页面的个数(本例中是5个)。

3. 把页面适配器(PagerAdapter)挂靠到ViewPager上;

4. 处理设备的回退按钮,以便在Fragment的虚拟堆栈中向后移动。如果用户已经在第一个页面,那么就会返回到Activity所在的回退堆栈。

publicclassScreenSlidePagerActivityextendsFragmentActivity{
    /**

     * The number of pages (wizard steps) toshow in this demo.

     */

    private static final int NUM_PAGES = 5;

    /**

     * The pager widget, which handles animationand allows swiping horizontally to access previous

     * and next wizard steps.

     */

    private ViewPager mPager;

    /**

     * The pager adapter, which provides thepages to the view pager widget.

     */

    private PagerAdaptermPagerAdapter;

    @Override

    protected void onCreate(BundlesavedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_screen_slide_pager);

        //Instantiate a ViewPager and a PagerAdapter.

        mPager = (ViewPager) findViewById(R.id.pager);

        mPagerAdapter = new ScreenSlidePagerAdapter(getFragmentManager());

        mPager.setAdapter(mPagerAdapter);

    }

    @Override

    public void onBackPressed() {

        if (mPager.getCurrentItem() == 0) {

            // If the user is currently looking at the first step, allow the systemto handle the

            // Back button. This calls finish() on this activity and pops theback stack.

            super.onBackPressed();

        } else {

            // Otherwise, select the previous step.

            mPager.setCurrentItem(mPager.getCurrentItem() - 1);

        }

    }

    /**

     * A simple pager adapter that represents 5ScreenSlidePageFragment objects, in

     * sequence.

     */

    private class ScreenSlidePagerAdapter extends FragmentStatePagerAdapter {

        public ScreenSlidePagerAdapter(FragmentManager fm) {

            super(fm);

        }

        @Override

        public Fragment getItem(int position) {

            return new ScreenSlidePageFragment();

        }

        @Override

        public int getCount() {

            return NUM_PAGES;

        }

    }

}

用PageTransformer类来自定义动画

要显示与默认的屏幕滑动动画不同的动画,就要实现ViewPager.PageTransformer接口,并把它提供给对应的视图页面。这个接口只暴露了一个方法---transformPage()。通常在屏幕过渡时,这个方法会被调用一次,用于显示页面(一般只有一个可见页面)和关闭相邻的页面。例如,如果页面三可见,并且用户向页面四的方向拖动该页,transformPage()方法就会手势执行阶段,被页面二、页面三、页面四调用。

在你的transformPage()实现中,基于屏幕上页面的位置,来判断那个页面需要变换,以便创建自定义滑动动画。从transformPage()方法的position参数中可以获得页面的位置。

position参数指明给定页面相对于屏幕中心的位置。它是一个动态属性,会随着页面的滚动而改变。当一个页面填充整个屏幕是,它的值是0,当一个页面刚刚离开屏幕的右边时,它的值是1。当两个也页面分别滚动到一半时,其中一个页面的位置是-0.5,另一个页面的位置是0.5。基于屏幕上页面的位置,通过使用诸如setAlpha()setTranslationX()、或setScaleY()方法来设置页面的属性,来创建自定义的滑动动画。

当有了一个PageTransformer接口实现时,就可以调用你实现的setPageTransformer()方法来应用自定义动画。例如,如果你的PageTransformer实现被命名为ZoomOutPageTransformer,就可以像下面这样来设置自定义动画:

ViewPager pager
=(ViewPager)findViewById(R.id.pager);
...
pager.setPageTransformer(true, new ZoomOutPageTransformer());

 

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: