Android 5.x-Transition Animation Transition

Source: Internet
Author: User

Android 5.x provides transition animations in 3:

    • Enter : An incoming transition (animation) determines how all views in the activity enter the screen
    • exit : An exit transition (animation) determines how all views in an activity exit the screen.
    • shared elements : A shared element transition (animation) determines the transition between two activities, how to share (their) views

Transition animations with the following entry and exit:

    • Explode (decomposition)--enter/exit to move the view from the middle of the screen;
    • Slide (swipe)--Enter/exit the cave view from the edge of the screen;
    • Fade (Fade Out)-the effect of entering/exiting a view by changing the opacity of the on-screen view

On the basis of the above animation can also be added to the transition of shared elements, the effect of sharing elements is based on the decomposition of animation based on, the sharing element transition is shared 2 activity in the common elements, in the process of page switching, sharing elements as if independent of the 2 activity page, the effect is as follows:

Shared elements support the following effects:

    • changebounds--change the layout interface of the target view;
    • changeclipbounds--clipping the target view boundary;
    • changetransform--Change the zoom scale and rotation angle of the target view;
    • changeimagetransform--change the size and scale of the target image

The above diagram allows you to understand the transition of shared elements. The Android robot in activity 1 and Activity 2 is the common shared element of the setup, while activity 1 jumps to activity 2, the Android robot is translated, scaled, and eventually achieves the effect of activity 2.

transition Animations Use:

1. Add in activity to use transition animations:

// 允许使用transitions,需要放在setContentView之前  getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS); 

Or add in the layout style:

<itemname="android:windowContentTransitions">true</item

2. Different animation effects:

    • Enter animation
getWindow().setEnterTransitionExplode());getWindow().setEnterTransitionSlide());getWindow().setEnterTransitionFade());
    • Exit animation
getWindow().setExitTransitionExplode());getWindow().setExitTransitionSlide());getWindow().setExitTransitionFade());

3, activity jump start animation effect:

startActivity(intent,ActivityOptions.makeSceneTransitionAnimation(this).toBundle());

4. Set the shared element animation:

    • Use the Android:transitionname property to assign an identical name to the shared element in two layouts (the name must be the same)

Shared elements defined in activity 1

<ImageView        Android:id="@+id/iv_shared_img"        Android:layout_width="10DP"        Android:layout_height="10DP"        Android:scaletype="Centerinside"        android:src="@drawable/sun"        android:padding="10DP"        Android:transitionname="Sun"        Android:layout_margin="10DP"        android:textsize="15SP"/>    <ImageView        Android:transitionname="Sheep"        Android:id="@+id/iv_sheep_img"        Android:layout_width="10DP"        Android:layout_height="10DP"        Android:scaletype="Centerinside"        android:src="@drawable/sheep"        android:padding="10DP"        Android:layout_margin="10DP"        android:textsize="15SP"/>

Shared elements defined in activity 2

<ImageView        Android:id="@+id/iv_shared_img"        Android:layout_width="100DP"        Android:layout_height="100DP"        Android:layout_alignparentright="true"        android:layout_gravity="Right"        Android:layout_margin="10DP"        Android:layout_marginright="20DP"        android:padding="10DP"        Android:scaletype="Centerinside"        android:src="@drawable/sun"        android:textsize="15SP"        Android:transitionname="Sun"/>    <ImageView        Android:id="@+id/iv_sheep_img"        Android:layout_width="100DP"        Android:layout_height="100DP"        Android:layout_alignparentbottom="true"        Android:layout_alignparentright="true"        Android:layout_margin="10DP"        Android:layout_marginbottom="40DP"        Android:layout_marginright="40DP"        android:padding="10DP"        Android:scaletype="Centerinside"        android:src="@drawable/sheep"        android:textsize="15SP"        Android:transitionname="Sheep"/>
    • Use the Activityoptions.makescenetransitionanimation () method to start a shared animation

If there is only one shared element, use the

startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(mAty, Pair.create((View)                                mIv_sun_img,                        "sun")).toBundle());

The first parameter in Pair.create (view,string) is the View object that shares the element, and the second parameter is the Android:transitionname property value of the binding.

If there are multiple shared elements, the following code uses the

startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(mAty, Pair.create((View)                        mIv_sun_img, "sun"),Pair.create(mv_sheep,"sheep")).toBundle());

Demo

Android 5.x-Transition Animation Transition

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.