Viewpager switching the use of animation Pagetransformer

After Android has added property animations from 3.0, many of the hard-to-implement animations can be easily solved, and the Viewpager controls under the V4 package are no exception, and Google has shown us two animated examples, relative to the very mediocre default toggle animations: Depthpagetransformer and Z Oomoutpagetransformer, more dazzling.

In fact, we can also make a completely different transition animation effect by implementing the Viewpager.pagetransformer interface. The implementation of the Pagetransformer interface is as long as the implementation of a method: Transformpage (View view,float position), the method of two parameters is particularly important to understand it is our custom Viewpager animation focus.

Transformpage (View view,float position);

• The first parameter view is the name of the view that we need to swipe.
• The second argument position that the float type parameter is not what we normally understand, but rather a state of the sliding view, such as: when sliding to full screen, the position is 0, and the left side is sliding so that just one of the right is entered the screen, Position is 1, if the previous page and the next page in the basic screen in half, the previous page of position is-0.5, the next page of Posiotn is 0.5, so according to the value of position we can set our own alpha,scalex/y, parameter values such as translationx/y.

Below, we will take a look at the official Google provides two animation effects of the source and corresponding animation, understand the principle of custom animation can be modeled after the source:

Depthpagetransformer:

Import Android.annotation.suppresslint;import Android.support.v4.view.viewpager.pagetransformer;import Android.view.view;public class Depthpagetransformer implements Pagetransformer {private static float Min_scale = 0.75f    ; @SuppressLint ("Newapi") @Override public void transformpage (view view, float position) {int pagewidth = view        . GetWidth ();            if (Position <-1) {//[-infinity,-1]//This page is the off-screen of the left.        View.setalpha (0); } else if (position <= 0) {//[ -1,0]//use of the default slide transition when//moving to the L            EFT page View.setalpha (1);            View.settranslationx (0);            View.setscalex (1);        View.setscaley (1);            } else if (position <= 1) {//(0,1]//Fade the page out.            View.setalpha (1-position);          CounterAct the default slide transition View.settranslationx (PageWidth *-position);  Scale the PAGE down (between Min_scale and 1) Float scalefactor = Min_scale + (1-min_scale)            * (1-math.abs (position));            View.setscalex (Scalefactor);        View.setscaley (Scalefactor);            } else {//(1,+infinity]//This page is the off-screen of the right.        View.setalpha (0); }    }}

The effect is:

Zoomoutpagetransformer:

Import Android.support.v4.view.viewpager.pagetransformer;import Android.view.view;public class    Zoomoutpagetransformer implements Pagetransformer {private static float Min_scale = 0.85f;    private static float Min_alpha = 0.5f;        @Override public void Transformpage (view view, float position) {int pagewidth = View.getwidth ();        int pageheight = View.getheight ();            if (Position <-1) {//[-infinity,-1]//This page is the off-screen of the left.        View.setalpha (0); } else if (position <= 1) {//[ -1,1]//Modify The default slide transition to//shrink the Pag            e as well float scalefactor = Math.max (Min_scale, 1-math.abs (position));            float Vertmargin = PageHeight * (1-scalefactor)/2;            float Horzmargin = pagewidth * (1-scalefactor)/2;            if (Position < 0) {View.settranslationx (HORZMARGIN-VERTMARGIN/2); } else {VIew.settranslationx (-horzmargin + VERTMARGIN/2);            }//Scale the page is down (between Min_scale and 1) view.setscalex (scalefactor);            View.setscaley (Scalefactor);            Fade the page relative to its size.        View.setalpha (Min_alpha + (Scalefactor-min_scale)/(1-min_scale) * (1-min_alpha));            } else {//(1,+infinity]//This page is the off-screen of the right.        View.setalpha (0); }    }}

The effect is:

Let's take a look at how to use Viewpager to add animations.

is actually through Mviewpager.setpagetransformer (True, New Depthpagetransformer ());

Layout:

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android"    xmlns:tools= "http// Schemas.android.com/tools "    android:layout_width=" match_parent "    android:layout_height=" Match_parent "    tools:context= ". Mainactivity ">    <android.support.v4.view.viewpager        android:id=" @+id/viewpager "        android:layout _width= "Match_parent"        android:layout_height= "Match_parent"/></relativelayout>

Code:

public class Mainactivity extends Actionbaractivity {private int[] imageId = new Int[]{r.mipmap.bg,r.mipmap.one, R.MIP    Map.two, R.mipmap.three};        @Override protected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate);        Setcontentview (R.layout.activity_main);        Viewpager Mviewpager = (viewpager) Findviewbyid (R.id.viewpager); Mviewpager.setadapter (New Viewpageradapter (This,imageid));//Mviewpager.setpagetransformer (True, new        Zoomoutpagetransformer ());    Mviewpager.setpagetransformer (True,new Depthpagetransformer ());        } class Viewpageradapter extends Pageradapter {private arraylist<imageview> mimages;        Private int[] Imagesid;        Private context context;            Public Viewpageradapter (Context context,int[] resourceId) {this.context = context;            This.imagesid = resourceId;        Mimages = new arraylist<> (); } @Override Public Object InstantiAteitem (ViewGroup container, int position) {ImageView ImageView = new ImageView (context);            Imageview.setimageresource (Imagesid[position]);            Imageview.setscaletype (ImageView.ScaleType.CENTER_CROP);            Container.addview (ImageView);            Mimages.add (ImageView);        return imageView; } @Override public void Destroyitem (ViewGroup container, int position, object object) {//SUPER.D        Estroyitem (container, Position, object);//This line to be removed, or will error Container.removeview (Mimages.get (position));        } @Override public int getcount () {return imagesid.length;        } @Override Public Boolean isviewfromobject (view view, Object object) {return view==object; }    }}

Another point to note:

There are two implementations of the adapter for Viewpager:

• Direct inheritance of pageradapter, i.e.:

Class Viewpageradapter extends Pageradapter {private arraylist<imageview> mimages;        Private int[] Imagesid;        Private context context;            Public Viewpageradapter (Context context,int[] resourceId) {this.context = context;            This.imagesid = resourceId;        Mimages = new arraylist<> (); } @Override Public Object instantiateitem (viewgroup container, int position) {ImageView Imagevie            w = new ImageView (context);            Imageview.setimageresource (Imagesid[position]);            Imageview.setscaletype (ImageView.ScaleType.CENTER_CROP);            Container.addview (ImageView);            Mimages.add (ImageView);        return imageView; } @Override public void Destroyitem (ViewGroup container, int position, object object) {//SUPER.D        Estroyitem (container, Position, object);//This line to be removed, or will error Container.removeview (Mimages.get (position)); } @Override        public int GetCount () {return imagesid.length;        } @Override Public Boolean isviewfromobject (view view, Object object) {return view==object; }

• Inherit to Fragmentpageradapter: that is

Class Fragmentviewpageradapter extends fragmentpageradapter{        private final list<fragment> mfragments = new Arraylist<> ()///Add Fragment Collection public        Fragmentviewpageradapter (fragmentmanager FM) {            super (FM);        }        public void Addfragment (Fragment Fragment) {            mfragments.add (Fragment);        }        @Override public        Fragment getItem (int position) {            //Get Fragment return mfragments.get for the corresponding position            ( position);        }        @Override public        int GetCount () {            //returns the number of fragment return            mfragments.size ();}    }

All right, that's it.

Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.

Viewpager switching the use of animation Pagetransformer