Shared Element Transition in Android with Example
Shared Element Transition is one of the most seen animations in Android apps. This type of animation is used when we have to open an item from a ListView or RecyclerView. Shared Element Transition in Android determines how shared element views are animated from activity to activity or fragment to fragment. Now we will see the implementation of Shared Element Transition in our app with a simple example.
Implementation of Shared Element Transition in Android
In this example, we will create a simple app where we will create two activities with ImageView and implement transition animation between these two activities. A sample GIF is given below to get an idea about what we are going to do in this article. Note that we are going to implement this project using the Java language.
Step by Step Implementation
Step 1: Create a New Project
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 a New Empty Activity
Navigate to the app > java > your package name > right-click > New > Activity > Empty Activity and name the activity as MainActivity2.
Step 3: Working with the activity_main.xml file
Go to the activity_main.xml file and refer to the following code. Below is the code for the activity_main.xml file.
Step 4: Working with the activity_main2.xml file
Go to the activity_main2.xml file and refer to the following code. Below is the code for the activity_main2.xml file.
Step 5: Working with the MainActivity2.java file
Go to the MainActivity2.java file and refer to the following code. Below is the code for the MainActivity2.java file. Comments are added inside the code to understand the code in more detail.
Step 6: Working with the MainActivity.java file
Go to the MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.
Check out the app’s code: https://github.com/ChaitanyaMunje/GFGImageSlider/tree/SharedElementTransition