Implementing the Android5.0 Transition Animation compatibility library

Android5.0 has provided us with a lot of cool interface transitions, in which the sharing element transition is also a very bright effect, but this effect can only be used after Android5.0, then today we will be the sharing element transition effect compatible to Android4.0, so that 5.0 before the phone can also experience this cool The effect of it.

A Transition Animation compatible Library.

Transition animations to Android4.0 after compatibility with Android5.0.

GitHub Address:Https://github.com/zhangke3016/TranslationCompat

In accordance with the Convention, first of all, the text of the idea:
first, the use of the page Transition compatibility library
Second, the page Transition compatible library implementation principle Analysis
Third, use the compatibility library to materiallogin the Open source project animation effect to Android4.0

Original Project address: Materiallogin The animation effect to Android4.0

First, the use of the page Transition compatibility library

The use of this compatibility library is also very simple, first, in the page to control the jump to invoke the TransitionController.getInstance().startActivity method to implement the jump, in which the current interface is passed to transition to another page of the transition element view, and the other page corresponding to the shared elements of the view ID value.
Then, in the second page of the jump to invoke the TransitionController.getInstance().show method to implement the transition of the element, the incoming parameters are also very simple.
Finally, when the page returns, the TransitionController.getInstance().exitActivity method can be called.
Such a complete interface transition animation is basically ready to use, of course, in order to make the implementation of the effect more cool, added to the transition animation state of listening, you can add their own actions at the end of the animation, for convenience, the compatibility library contains a circular element transition: The calling ViewAnimationCompatUtils.createCircularReveal method can realize the elements to expand and close the circle, The usage is consistent with the Viewanimationutils class, as well as the rectangle element transition: Invoke: The ViewAnimationCompatUtils.createRectReveal method can implement elements in a rectangular way to the left, top, right, and bottom four directions.
The specific code is as follows:

//Parameter I: Current Activity//Parameter two: Jump Intent//Parameter three: The current page jumps to the next page of view//Parameter four: The view ID associated with the next pageTransitioncontroller.getinstance (). StartActivity ( This,NewIntent ( This, Registeractivity.class), Fab,r.id.fab);//Jump after page call:Transitioncontroller.getinstance (). Show ( This, Getintent ()); You can set the listener before the Show method call: Transitioncontroller.getinstance (). Setenterlistener (NewTransitioncustomlistener () {@Override             Public void Ontransitionstart(Animator Animator) {            }@Override             Public void Ontransitionend(Animator Animator) {            }@Override             Public void Ontransitioncancel(Animator Animator) {            }        });//interface is called when it exitsTransitioncontroller.getinstance (). exitactivity (pagedetailactivity. This);//Increase the Circle conversion animation of the interface//usage and parameters consistent with ViewanimationutilsViewanimationcompatutils.createcircularreveal (Cvadd, cvadd.getwidth ()/2,0, Fab.getwidth ()/2, Cvadd.getheight ());//Increase the interface rectangle conversion animationAnimator manimator = Viewanimationcompatutils.createrectreveal (NSV,0, Nsv.getheight (), viewanimationcompatutils.rect_top);

Second, the page Transition compatible library implementation principle analysis

First, the use of this compatibility library, now to talk about how it is implemented, you can subdivide the main implementation of six steps:

1. Get the position of jump page transition element
2. Pass the position of the transition element to the next page
3. Get location information on the page you jump to and create the same wide and high-sized element and its parent container that overrides the screen, and add the newly created element to the parent container, and the parent container to the root view
4. Get the page element to jump to and set it to the background of the element being created
5, the current new element position and jump to the page comparison to get the zoom and move distance and start the animation, the end of the parent container hidden
6, the interface returns when the parent container is added back to the next page animation implementation, the created element is animated to return to the initial position, the end of the removal of the parent container

1. Get the position of jump page transition element

//rect 来存储共享元素位置信息new Rect();// 获取元素位置信息view.getGlobalVisibleRect(rect);

2. Pass the position of the transition element to the next page

// 将位置信息附加到 intent 上intent.setSourceBounds(rect);intent.putExtra(TRANSITION_NEXT_ID, nextShowViewId);

3. Get location information on the page you jump to and create the same wide and high-sized element and its parent container that overrides the screen, and add the newly created element to the parent container, and the parent container to the root view

View Virtalview = new View (activity);Bitmap Cachebitmap = Bitmaputil. Getcachebitmapfromview(Next_view);Gets the width and height of the element in the previous interface, final int moriginwidth = Mrect. Right-Mrect. Left;Final int moriginheight = Mrect. Bottom-Mrect. Top;Getbundleinfo (Next_view,moriginwidth,moriginheight,mrect);Create a parent container for the overlay screen Mcontainer = new Framelayout (activity);Framelayout. LayoutparamsMcontainerparams = new Framelayout. Layoutparams(ViewGroup. Layoutparams. MATCH_parent, ViewGroup. Layoutparams. MATCH_parent);Parent container added to root view in parent. AddView(Mcontainer,mcontainerparams);if (mbgcolor!=-1) Mcontainer. SetBackgroundColor(Contextcompat. GetColor(activity, Mbgcolor));Framelayout. Layoutparamsparams = new Framelayout. Layoutparams(Moriginwidth, Moriginheight);Params. SetMargins(Mrect. Left, Mrect. Top-Barutils. Getactionbarheight(activity)-getstatusbarheight (activity), Mrect. Right, Mrect. Bottom);Virtalview. Setbackgrounddrawable(New bitmapdrawable (activity. Getresources(), Cachebitmap));Create an element of the same wide and high size Virtalview. Setlayoutparams(params);Add the newly created element to the parent container Mcontainer. AddView(Virtalview);

4. Get the page element to jump to and set it to the background of the element being created

//Get the page element to jump toBitmap Cachebitmap = Bitmaputil.getcachebitmapfromview (Next_view);//Set it to the background of the creation elementVirtalview.setbackgrounddrawable (NewBitmapdrawable (Activity.getresources (), cachebitmap));/** * Gets the cached view of a view * * @param View * @return  */     Public StaticBitmapGetcachebitmapfromview(View view) {Final Booleandrawingcacheenabled =true;        View.setdrawingcacheenabled (drawingcacheenabled); View.builddrawingcache (drawingcacheenabled);FinalBitmap Drawingcache = View.getdrawingcache (); Bitmap Bitmap;if(Drawingcache! =NULL) {bitmap = Bitmap.createbitmap (Drawingcache); View.setdrawingcacheenabled (false); }Else{bitmap =NULL; }returnBitmap }

5, the current new element position and jump to the page comparison to get the zoom and move distance and start the animation, the end of the parent container hidden

      //Take the current new element position and jump to page comparison to get the zoom ratio and move distanceGetbundleinfo (Next_view,moriginwidth,moriginheight,mrect);//Start animationRunenteranim (Virtalview,next_view,mcontainer);/** * Calculate the scale, and the displacement distance * * @param  * *    Private void Getbundleinfo(View MView,intMoriginwidth,intMoriginheight,rect mrect) {//Calculate zoom ratioMscalebundle.putfloat (Scale_width, (float) Mview.getwidth ()/moriginwidth); Mscalebundle.putfloat (Scale_height, (float) Mview.getheight ()/moriginheight); Rect rect =NewRect (); Mview.getglobalvisiblerect (rect);//Calculate displacement distanceMtransitionbundle.putfloat (Transition_x, (rect.left+ (rect.right-rect.left)/2)-(Mrect.left + (mrect.right-mrect.left)/2)); Mtransitionbundle.putfloat (transition_y, (Rect.top + (rect.bottom-rect.top)/2)-(Mrect.top + (mrect.bottom-mrect.top)/2)); }/** * Simulation Entry animation */    Private void Runenteranim(View Next_view,FinalView Realnextview,FinalFramelayout mcontainer) {next_view.animate (). Setinterpolator (NewLinearinterpolator ()). Setduration ( -). ScaleX (Mscalebundle.getfloat (Scale_width)). ScaleY (Mscalebundle.getfloat (scale_height)) . Translationx (Mtransitionbundle.getfloat (transition_x)). Translationy (MTRANSITIONBUNDLE.GETFL Oat (transition_y)). Setlistener (NewAnimator.animatorlistener () {@Override             Public void Onanimationstart(Animator animation) {realnextview.setvisibility (View.gone);if(mtransitioncustomlistener!=NULL) {Mtransitioncustomlistener.ontransitionstart (animation); }            }@Override             Public void Onanimationend(Animator animation)                {mcontainer.setvisibility (View.gone); Realnextview.setvisibility (view.visible);if(mtransitioncustomlistener!=NULL) {mtransitioncustomlistener.ontransitionend (animation); }            }@Override             Public void Onanimationcancel(Animator animation) {if(mtransitioncustomlistener!=NULL) {Mtransitioncustomlistener.ontransitioncancel (animation); }            }@Override             Public void onanimationrepeat(Animator animation)    {            }        }); }

6, the interface returns when the parent container is added back to the next page animation implementation, the created element is animated to return to the initial position, the end of the removal of the parent container

/** * Simulated exit animation * /     Public void exitactivity(FinalActivity activity) {if(nresid!=-1&& mcontainer!=NULL){//To remove the parent container you created first from the previous page((ViewGroup) Activity.findviewbyid (window.id_android_content)). Removeview (Mcontainer);            Activity.finish (); Activity.overridependingtransition (0,0);//Add the created parent container back to the next page((ViewGroup) Mfirstactivity.findviewbyid (window.id_android_content)). AddView (Mcontainer); Mcontainer.setvisibility (view.visible);//Start animationMcontainer.getchildat (0). Animate (). Setinterpolator (NewLinearinterpolator ()). Setduration ( -). ScaleX (1). ScaleY (1). Translationx (0). Translationy (0). Setlistener (NewAnimator.animatorlistener () {@Override                         Public void Onanimationstart(Animator animation)                        {mfirstview.setvisibility (view.invisible); }@Override                         Public void Onanimationend(Animator animation)                            {mfirstview.setvisibility (view.visible); Mcontainer.setvisibility (View.gone);Remove parent container after//end((ViewGroup) Mfirstactivity.findviewbyid (window.id_android_content)). Removeview (Mcontainer);                            Mcontainer.removeallviews (); Mcontainer =NULL; Mfirstview =NULL; Mfirstactivity =NULL; }@Override                         Public void Onanimationcancel(Animator animation) {                        }@Override                         Public void onanimationrepeat(Animator animation)        {                        }                    }); }Else{activity.finish (); Activity.overridependingtransition (0,0); }    }

Third, use the compatibility library to materiallogin the Open source project animation effect to Android4.0

Here is simply the implementation of compatible Materiallogin,
First, the interface jumps, the calling TransitionController.getInstance().startActivity(this,new Intent(this, RegisterActivity.class),fab,R.id.fab); method can be both,
After that, jump to the registration page, call TransitionController.getInstance().setEnterListener set animation listener, at the end of the transition animation, call to ViewAnimationCompatUtils.createCircularReveal display the circular expansion effect, and finally return to the call TransitionController.getInstance().exitActivity(RegisterActivity.this); , the cool login page is implemented.

Project GitHub Address:Https://github.com/zhangke3016/TranslationCompat welcome star, Fork.

Implementing the Android5.0 Transition Animation compatibility library