实例讲解Android中ViewPager组件的一些进阶使用技巧

概述我们经常看到使用了ViewPager的App，在每页上面都会有一个滑块来标志当前处于哪一页。在PagerView包里有android.support.v4.view.PagerTitleStrip和android.support.v4.view.PagerTabStrip两个组件，可以在布局文件中

我们经常看到使用了VIEwPager的App，在每页上面都会有一个滑块来标志当前处于哪一页。在PagerVIEw包里有androID.support.v4.vIEw.PagerTitleStrip和androID.support.v4.vIEw.PagerTabStrip两个组件，可以在布局文件中，作为VIEwPager的子标签，并设定相对与VIEwPager的位置(比如顶部)。但这两个组件都很丑，并且标题会随着页面一起滑动，所以一般都不用。

其实实现一个滑块标志当前页面也很简单，大概需要两步：

第一步 在布局文件VIEwPager的上方放置一个ImageVIEw组件，组件可以是图片或是shape资源。注意需要把ImageVIEw的scaleType属性设为matrix，就是说该组件的位置和大小由一个变换矩阵来控制；

第二步 在Activity中为VIEwPager组件添加OnPagechangelistener监听器。在OnPagechangelistener里设定matrix，用于控制指示滑块ImageVIEw的位置。该监听器需要实现三个方法：

onPageScrollStateChanged：用于监听滑动状态的改变

onPageScrolled：用于监听滑动的动作

onPageSeleted:用于监听页面的切换，即某个页面被选中了作为当前页面。

一般实现onPageSelected方法就可以，其他两个方法可以空着。另外为了使页面切换时滑块也是平滑地滑动，可以给滑块的ImageVIEw指定一个TranslateAnimation动画，指定动画用setAnimation，TranlateAnimation也很简单，有个构造函数是TranslateAnimation(int beginX,int endX,int beginY,int endY)，将运动矢量的起始位置和终止位置传给它就好了。

下面我们来看五个具体的例子：

一 实现VIEwPager（数据源为List<VIEw>）

1.先在main.xml文件中添加一个VIEwPager:

<linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"   androID:layout_wIDth="match_parent"   androID:layout_height="match_parent" >    <androID.support.v4.vIEw.VIEwPager     androID:ID="@+ID/pager"     androID:layout_wIDth="wrap_content"     androID:layout_height="wrap_content">   </androID.support.v4.vIEw.VIEwPager>  </linearLayout> 

2.创建三个VIEw:

<?xml version="1.0" enCoding="utf-8"?> <linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"   androID:layout_wIDth="match_parent"   androID:layout_height="match_parent"   androID:orIEntation="vertical" >    <TextVIEw     androID:ID="@+ID/txt1"     androID:layout_wIDth="wrap_content"     androID:layout_height="wrap_content"     androID:layout_gravity="center"     androID:textSize="25dp"     androID:text="第一页" >   </TextVIEw>  </linearLayout> 

<?xml version="1.0" enCoding="utf-8"?> <linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"   androID:layout_wIDth="match_parent"   androID:layout_height="match_parent"   androID:orIEntation="vertical" >    <TextVIEw     androID:ID="@+ID/txt2"     androID:layout_wIDth="wrap_content"     androID:layout_height="wrap_content"     androID:text="第二页" >   </TextVIEw>    </linearLayout> 

<?xml version="1.0" enCoding="utf-8"?><linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  androID:layout_wIDth="match_parent"  androID:layout_height="match_parent"  androID:orIEntation="vertical" >    <TextVIEw    androID:ID="@+ID/txt3"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:text="第三页" >  </TextVIEw>  </linearLayout>

3.创建一个VIEwPager适配器类：

package com.yayun.vIEwpagerdemo;  import java.util.ArrayList; import java.util.List;  import androID.support.v4.vIEw.PagerAdapter; import androID.vIEw.VIEw; import androID.vIEw.VIEwGroup;  public class VIEwPagerAdapter extends PagerAdapter {   private List<VIEw> lVIEws=new ArrayList<VIEw>();      public VIEwPagerAdapter(List<VIEw> lVIEws){     this.lVIEws=lVIEws;   }    @OverrIDe   public int getCount() {     return lVIEws.size();   }    @OverrIDe   public boolean isVIEwFromObject(VIEw arg0,Object arg1) {     return arg0==arg1;   }   @OverrIDe   public Object instantiateItem(VIEwGroup container,int position) {     container.addVIEw(lVIEws.get(position));     return lVIEws.get(position);   }   @OverrIDe   public voID destroyItem(VIEwGroup container,int position,Object object) {     container.removeVIEw(lVIEws.get(position));   }  } 

4.MainActivity.java:

package com.yayun.vIEwpagerdemo;  import java.util.ArrayList; import java.util.List;  import androID.support.v7.app.ActionBaractivity; import androID.support.v7.app.Actionbar; import androID.support.v4.app.Fragment; import androID.support.v4.vIEw.PagerAdapter; import androID.support.v4.vIEw.VIEwPager; import androID.os.Bundle; import androID.vIEw.LayoutInflater; import androID.vIEw.Menu; import androID.vIEw.MenuItem; import androID.vIEw.VIEw; import androID.vIEw.VIEwGroup; import androID.vIEw.Window; import androID.os.Build;  public class MainActivity extends ActionBaractivity {   private VIEwPager vIEwPager;   private List<VIEw> ListVIEws=null;   VIEwPagerAdapter pagerAdapter;    @OverrIDe   protected voID onCreate(Bundle savedInstanceState) {     super.onCreate(savedInstanceState);     requestwindowFeature(Window.FEATURE_NO_Title);     setContentVIEw(R.layout.activity_main);          vIEwPager=(VIEwPager) findVIEwByID(R.ID.pager);     ListVIEws=new ArrayList<VIEw>();     /**      * 为Adapter创建数据源      */     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);     ListVIEws.add(vIEw1);     ListVIEws.add(vIEw2);     ListVIEws.add(vIEw3);     pagerAdapter=new VIEwPagerAdapter(ListVIEws) ;     vIEwPager.setAdapter(pagerAdapter);    }  } 

5.运行实例：

可以实现翻页效果。

二 添加标题
1.我们需要更改main.xml文件：

<linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"   androID:layout_wIDth="match_parent"   androID:layout_height="match_parent" >    <androID.support.v4.vIEw.VIEwPager     androID:ID="@+ID/pager"     androID:layout_wIDth="wrap_content"     androID:layout_height="wrap_content"     androID:layout_gravity="center" >      <androID.support.v4.vIEw.PagerTabStrip       androID:ID="@+ID/strip"       androID:layout_wIDth="wrap_content"       androID:layout_height="wrap_content"       androID:layout_gravity="top" >     </androID.support.v4.vIEw.PagerTabStrip>   </androID.support.v4.vIEw.VIEwPager>  </linearLayout> 

2.需要更改适配器文件：

package com.yayun.vIEwpagerdemo;  import java.util.ArrayList; import java.util.List;  import androID.support.v4.vIEw.PagerAdapter; import androID.vIEw.VIEw; import androID.vIEw.VIEwGroup;  public class VIEwPagerAdapter extends PagerAdapter {   private List<VIEw> lVIEws=new ArrayList<VIEw>();   private List<String> TitleList=new ArrayList<String>();      public VIEwPagerAdapter(List<VIEw> lVIEws,List<String> TitleList){     this.lVIEws=lVIEws;     this.TitleList=TitleList;   }    @OverrIDe   public int getCount() {     return lVIEws.size();   }    @OverrIDe   public boolean isVIEwFromObject(VIEw arg0,Object object) {     container.removeVIEw(lVIEws.get(position));   }   /**    * 标题    */   @OverrIDe   public CharSequence getPageTitle(int position) {     // Todo auto-generated method stub     return TitleList.get(position);   }  } 

3.需要更改MainActivity.java文件：

package com.yayun.vIEwpagerdemo;  import java.util.ArrayList; import java.util.List;  import androID.support.v7.app.ActionBaractivity; import androID.support.v7.app.Actionbar; import androID.support.v4.app.Fragment; import androID.support.v4.vIEw.PagerAdapter; import androID.support.v4.vIEw.PagerTabStrip; import androID.support.v4.vIEw.VIEwPager; import androID.os.Bundle; import androID.vIEw.LayoutInflater; import androID.vIEw.Menu; import androID.vIEw.MenuItem; import androID.vIEw.VIEw; import androID.vIEw.VIEwGroup; import androID.vIEw.Window; import androID.os.Build;  public class MainActivity extends ActionBaractivity {   private VIEwPager vIEwPager;   private List<VIEw> ListVIEws=null;   VIEwPagerAdapter pagerAdapter;   PagerTabStrip pagerTabStrip;   private List<String> TitleList;    @OverrIDe   protected voID onCreate(Bundle savedInstanceState) {     super.onCreate(savedInstanceState);     requestwindowFeature(Window.FEATURE_NO_Title);     setContentVIEw(R.layout.activity_main);          vIEwPager=(VIEwPager) findVIEwByID(R.ID.pager);     pagerTabStrip=(PagerTabStrip) findVIEwByID(R.ID.strip);     ListVIEws=new ArrayList<VIEw>();     TitleList=new ArrayList<String>();     TitleList.add("第一页");     TitleList.add("第二页");     TitleList.add("第三页");     /**      * 为Adapter创建数据源      */     VIEw vIEw1=VIEw.inflate(this,null);     ListVIEws.add(vIEw1);     ListVIEws.add(vIEw2);     ListVIEws.add(vIEw3);     pagerAdapter=new VIEwPagerAdapter(ListVIEws,TitleList) ;     vIEwPager.setAdapter(pagerAdapter);    }  } 

4.运行实例如下：

三 实现VIEwPager(数据源为List<Fragment>)
1.首先我们要创建三个Fragment:

package com.yayun.vIEwpagerdemo;  import androID.os.Bundle; import androID.support.v4.app.Fragment; import androID.vIEw.LayoutInflater; import androID.vIEw.VIEw; import androID.vIEw.VIEwGroup;  public class Fragment1 extends Fragment {   @OverrIDe   public VIEw onCreateVIEw(LayoutInflater inflater,VIEwGroup container,Bundle savedInstanceState) {     return inflater.inflate(R.layout.vIEw1,container,false);   }  } package com.yayun.vIEwpagerdemo;  import androID.os.Bundle; import androID.support.v4.app.Fragment; import androID.vIEw.LayoutInflater; import androID.vIEw.VIEw; import androID.vIEw.VIEwGroup;  public class Fragment2 extends Fragment {   @OverrIDe   public VIEw onCreateVIEw(LayoutInflater inflater,Bundle savedInstanceState) {     return inflater.inflate(R.layout.vIEw2,false);   }  } package com.yayun.vIEwpagerdemo;  import androID.os.Bundle; import androID.support.v4.app.Fragment; import androID.vIEw.LayoutInflater; import androID.vIEw.VIEw; import androID.vIEw.VIEwGroup;  public class Fragment3 extends Fragment {   @OverrIDe   public VIEw onCreateVIEw(LayoutInflater inflater,Bundle savedInstanceState) {     return inflater.inflate(R.layout.vIEw3,false);   }  } 

2.设置Adapter:

package com.yayun.vIEwpagerdemo;  import java.util.List;  import androID.support.v4.app.Fragment; import androID.support.v4.app.FragmentManager; import androID.support.v4.app.FragmentPagerAdapter;  public class MyFragmentPagerAdapter extends FragmentPagerAdapter {   List<Fragment> fragmentsList;   List<String> TitleList;    public MyFragmentPagerAdapter(FragmentManager fm,List<Fragment> fragmentsList,List<String> TitleList) {     super(fm);     this.fragmentsList=fragmentsList;     this.TitleList=TitleList;   }    @OverrIDe   public Fragment getItem(int arg0) {     // Todo auto-generated method stub     return fragmentsList.get(arg0);   }    @OverrIDe   public int getCount() {     // Todo auto-generated method stub     return fragmentsList.size();   } @OverrIDe /**  * 添加标题  */ public CharSequence getPageTitle(int position) {   // Todo auto-generated method stub   return TitleList.get(position); }  } 

3.MainActivity.java:

package com.yayun.vIEwpagerdemo;  import java.util.ArrayList; import java.util.List;  import androID.graphics.color; import androID.os.Bundle; import androID.support.v4.app.Fragment; import androID.support.v4.vIEw.PagerTabStrip; import androID.support.v4.vIEw.VIEwPager; import androID.support.v4.vIEw.VIEwPager.Pagetransformer; import androID.support.v7.app.ActionBaractivity; import androID.vIEw.VIEw; import androID.vIEw.Window;  public class MainActivity extends ActionBaractivity {   private VIEwPager vIEwPager;   private List<VIEw> ListVIEws=null;   VIEwPagerAdapter pagerAdapter;   PagerTabStrip pagerTabStrip;   private List<String> TitleList;   private List<Fragment> fragmentsList;   MyFragmentPagerAdapter myFragmentPagerAdapter;    @OverrIDe   protected voID onCreate(Bundle savedInstanceState) {     super.onCreate(savedInstanceState);     requestwindowFeature(Window.FEATURE_NO_Title);     setContentVIEw(R.layout.activity_main);          vIEwPager=(VIEwPager) findVIEwByID(R.ID.pager);     pagerTabStrip=(PagerTabStrip) findVIEwByID(R.ID.strip);          /**      * 设置PagerTabStrip属性      */     pagerTabStrip.setBackgroundcolor(color.GREEN);     pagerTabStrip.setDrawFullUnderline(false);     pagerTabStrip.setTextcolor(color.WHITE);     ListVIEws=new ArrayList<VIEw>();     TitleList=new ArrayList<String>();     fragmentsList=new ArrayList<Fragment>();     fragmentsList.add(new Fragment1());     fragmentsList.add(new Fragment2());     fragmentsList.add(new Fragment3());     TitleList.add("第一页");     TitleList.add("第二页");     TitleList.add("第三页");     /**      * 为Adapter创建数据源      */     VIEw vIEw1=VIEw.inflate(this,TitleList) ;     myFragmentPagerAdapter=new MyFragmentPagerAdapter(getSupportFragmentManager(),fragmentsList,TitleList);     //vIEwPager.setAdapter(pagerAdapter);     vIEwPager.setAdapter(myFragmentPagerAdapter);    }  } 

4.运行实例：

这种方法不会销毁不在当前页面的页面，不能实现页卡的创建和销毁。

四 实现VIEwPager(数据源为List<Fragment>实现FargmentStatePagerAdapter)常用
改变Adapter:

package com.yayun.vIEwpagerdemo;  import java.util.List;  import androID.support.v4.app.Fragment; import androID.support.v4.app.FragmentManager; import androID.support.v4.app.FragmentPagerAdapter; import androID.support.v4.app.FragmentStatePagerAdapter; import androID.vIEw.VIEw;  public class MyFragmentPagerAdapter2 extends FragmentStatePagerAdapter {   List<Fragment> fragmentsList;   List<String> TitleList;    public MyFragmentPagerAdapter2(FragmentManager fm,List<String> TitleList) {     super(fm);     this.fragmentsList=fragmentsList;     this.TitleList=TitleList;   }    @OverrIDe   public Fragment getItem(int arg0) {     // Todo auto-generated method stub     return fragmentsList.get(arg0);   }    @OverrIDe   public int getCount() {     // Todo auto-generated method stub     return fragmentsList.size();   } @OverrIDe /**  * 添加标题  */ public CharSequence getPageTitle(int position) {   // Todo auto-generated method stub   return TitleList.get(position); } @OverrIDe public Object instantiateItem(VIEw container,int position) {   // Todo auto-generated method stub   return super.instantiateItem(container,position); } @OverrIDe public voID destroyItem(VIEw container,Object object) {   // Todo auto-generated method stub   super.destroyItem(container,position,object); }  } 

将MainActivity.java中的Adapter换一下即可，它可以实现页卡的创建和销毁。

五  onPagerchangelistener 监听使用
只需要修改MainActivity.java:

package com.yayun.vIEwpagerdemo;  import java.util.ArrayList; import java.util.List;  import androID.graphics.color; import androID.os.Bundle; import androID.support.v4.app.Fragment; import androID.support.v4.vIEw.PagerTabStrip; import androID.support.v4.vIEw.VIEwPager; import androID.support.v4.vIEw.VIEwPager.OnPagechangelistener; import androID.support.v4.vIEw.VIEwPager.Pagetransformer; import androID.support.v7.app.ActionBaractivity; import androID.vIEw.VIEw; import androID.vIEw.Window; import androID.Widget.Toast;  public class MainActivity extends ActionBaractivity implements OnPagechangelistener {   private VIEwPager vIEwPager;   private List<VIEw> ListVIEws=null;   VIEwPagerAdapter pagerAdapter;   PagerTabStrip pagerTabStrip;   private List<String> TitleList;   private List<Fragment> fragmentsList;   MyFragmentPagerAdapter myFragmentPagerAdapter;    @OverrIDe   protected voID onCreate(Bundle savedInstanceState) {     super.onCreate(savedInstanceState);     requestwindowFeature(Window.FEATURE_NO_Title);     setContentVIEw(R.layout.activity_main);          vIEwPager=(VIEwPager) findVIEwByID(R.ID.pager);     pagerTabStrip=(PagerTabStrip) findVIEwByID(R.ID.strip);          /**      * 设置PagerTabStrip属性      */     pagerTabStrip.setBackgroundcolor(color.GREEN);     pagerTabStrip.setDrawFullUnderline(false);     pagerTabStrip.setTextcolor(color.WHITE);     ListVIEws=new ArrayList<VIEw>();     TitleList=new ArrayList<String>();     fragmentsList=new ArrayList<Fragment>();     fragmentsList.add(new Fragment1());     fragmentsList.add(new Fragment2());     fragmentsList.add(new Fragment3());     TitleList.add("第一页");     TitleList.add("第二页");     TitleList.add("第三页");     /**      * 为Adapter创建数据源      */     VIEw vIEw1=VIEw.inflate(this,TitleList);     //vIEwPager.setAdapter(pagerAdapter);     vIEwPager.setAdapter(myFragmentPagerAdapter);     vIEwPager.setonPagechangelistener(this);//加载监听器    }    @OverrIDe   public voID onPageScrollStateChanged(int arg0) {     // Todo auto-generated method stub        }    @OverrIDe   public voID onPageScrolled(int arg0,float arg1,int arg2) {     // Todo auto-generated method stub        }    @OverrIDe   public voID onPageSelected(int arg0) {     Toast.makeText(this,"当前页面为"+(arg0+1),Toast.LENGTH_SHORT).show();        }  } 

运行实例即可以显示当前页面标签。

总结

以上是内存溢出为你收集整理的实例讲解Android中ViewPager组件的一些进阶使用技巧全部内容，希望文章能够帮你解决实例讲解Android中ViewPager组件的一些进阶使用技巧所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。