ViewPager的使用（实现微信左右切换页卡功能）

ViewPager的使用（实现微信左右切换页卡功能）

ViewPager可以使视图左右滑动，类似于微信的那种左右滑动的页卡选择界面

一、ViewPager创建步骤

① 在XML布局中加入android.support.v4.view.ViewPager

② 加载显示的页卡将Layout布局转换为View对象

  (1) LayoutInflater lf getLayoutInflater().from(this);
   lf.inflate(resource,root);
  (2)View.inflate(context,resource,root);

③ 配置Adapter（三种Adapter）

 （1）PagerAdapter 数据源：List<View>
  (2)FragmentPagerAdapter 数据源：List<Fragment>
  (3)FragmentStatePagerAdapter 数据源：List<Fragment>

二、代码示例

新建四个Fragment和他们的布局下面是MainActivity的xml布局：

<android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center" >

        <android.support.v4.view.PagerTabStrip
            android:id="@+id/tab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="top" >
        </android.support.v4.view.PagerTabStrip>
       <!--  底部显示标题与上面的顶部显示不能同时出现
        <android.support.v4.view.PagerTitleStrip
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom" >
        </android.support.v4.view.PagerTitleStrip>
        -->
    </android.support.v4.view.ViewPager>

第一种PagerAdapter

public class MyPagerAdapter extends PagerAdapter {
    
    private List<View> viewList;
    private List<String> titleList;
    
    public MyPagerAdapter(List<View> viewList,List<String> titleList){
        this.viewList = viewList;
        this.titleList = titleList;
    }
    
    /**
     * 返回页卡的数量
     */
    @Override
    public int getCount() {
        
        return viewList.size();
    }
    
     /**
     * view是否来自对象
     */
    @Override
    public boolean isViewFromObject(View arg0, Object arg1) {
        
        return arg0==arg1;
    }
     /**
     * 实例化一个页卡
     */
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        container.addView(viewList.get(position));
        return viewList.get(position);
    }
     /**
     * 销毁一个页卡
     */
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        
        container.removeView(viewList.get(position));
        
    }
    
    /**
     * 设置ViewPager的标题
     */
    @Override
    public CharSequence getPageTitle(int position) {
        
        return titleList.get(position);
    }

}

第二种FragmentPagerAdapter

public class MyFragmentPagerAdapter extends FragmentPagerAdapter {
    private List<Fragment> fragList;
    private List<String> titleList;
    public MyFragmentPagerAdapter(FragmentManager fm,List<Fragment> fragList,List<String> titleList) {
        super(fm);
        this.fragList = fragList;
        this.titleList = titleList;
    }
    

    @Override
    public Fragment getItem(int arg0) {
        
        return fragList.get(arg0);
    }
    
    @Override
    public CharSequence getPageTitle(int position) {
        
        return titleList.get(position);
    }

    @Override
    public int getCount() {
        
        return fragList.size();
    }

}

第三种FragmentStatePagerAdapter（该适配器可以动态销毁Fragment）

public class MyFragmentPagerAdapter2 extends FragmentStatePagerAdapter {//该适配器可以动态销毁
    private List<Fragment> fragList;
    private List<String> titleList;
    public MyFragmentPagerAdapter2(FragmentManager fm,List<Fragment> fragList,List<String> titleList) {
        super(fm);
        this.fragList = fragList;
        this.titleList = titleList;
    }
    

    @Override
    public Fragment getItem(int arg0) {
        
        return fragList.get(arg0);
    }
    
    @Override
    public CharSequence getPageTitle(int position) {
        
        return titleList.get(position);
    }

    @Override
    public int getCount() {
        
        return fragList.size();
    }
    
    @Override
    public Object instantiateItem(ViewGroup arg0, int arg1) {
        
        return super.instantiateItem(arg0, arg1);
    }
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        
        super.destroyItem(container, position, object);
    }

}

MainActivity里使用getSupportFragmentManager()该Activity必须继承FragmentActivity：

public class MainActivity extends FragmentActivity implements OnPageChangeListener{
    private List<View> viewList;
    private List<String> titleList;
    private ViewPager pager;
    private PagerTabStrip tab;//顶部标题
    
    private List<Fragment> fragList;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewList = new ArrayList<View>();
        titleList = new ArrayList<String>();
        tab = (PagerTabStrip) findViewById(R.id.tab);
        
        View view1 = View.inflate(this,R.layout.view1,null);
        View view2 = View.inflate(this,R.layout.view2,null);
        View view3 = View.inflate(this,R.layout.view3,null);
        View view4 = View.inflate(this,R.layout.view4,null);
        
        viewList.add(view1);
        viewList.add(view2);
        viewList.add(view3);
        viewList.add(view4);
        
        fragList = new ArrayList<Fragment>();
        fragList.add(new Fragment1());
        fragList.add(new Fragment2());
        fragList.add(new Fragment3());
        fragList.add(new Fragment4());
        
       //为ViewPager页卡设置标题
        titleList.add("第一页");
        titleList.add("第二页");
        titleList.add("第三页");
        titleList.add("第四页");
        //为PagerTabStrip设置一些属性
        tab.setBackgroundColor(Color.WHITE);
        tab.setDrawFullUnderline(false);
        tab.setTabIndicatorColor(Color.BLUE);
        
        pager = (ViewPager) findViewById(R.id.pager);
        //MyPagerAdapter adapter = new MyPagerAdapter(viewList,titleList);
        //MyFragmentPagerAdapter adapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), fragList, titleList);
        /**
         * 使用getSupportFragmentManager()该Activity必须继承FragmentActivity
         */
        MyFragmentPagerAdapter2 adapter = new MyFragmentPagerAdapter2(getSupportFragmentManager(), fragList, titleList);
        pager.setAdapter(adapter);
        pager.setOnPageChangeListener(this);
    }

    @Override
    public void onPageScrollStateChanged(int arg0) {
                
    }

    @Override
    public void onPageScrolled(int arg0, float arg1, int arg2) {
                
    }

    @Override
    public void onPageSelected(int arg0) {
        Toast.makeText(this,"当前是第"+(arg0+1)+"个界面", 0).show();
        
    }

}