Android开发之ViewPager滑动页面效果实现
jopen
10年前
我们先来谷歌官方文档对viewpager的介绍，该类允许用户通过页面翻转左右的数据，需要通过实现PagerAdapter适配器来生成视图显示的 页面。因为注意这个类是早期设计和开发的，API可能会改变，并在以后更新兼容库,到时候我们需要做相应的处理。ViewPager最常用于结合 Fragment,这是一个方便的方式来供应和管理每个页面的生命周期,我们后面的博客介绍相关的内容，今天我们先来简单实现viewpager的功能。
MainAcitivity的代码
package com.example.f10_viewpager; import java.util.ArrayList; import java.util.List; import android.os.Bundle; import android.app.Activity; import android.support.v4.view.PagerAdapter; import android.support.v4.view.PagerTabStrip; import android.support.v4.view.ViewPager; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class MainActivity extends Activity { private View view1, view2, view3;// 需要滑动的页卡 private ViewPager viewPager; private PagerTabStrip pagerTabStrip; private List<View> viewList;// 把需要滑动的页卡添加到这个list中 private List<String> titleList;// viewpager的标题 @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 像普通控件一样先初始化 viewPager = (ViewPager) findViewById(R.id.viewpager); pagerTabStrip = (PagerTabStrip) findViewById(R.id.pagertab); pagerTabStrip.setDrawFullUnderline(false);//设置下划线不整页显示 pagerTabStrip.setTextSpacing(1000);//设置标题之间的距离 initView(); MyAdapter pagerAdapter = new MyAdapter(); viewPager.setAdapter(pagerAdapter); } //填充布局，设置每一页的标题 private void initView() { view1 = findViewById(R.layout.layout1); view2 = findViewById(R.layout.layout2); view3 = findViewById(R.layout.layout3); viewList = new ArrayList<View>();// 将要分页显示的View装入数组中 viewList.add(view1); viewList.add(view2); viewList.add(view3); titleList = new ArrayList<String>();// 每个页面的Title数据 titleList.add("第一个页面"); titleList.add("第二个页面"); titleList.add("第三个页面"); } public class MyAdapter extends PagerAdapter { @Override public boolean isViewFromObject(View arg0, Object arg1) { return arg0 == arg1; } @Override public int getCount() { return viewList.size(); } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView(viewList.get(position)); } @Override public int getItemPosition(Object object) { return super.getItemPosition(object); } @Override public CharSequence getPageTitle(int position) { return titleList.get(position); } // 将每一页的布局填充如ViewGroup容器中 @Override public Object instantiateItem(ViewGroup container, int position) { container.addView(viewList.get(position)); return viewList.get(position); } }; } 在我之间浏览博文的时候，有人提到过第30行代码设置标题的距离效果没有实现，不知道为什么，后来我调试了一下，发现应该是这个值要设置的大一些，我这 里设置的就是1000就实现了一个页面只显示一个标题的效果。在layout布局文件下，我们首先得先创建三个简单的布局文件，来实现滑动效果，当然最重 要的是main.xml的代码书写
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" > <android.support.v4.view.PagerTabStrip android:id="@+id/pagertab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="top"/> </android.support.v4.view.ViewPager> </LinearLayout>