The term “Android activity transitions” refers to a complex and multifaceted set of processes and mechanisms that are developed when moving between two distinct activities within an Android application. The goal of these transitions is to enhance an experience that is both seamlessly integrated such that the user is able to effortlessly glide between various constituent parts of the application.
Another prominent example of an activity transition is that of the slide transition, which involves a progressive and gradual sliding of one activity off of the screen, while a new activity simultaneously glides onto the screen in its place. Such a transition can be used to enhance a sense of continuity between different constituent parts of an application, such that the user feels as though they are still situated within the same application even as they are shifting and moving between various different activities.
Step-by-Step Implementation
Step 1: Create a New Project in Android Studio
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.
Step 2:
Create Two Activities to which you want to add animation. Here is my XML code for MainActivity
XML
<?xml version="1.0" encoding="utf-8"?><androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/purple_200" tools:context=".MainActivity"> <Button android:id="@+id/buttonOpenSecondActivity" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Click To Open Second Activity" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout> |
Code For Second Activity:
XML
<?xml version="1.0" encoding="utf-8"?><androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/teal_200" tools:context=".SecondActivity"> <Button android:id="@+id/buttonGoBack" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Go Back" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout> |
Step 3:
Create One Android Resource Directory of type “anim” in my case we are using directory name “anim” only
Step 4:
On that anim folder add the animations that you want to add in switching between two activities you have many options. Here is the list that we used.
slide_from_bottom.xml
XML
<!--slide from bottom--><?xml version="1.0" encoding="utf-8"?> android:duration="300"> <translate android:fromYDelta="100%" android:toYDelta="0%"/></set> |
slide_to_top.xml
XML
<?xml version="1.0" encoding="utf-8"?> android:duration="300"> <translate android:fromYDelta="0%" android:toYDelta="-100%"/></set> |
slide_from_left.xml
XML
<?xml version="1.0" encoding="utf-8"?> android:duration="300"> <translate android:fromXDelta="-100%" android:toXDelta="0%"/></set> |
slide_from_right.xml
XML
<?xml version="1.0" encoding="utf-8"?> android:duration="300"> <translate android:fromXDelta="100%" android:toXDelta="0%"/> </set> |
zoom_in.xml
XML
<?xml version="1.0" encoding="utf-8"?> android:duration="300"> <scale android:fromXScale="0.8" android:fromYScale="0.8" android:pivotX="50%" android:pivotY="50%" android:toXScale="1.0%" android:toYScale="1.0%" /> <alpha android:fromAlpha="0" android:toAlpha="1" /> </set> |
zoom_out.xml
XML
<?xml version="1.0" encoding="utf-8"?> android:duration="500"> <scale android:fromXScale="1.0" android:fromYScale="1.0" android:pivotX="50%" android:pivotY="50%" android:toXScale="0.8%" android:toYScale="0.8%" /> <alpha android:fromAlpha="1" android:toAlpha="0"/> </set> |
static_animation.xml:
XML
<?xml version="1.0" encoding="utf-8"?> android:duration="300"></set> |
These are some examples that we used for animation.
Step 5:
Use this animation in your activity to configure when the user clicks then show this animation
MainActivity.Java
Java
package com.android.gfgapplication; import androidx.appcompat.app.AppCompatActivity; import android.content.Intent;import android.os.Bundle;import android.view.View; public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); findViewById(R.id.buttonOpenSecondActivity).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { startActivity(new Intent(MainActivity.this,SecondActivity.class)); // for right to left animation // overridePendingTransition(R.anim.slide_from_right,R.anim.slide_to_left); // for bottom to top animation // overridePendingTransition(R.anim.slide_from_bottom,R.anim.slide_to_top); // for top to bottom animation // overridePendingTransition(R.anim.slide_from_top,R.anim.slide_to_bottom); // zoom-in animation // overridePendingTransition(R.anim.zoom_in,R.anim.static_animation); // zoom-out animation // overridePendingTransition(R.anim.static_animation,R.anim.zoom_out); } }); }} |
Output:
