GitHub Learning Magicviewpager for feature carousel switching effects

This article learn from Xiang Brother's library:

Https://github.com/hongyangAndroid/MagicViewPager

Implementation results:

Rotate Y

Rotate down

Rotate up

Alpha

Scalein

Scalein + Alpha + Rotate down

The effect has been pasted so much, see how it is done.

Add Dependencies:

‘com.zhy:magic-viewpager:1.0.1‘

Layout:

<?xml version= "1.0" encoding= "Utf-8"?><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  =" Com.example.wangchang.testviewpager.MainActivity ";     <framelayout  android: Layout_width  = "match_parent"  android:layout_ Height  = "160DP"  android:clipchildren  =         android:background  = "#aadc71ff" ;         <android.support.v4.view.viewpager  android:id  = a Ndroid:layout_width  = "match_parent"  android: Layout_marginleft  = "60DP"  android:clipchildr En  = android:layout_marginright= "60DP"  android:layout_height  = "120DP"  android:layout_gravity  = "center" ;         </Android.support.v4.view.ViewPager>    </framelayout></relativelayout>

The key here is to android:clipchildren= the reference to the "false" property. This property means that you do not trim their display when the child view is drawn, and the parent layout sub-layout needs to be referenced.

Activity

 PackageCom.example.wangchang.testviewpager;ImportAndroid.renderscript.Type;ImportAndroid.support.v4.view.PagerAdapter;ImportAndroid.support.v4.view.ViewPager;Importandroid.support.v7.app.AppCompatActivity;ImportAndroid.os.Bundle;ImportAndroid.view.View;ImportAndroid.view.ViewGroup;ImportAndroid.widget.ImageView;ImportAndroid.widget.Toast;ImportCom.zhy.magicviewpager.transformer.RotateDownPageTransformer;ImportCom.zhy.magicviewpager.transformer.ScaleInTransformer; Public  class mainactivity extends appcompatactivity {    PrivatePageradapter adapter;Private int[] IMGs = {R.DRAWABLE.IC_ACTIVITY_CN, R.DRAWABLE.IC_ENTERPRISE_CN, R.DRAWABLE.IC_PERSONAL_CN, R.drawable.ic_splash, R.mipmap.ic_launcher};@Override    protected void onCreate(Bundle savedinstancestate) {Super. OnCreate (Savedinstancestate);        Setcontentview (R.layout.activity_main);        Viewpager Mviewpager = (viewpager) Findviewbyid (R.id.id_viewpager); Mviewpager.setpagemargin ( -);//Set the space between page, set according to the requirementMviewpager.setoffscreenpagelimit (3);//>=3Mviewpager.setadapter (adapter =NewPageradapter () {@Override             Public int GetCount() {returnImgs.length; }@Override             Public Boolean Isviewfromobject(View view, Object object) {returnview = = object; }@Override             PublicObjectInstantiateitem(ViewGroup container,Final intPosition) {ImageView ImageView =NewImageView (mainactivity. This);                Imageview.setscaletype (ImageView.ScaleType.FIT_XY);                Imageview.setimageresource (Imgs[position]); Imageview.setonclicklistener (NewView.onclicklistener () {@Override                     Public void OnClick(View v) {Toast.maketext (mainactivity). This,"Viewpager"+position, Toast.length_short). Show ();                }                }); Container.addview (ImageView);returnImageView; }@Override             Public void Destroyitem(ViewGroup container,intPosition, Object object) {Container.removeview (View) object); }        });//Do not change the wording//setpagetransformer determining animation effectsMviewpager.setpagetransformer (true,NewScaleintransformer ()); }}

Here are the key points:

1.mviewpager.setpagemargin (20);//Set the spacing between page, set according to the requirement
2. Mviewpager.setoffscreenpagelimit (3);//Set a maximum number of displays per page
3. Mviewpager.setpagetransformer (True, New Scaleintransformer ());//Set Toggle animation effect.
Here Xiang elder brother gives a lot of very dazzling effect:

AlphaPageTransformerRotateDownPageTransformerRotateUpPageTransformerRotateYTransformerNonPageTransformerScaleInTransformer

can be added freely.

The implementation of combined animation

mViewPager.setPageTransformer(true,     new RotateDownPageTransformer(new AlphaPageTransformer(new ScaleInTransformer())));

Finally, stick to your own hands to achieve the effect:

Yes, it feels so good!

Thanks again for the selfless sharing of Brother Xiang!

GitHub Learning Magicviewpager for feature carousel switching effects