Transition Animation

activity_main.xml

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:onClick="onClick"
    tools:context=".MainActivity">

    <FrameLayout
        android:id="@+id/sceneRootFrameLayout"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_alignParentStart="true"
        android:layout_marginStart="8dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        android:padding="16dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

example_1.xml

<?xml version="1.0" encoding="utf-8"?>
<changeBounds
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="500"
        android:interpolator="@android:interpolator/linear">
</changeBounds>

example_2.xml

<?xml version="1.0" encoding="utf-8"?>
<transitionSet
        xmlns:android="http://schemas.android.com/apk/res/android">

</transitionSet>

example_3.xml

<?xml version="1.0" encoding="utf-8"?>
<explode
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="500"
        android:interpolator="@android:interpolator/linear"/>

example_4.xml

<?xml version="1.0" encoding="utf-8"?>
<slide
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="500"
        android:interpolator="@android:interpolator/linear" />

MainActivity.kt

package com.sriyank.transitionanimations

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.transition.Scene
import android.transition.Transition
import android.view.View
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

	private lateinit var scene1: Scene
	private lateinit var scene2: Scene
	private lateinit var currentScene: Scene
	private lateinit var transition: Transition

	override fun onCreate(savedInstanceState: Bundle?) {
		super.onCreate(savedInstanceState)
		setContentView(R.layout.activity_main)

		// Step 1: Create a Scene object for both the starting and ending layout
		scene1 = Scene.getSceneForLayout(sceneRootFrameLayout, R.layout.scene1, this)


		// Step 2: Create a Transition object to define what type of animation you want


		scene1.enter()
		currentScene = scene1
	}

	fun onClick(view: View) {
		// Step 3: Call TransitionManager.go() to run animation

	}
}

mickey_mouse.jpg

scene1.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/txvMario"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentBottom="true"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:gravity="center|start"
        android:maxLength="12"
        android:text="Mickey Mouse is a cartoon character and the mascot of The Walt Disney Company created in 1928 at Walt Disney Animation Studios. An anthropomorphic mouse who typically wears red shorts, large yellow shoes, and white gloves, Mickey is one of the world\'s most recognizable characters. Above all, it is my favorite childhood cartoon."
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textSize="24sp"
        app:layout_constraintBottom_toBottomOf="@+id/imgMario"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/imgMario"
        app:layout_constraintTop_toTopOf="parent" />

    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/imgMario"
        android:layout_width="77dp"
        android:layout_height="70dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="8dp"
        android:contentDescription="@null"
        android:src="@drawable/mickey_mouse"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0" />

</androidx.constraintlayout.widget.ConstraintLayout>

scene2.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/txvMario"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginTop="8dp"
        android:text="Mickey Mouse is a cartoon character and the mascot of The Walt Disney Company created in 1928 at Walt Disney Animation Studios. An anthropomorphic mouse who typically wears red shorts, large yellow shoes, and white gloves, Mickey is one of the world\'s most recognizable characters. Above all, it is my favorite childhood cartoon."
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textColor="#555"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imgMario" />

    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/imgMario"
        android:layout_width="0dp"
        android:layout_height="201dp"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:contentDescription="@null"
        android:src="@drawable/mickey_mouse"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/txvTitle" />

    <TextView
        android:id="@+id/txvTitle"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:gravity="center"
        android:text="My Childhood Favorite"
        android:textColor="#333"
        android:textSize="24sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.011" />

</androidx.constraintlayout.widget.ConstraintLayout>