Animated Gradient Background in Android

Animated gradient background can be implemented in android app easily using XML and java code. Moving gradients background between different two or more gradients as animation makes your app more awesome. You may see this type of background color animation in instagram app. Instagram app keeps transforming background from one gradient to another beautifully.

You can easily add transforming gradients background in your android app easily using animation list. In this tutorial, you will learn to make moving gradient background in android using XML animator list and java code. You can add animation differently in android app but here we will show you one easiest way to add animation to your gradient background using XML.

Related:
Chat/Messaging App XML UI Design for Android
Drag and Drop Android Example
Simple Android Calculator App XML UI Design

How to Implement Transition Background Gradient

First let’s start by creating new android project Animated Gradient Android as app name & viralandroid.com as company domain and rest of all things leave default.

Android Gradient Drawables

Now we will create different gradient drawables with different color and file name. Here we create gradient_1.xml, gradient_2.xml and gradient_3.xml XML drawable files with gradient attributes android:angle, android:endColor and android:startColor. Following is the XML code of three drawable files.

res/drawable/gradient_1.xml


res/drawable/gradient_2.xml



res/drawable/gradient_3.xml


Now create a new XML drawable file android_gradient_list.xml and add the following code which contains the AnimationList, which is responsible to change the background color from one gradient to another. In the AnimationList tag, add 3 items and referring to the above 3 XML drawable files.

res/drawable/android_gradient_list.xml


XML Layout File

Open your app main XML layout file activity_main.xml and set background to the root layout (View or ViewGroup) of the activity where you want to add animated gradient background. Also give an id to that layout; we will need to refer in java activity file.

res/layout/activity_main.xml


Java Activity File

In java activity file you need to tell the animation list to start moving transaction using AnimationDrawer.start methoad and animationDrawable.setEnterFadeDuration, animationDrawable.setExitFadeDuration and .getBackground.

src/MainActivity.java

Now, run your app by clicking run button. You will see the animation between background gradient with different color like above screenshots.