Skip to content
Related Articles
Open in App
Not now

Related Articles

Background Color Transition Animation in Android

Improve Article
Save Article
Like Article
  • Last Updated : 06 Feb, 2022
Improve Article
Save Article
Like Article

In Android, animations can be applied to any UI element to make the application look more appealing. There are many pre-defined animations available to use in Android. However, custom animations can be created in XML format and applied to UI elements. Once such animation is color transition and in this article, we shall implement a color-changing transition to the background in Android. A sample video 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 Kotlin language. 

Follow the below steps once the IDE is ready.

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. We demonstrated the application in Kotlin, so make sure you select Kotlin as the primary language while creating a New Project.

Step 2: Working with the activity_main.xml file

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file. Add a Button as shown below.


<?xml version="1.0" encoding="utf-8"?>

Step 3: Working with the MainActivity.kt file

Go to the MainActivity.kt file and refer to the following code. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.


package org.geeksforgeeks.changingbackgroundanimation
import android.os.Bundle
import android.widget.Button
import android.widget.RelativeLayout
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        // Declaring and initializing the
        // elements from the layout file
        val mRelativeLayout = findViewById<RelativeLayout>(
        val mButton = findViewById<Button>(
        // Creating an array of two colors
        val mColors = arrayOf(ColorDrawable(Color.GREEN), ColorDrawable(Color.RED))
        // When button is clicked, A transition is created
        // and applied to the background with specified duration
        mButton.setOnClickListener {
            val mTransition = TransitionDrawable(mColors)
            mRelativeLayout.background = mTransition


You can see that the background color changes from green to red in 2 seconds.

My Personal Notes arrow_drop_up
Like Article
Save Article
Related Articles

Start Your Coding Journey Now!