Examples explain some advanced use techniques for Viewpager components in Android _android

We often see apps that use Viewpager, and on each page there is a slider to flag which page is currently on. There are Android.support.v4.view.PagerTitleStrip and android.support.v4.view.PagerTabStrip two components in the Pagerview package, which can be used as a child label for Viewpager in the layout file and Sets the position relative to the Viewpager (for example, top). But these two components are ugly, and the title will slide along with the page, so generally not.

In fact, the implementation of a slider mark the current page is also very simple, probably need two steps:

The first step is to place a ImageView component above the layout file Viewpager, which can be either a picture or a shape resource. Note that the ImageView ScaleType attribute needs to be set to matrix, which means that the position and size of the component are controlled by a transformation matrix;

The second step is to add a Onpagechangelistener listener for the Viewpager component in the activity. Set the matrix in the Onpagechangelistener to control where the slider ImageView. The listener needs to implement three methods:

Onpagescrollstatechanged: A change to monitor the sliding state

Onpagescrolled: An action used to monitor a slide

onpageseleted: A switch for listening to a page in which a page is selected as the current page.

The general implementation of the Onpageselected method can be, the other two methods can be empty. In addition, in order for the page to switch the slider is also smooth sliding, you can give the slider ImageView specify a translateanimation animation, specify animation with Setanimation,tranlateanimation is also very simple, There is a constructor that is translateanimation (int beginx,int endx,int beginy,int EndY) and passes the starting and ending position of the motion vector to it.

Here's a look at five specific examples:

One implementation Viewpager (data source is list<view>)

1. First add a viewpager to the Main.xml file:

<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. Create three view:

 <?xml version= "1.0" encoding= "Utf-8"?> <linearlayout "xmlns:android=" Schemas.android.com/apk/res/android "android:layout_width=" match_parent "android:layout_height=" Match_parent "and 
    roid: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:tex t= "First page" > </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:o" rientation= "vertical" > 
 
  <textview 
    android:id= "@+id/txt2" android:layout_width= "Wrap_content" 
    android:layout_height= "wrap_content" 
    android:text= "second page" > 
  </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:o" rientation= "vertical" >
  
  <textview
    android:id= "@+id/txt3" android:layout_width= "WRAP_"
    Content "
    android:layout_height=" wrap_content "
    android:text=" third page ">
  </TextView>
  
</LinearLayout>

3. Create a Viewpager adapter class:

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> (); C8/>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> (); 
    /** * Create data source for 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. Run instance:

You can achieve a paging effect.

Two Add a title
1. We need to change the Main.xml file:

<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. Need to change adapter file:

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 arg1) {return arg0==arg1; @Override public Object Instantiateitem (viewgroup container, int position) {Container.addview Lviews.get (pos 
    ition)); 
  return Lviews.get (position); @Override public void Destroyitem (ViewGroup container, int position, object object) {Container.removeview (lViews.get (position)); /** * Title * * @Override public charsequence getpagetitle (int position) {//TODO auto-generated Meth 
  OD stub return titlelist.get (position); 
 } 
 
}

3. Need to change the Mainactivity.java file:

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 ("first page"); 
    Titlelist.add ("second page"); 
    Titlelist.add ("third page"); 
    /** * Create data source for 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,titlelist); 
 
  Viewpager.setadapter (Pageradapter); 

 } 
 
}

4. The running example is as follows:

Three implementation Viewpager (data source is list<fragment>)
1. First we want to create three 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 cont 
  Ainer, 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, ViewGroup cont 
  Ainer, Bundle savedinstancestate) {return inflater.inflate (R.layout.view2, 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 Fragment3 extends Fragment {@Override public View oncreateview (layoutinflater inflater, ViewGroup cont 
  Ainer, Bundle savedinstancestate) {return inflater.inflate (R.LAYOUT.VIEW3, container, false); 

 } 
 
}

2. Set 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 a stub return fragmentslist. 
  Get (ARG0); 
  @Override public int GetCount () {//TODO auto-generated a stub return fragmentslist.size (); 
  @Override/** * Add title */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); 
    /** * Set the Pagertabstrip property * * 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 ("first page"); 
    Titlelist.add ("second page"); 
    Titlelist.add ("third page"); 
    /** * Create data source for 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,tiTlelist); 
    Myfragmentpageradapter=new Myfragmentpageradapter (Getsupportfragmentmanager (), fragmentslist, titleList); 
    Viewpager.setadapter (Pageradapter); 
 
  Viewpager.setadapter (Myfragmentpageradapter); 

 } 
 
}

4. Run instance:

This method does not destroy pages that are not on the current page, and cannot implement the creation and destruction of page cards.

Four implementation Viewpager (data source for list<fragment> implementation fargmentstatepageradapter) commonly used
Change 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<fragment> fragmentslist,list<string> titlelist) 
    {super (FM); 
    This.fragmentslist=fragmentslist; 
  This.titlelist=titlelist; @Override public Fragment getitem (int arg0) {//TODO auto-generated a stub return fragmentslist. 
  Get (ARG0); 
  @Override public int GetCount () {//TODO auto-generated a stub return fragmentslist.size (); @Override/** * Add title */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 retur 
n Super.instantiateitem (container, position);  
  @Override public void Destroyitem (View container, int position, object object) {//TODO auto-generated the method stub 
Super.destroyitem (container, Position, object); 
 } 
 
}

Change the adapter in the Mainactivity.java, which enables the creation and destruction of page cards.

Five Onpagerchangelistener listening and using
only need to modify 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); 
    /** * Set the Pagertabstrip property * * 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 ("first page"); 
    Titlelist.add ("second page"); 
    Titlelist.add ("third page"); 
    /** * Create data source for 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,titlelist); 
    Myfragmentpageradapter=new Myfragmentpageradapter (Getsupportfragmentmanager (), fragmentslist, titleList); 
    Viewpager.setadapter (Pageradapter); 
    Viewpager.setadapter (Myfragmentpageradapter); 
    Viewpager.setonpagechangelistener (this);//Load listener} @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) {T 
     
  Oast.maketext (This, "current page is" + (arg0+1), Toast.length_short). Show (); 

 } 
 
}

Run the instance to display the current page label.