How to change the background transition in Android Studio in 5 minutes: Best Guide

In this tutorial, we will learn to change the background transition in Android Studio. We will be using AnimationDrawable for this project.

What if I told you that animations require less effort than you think? Have you ever heard about Transitions API? Yes, it is that thing promoted by Google for fancy animations between Activities. Sadly, it is available only starting from Android 5.0. So no one is actually using it. But imagine that this API can be efficiently used in many different cases and, what’s even more exciting, available on older Android versions.

Let’s start with some history

New animateLayoutChange parameter was introduced for ViewGroup in Android 4.0. But even with calling getLayoutTransition() and configuring some stuff inside it, it was still unstable and not flexible enough. So you couldn’t do much with it.

Change background transition in android
Change background transition in android

Version 4.4 Kitkat brings us idea of Scenes and Transitions. Scene is technically the state of all views in our Scene root (layout container). Transition is the set of Animators which will be applied for the view to perform smooth transition from the one scene to another. Will it be more fascinating with the examples? Yeah.

BONUS TUTORIAL : How to send email in Android using intent

Simple types of Transition

  • ChangeBounds. It animates changes to view position and size. This one moves the button in our example.
  • Fade. It extends Visibility class and performs most popular animations — fade in and fade out. In example it’s applied to TextView.
  • TransitionSet. It’s Transition that is actually a set of another Transitions. They can be started together or sequential, to change it call setOrdering.
  • AutoTransition. It’s TransitionSet that contains Fade out, ChangeBounds and Fade in in sequential order. At first, views that don’t exist in the second scene are faded out, then change bounds applied for changes of position and size, and, finally, new views appear with fade in. AutoTransition used by default when you don’t specify any transition in the second argument of beginDelayedTransition.

How to change the background transition in Android Steps:

MainActivity.java

In this, we are adding the AnimationDrawable to the layout ID which we have set on the XML file. setEnterFadeDuration will start the fade animation. Then, we will call start() to run the animation.

public class MainActivity extends AppCompatActivity {

    private ConstraintLayout layout;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        layout = findViewById(R.id.layout);

        AnimationDrawable animationDrawable = (AnimationDrawable) layout.getBackground();
        animationDrawable.setEnterFadeDuration(2000);
        animationDrawable.setExitFadeDuration(3000);
        animationDrawable.start();
    }


}

Acitivity_main.xml

Now to change the background transition in android , We have defined all the background layout we want in our apps in the drawable folder as background_list.xml. In this, we define a simple button over the background image.

<android.support.constraint.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"
    tools:context=".MainActivity"
    android:background="@drawable/background_list"
    android:id="@+id/layout"
    >

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/button_shape"
        android:paddingHorizontal="25dp"
        android:text="HELLO!"
        android:textSize="22dp"
    />

</android.support.constraint.ConstraintLayout>

Background_list.xml

In this XML, we start tag with <animation-list> and a series of nested <item>tags. These items are having the image name which is in the drawable folder and we cant set the duration also of each item.

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">

<item
    android:drawable="@drawable/image-one"
    android:duration="6000"/>

    <item
        android:drawable="@drawable/image-two"
        android:duration="6000"/>

    <item
    android:drawable="@drawable/image-three"
    android:duration="6000"/>
</animation-list>

Final Words

That’s it for this tutorial guys. I hope you liked the tutorial and may have got the right result which you wanted.If you face any problem while following this tutorial, please do let us know below in the comments section and we would try to help you out as soon as possible. This tutorial is not just about copying and pasting the code but to also understand about the various transitions and how they actually work in Android.

If you are into Android development or a newbie developer you can visit our Android development series by going to the How-To section of this website.

We Recommend

Don't Miss Out!

Get the very best of Android Hire in your inbox. News, How To,  Apps and games & Tutorials.