Androidの垂直滑动ViewPager实现

来源：互联网发布：申请网络电话号码编辑：程序博客网时间：2024/05/21 18:31

热门电影展示是一个类似ViewPager垂直滑动的效果，开源项目：Android-DirectionalViewPager

github地址：https://github.com/JakeWharton/Android-DirectionalViewPager

这个项目实际上是在ViewPager的基础上，做了一个扩展，加入了对上下方向滑动的支持，正如项目的名字，使用该项目，可以灵活的改变ViewPager的方向,而且仅用一个简单的属性设置就可以做到,我只对该项目提供的例子做了一些简单的改动，就做到了QQ电影垂直滑动的效果。

DirectionalViewPager:直接继承自ViewPager,主要在onInterceptTouchEvent()和onTouchEvent()里面加入了对于垂直方向滑动的支持.并提供了setOrientation()这个方法,我们可以通过此方法，直接设置ViewPager的滑动效果，垂直或者是水平滑动。
VerticalViewPagerCompat:提供了设置DataSetObserver的方法:setDataSetObserver()

public class DirectionalViewPager extends ViewPager {    private static final String TAG = "DirectionalViewPager";    private static final String XML_NS = "http://schemas.android.com/apk/res/android";    private static final boolean DEBUG = false;    private static final boolean USE_CACHE = false;    public static final int HORIZONTAL = 0;    public static final int VERTICAL = 1;

github还有另外一个项目VerticalViewPager：https://github.com/LambergaR/VerticalViewPager，它也可以实现垂直滑动的效果。不过它和ViewPager一样都是继承自ViewGroup，而且不是继承ViewPager。

下面介绍如何使用DirectionalViewPager

DirectionalViewPager的使用方法和ViewPager差不多，因为它是继承自ViewPager，只是多了一个setOrientation()方法而已。

首先，在布局文件引用DirectionalViewPager

<LinearLayout    xmlns:android="http://schemas.android.com/apk/res/android"    android:orientation="vertical"    android:layout_width="fill_parent"    android:layout_height="fill_parent">    <com.directionalviewpager.DirectionalViewPager        android:id="@+id/pager"        android:layout_width="fill_parent"        android:layout_height="0dp"        android:layout_weight="1"        />        <LinearLayout        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:padding="2dp"        android:orientation="horizontal">                <Button            android:id="@+id/horizontal"            android:layout_width="0dp"            android:layout_weight="1"            android:layout_height="wrap_content"            android:layout_marginRight="1dp"            android:text="Horizontal" />        <Button            android:id="@+id/vertical"            android:layout_width="0dp"            android:layout_weight="1"            android:layout_height="wrap_content"            android:layout_marginLeft="1dp"            android:text="Vertical" />            </LinearLayout></LinearLayout>

然后在Activity中对DirectionalViewPager进行初始化，代码如下：

public class SampleActivity extends FragmentActivity {    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.main);        //Set up the pager        final DirectionalViewPager pager = (DirectionalViewPager)findViewById(R.id.pager);        pager.setAdapter(new TestFragmentAdapter(getSupportFragmentManager()));        //Bind to control buttons        ((Button)findViewById(R.id.horizontal)).setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                pager.setOrientation(DirectionalViewPager.HORIZONTAL);            }        });        ((Button)findViewById(R.id.vertical)).setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                pager.setOrientation(DirectionalViewPager.VERTICAL);            }        });    }}

DirectionalViewPager 的适配器类

class TestFragmentAdapter extends FragmentPagerAdapter {protected static final String[] CONTENT = new String[] { "This", "Is Is", "A A A", "Test", };public TestFragmentAdapter(FragmentManager fm) {super(fm);}@Overridepublic Fragment getItem(int position) {return TestFragment.newInstance(CONTENT[position]);}@Overridepublic int getCount() {return CONTENT.length;}}

运行效果

0 0