Activity transition

Keywords: Android Attribute

Reference resources:

Android 5.0's Activity Transition Animation

Material Designer's Low Version Compatibility Implementation (V) - Activity Options Compat

System built-in common transit animation:

//              You must call it immediately after StartActivity() or finish().               
                Intent intent = new Intent(MainActivity.this, MainActivityI.class);
                startActivity(intent);
                overridePendingTransition(android.R.anim.slide_in_left, android.R.anim.slide_out_right);
                overridePendingTransition(android.R.anim.fade_in, android.R.anim.fade_out);

Android 5.0 Transition Animation

1,ActivityOptionsCompat.makeCustomAnimation(context, enterResId, exitResId)

Simply make a custom animation. This parameter is very simple. Pass in the id of an incoming animation and remove the id of the animation.

Similar to: override Pending Transition.

//Similar to: override Pending Transition (R).anim.slide_bottom_in, R.anim.slide_bottom_out);
//It would be better to use this full version of override Pending Transition directly.
ActivityOptionsCompat options = ActivityOptionsCompat.makeCustomAnimation(MainActivity.this,
                        R.anim.slide_bottom_in, R.anim.slide_bottom_out);
Intent intent = new Intent(MainActivity.this, MainActivityI.class);
startActivity(intent, options.toBundle());

2,ActivityOptionsCompat.makeScaleUpAnimation(source, startX, startY, startWidth, startHeight)

This is useful on 4.x, enabling a new Activity to expand from a fixed coordinate to a full screen in a certain size.

It is a good display effect for albums.

//Let the new activity expand from a small range (such as a button for the first activity) to a full screen
ActivityOptionsCompat options = ActivityOptionsCompat.makeScaleUpAnimation(btn2,
                        btn2.getWidth() / 2, btn2.getHeight() / 2, //The coordinates of the beginning of stretching
                        0, 0);//The size of the area at which the stretch begins, where (0, 0) is used to indicate from scratch to full screen
Intent intent = new Intent(MainActivity.this, MainActivityI.class);
startActivity(intent, options.toBundle());

3,ActivityOptionsCompat.makeSceneTransitionAnimation(activity, sharedElement, sharedElementName)

When you need an element in the current interface to be related to an element in the new interface, you can use this animation:

1. No shared elements:

Start the activity:

                ActivityOptionsCompat optionsCompat = ActivityOptionsCompat.makeSceneTransitionAnimation(MainActivity.this);
                Intent intent = new Intent(MainActivity.this, MainActivityI.class);
                startActivity(intent, optionsCompat.toBundle());

The second activity:

public class MainActivityI extends AppCompatActivity {

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {

        //Setting permission to use transit animation
        getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);

        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_maini);

//        Slip into
        Slide slide = new Slide();
        slide.setDuration(2000);
        getWindow().setExitTransition(slide);//Go Out 1 Animation
        getWindow().setEnterTransition(slide);//Coming in animation

//        decompose
//        Explode explode = new Explode();
//        explode.setDuration(2000);
//        getWindow().setExitTransition(explode); // Go out animation
//        getWindow().setEnterTransition(explode); // Coming in animation

//        Fade in and fade out
//        Fade fade = new Fade();
//        fade.setDuration(2000);
//        getWindow().setExitTransition(fade); // Go out animation
//        getWindow().setEnterTransition(fade); // Coming in animation
    }


}

2. There is a shared element:

(1) Add android:transitionName= "mybtn1" to the shared elements in the layout:

  <Button
            android:id="@+id/btn2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="Jump activity animation"
            android:transitionName="mybtn1" />

(2) In activity

                Bundle bundle = ActivityOptions.makeSceneTransitionAnimation(MainActivity.this, btn2, "mybtn1").toBundle();
                Intent intent = new Intent(MainActivity.this, MainActivityI.class);
                startActivity(intent, bundle);

The parameter btn2: represents the shared element in the first and second activities (that is, the Button).
The parameter "mybtn1": represents the value of the transitionAnimation attribute in the layout file.

In the second activity

(1) Add android:transitionName to shared elements in the layout:

Note: The transitionName name should correspond and be the same.

    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="The first button of the second interface"
        android:transitionName="mybtn1" />

(2) Do nothing in activity

3. There are several shared elements:

What if there are multiple shared elements in two pages?
Android: The transitionName property is also set as above, and then we can set multiple shared elements by Pair.create method when we start Activity.

Start the activity:

(1) Add android:transitionName attribute to the shared elements in the layout, and customize the name:

        <Button
            android:id="@+id/btn2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="Jump activity animation"
            android:transitionName="mybtn1" />

        <Button
            android:id="@+id/btn3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="The second button of the first interface"
            android:transitionName="mybtn2" />

(2) In activity

Bundle bundle = ActivityOptions
    .makeSceneTransitionAnimation(MainActivity.this, 
     Pair.create(((View) btn2), "mybtn1"), 
     Pair.create(((View) btn3), "mybtn2"))
    .toBundle();
Intent intent = new Intent(MainActivity.this, MainActivityI.class);
startActivity(intent, bundle);

There are two parameters in Pair.create method.
The first is an instance of a shared element (note the View type).
The second parameter is the value of the transitionAnimation attribute of the View.

In the second activity

(1) Add android:transitionName to shared elements in the layout:

Note: The transitionName name should correspond and be the same.

    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="The first button of the second interface"
        android:transitionName="mybtn1" />

    <Button
        android:id="@+id/btn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:text="The second button of the second interface"
        android:transitionName="mybtn2" />

(2) Do nothing in activity

Posted by asolell on Tue, 21 May 2019 13:52:37 -0700