responsive animation in a splash activity using Android Studio

How To Add Responsive Animation In Splash Activity In Android Studio

You want to create an app or already created one but it may look a little bit bland if you don’t have a splash activity. Maybe you also have a Splash Activity but it may have no life to it. Adding animation to your Splash Activity will make it come to life and bring more responsive and premium looks and greater thoughts to your app!

In this article, we will learn how to create a responsive animation and add it to ImageView in our Splash Activity to make it feel like the app is loading.

Getting Started – Prerequisite

Before we get started, We will need to set up a few things. Make sure you have properly installed the latest version of Android Studio and Android SDK.

Then either create a new project or open an existing project in Android Studio. If you don’t have an existing Splash Activity in your project then follow this article to create one then follow the other steps:

How To Create A Beautiful Splash Activity In Android Studio

Now we are all set and ready to start following further processes animation to our splash activity.

Creating An Animation Resource File

Before we can add animation to our splash screen, we need to create an animation resource file. Here, we will show how to create a blink animation. Follow the steps below to create a resource file:

  • Create a New Directory named ‘anim‘ in the folder ‘res‘.
  • In the ‘anim‘ directory, create a new Animation Resource File. You can name it anything (e.g. blink)

Now we need to set attributions to make it work. As we want our image logo to blink, we will use Alpha and set some attributions as shown below in our Animation resource file:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
  <alpha
    android:fromAlpha="0.0"
    android:toAlpha="1.0"
    android:interpolator="@android:anim/accelerate_interpolator"
    android:duration="1000"
    android:repeatMode="reverse"
    android:repeatCount="infinite"
    />
  </set>

We set ‘interpolator‘ to ‘acceleration‘ and repeat mode to ‘reverse‘ as we want to make it reveal and disappear. We set the repeat count to ‘infinite’ as we don’t want the animation to stop. You can set the repeat count to 3-4 or more as you want.

So this is our basic animation, we can modify it later according to our needs and beautify it more. Now we will move on to the next steps to set this animation to our ImageView.

Adding Animation To ImageView

We will go to our Splash Activity Java File (e.g. YOUR_ACTIVITY.java). Now we need to import these classes along with other imports to use ImageView and Animation:

import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;

And add these lines also inside the ‘public class MainActivity‘ and before the ‘OnCreate‘ :

public ImageView imageView;
Animation animation;

Now in ‘OnCreate’ we will find our ImageView by its id. so, check your XML and copy the id you have given to it (if not added yet, then in the ImageView, add this attribution: android:id=”@+id/applogo” ):

imageView = findViewById(R.id.applogo);

Simply change the “applogo” with your image file name located in the Drawable folder.

Now we will load and set the animation to our ImageView By adding these Lines:

animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.blink);
imageView.setAnimation(animation);

Simply change the “blink” with your animation resource file name located in the Drawable folder.

So, Coding is Completed. Our Complete ACTIVITY_NAME.java file will look like this:

import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

public ImageView imageView;
Animation animation;

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

imageView = findViewById(R.id.applogo);
animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.blink);
imageView.setAnimation(animation);



}
}

CONGRATS!!

We Have Successfully Created A Responsive Splash Activity

Thanks For Allowing Us To Help You 🙂

If you are confused or want to know something, then let us know in the comment box, and we will reach you as soon as possible. Don’t Forget To Subscribe to our Newsletter, and YouTube Channel, and Like Our Facebook Page To Keep Updated With Awesome Things. Follow us on Twitter to stay updated with the latest news & changes.

Was this helpful?

Mahedi Zaman Zaber

I'm a Driven and ambitious individual who is currently pursuing a Bachelor of Science in Computer Science and Engineering. With a passion for innovation and a desire to make a lasting impact, I aspire to become a distinguished software engineer and entrepreneur.

More Reading

Post navigation

ZealTyro Blog We would like to show you notifications for the latest news and updates.
Dismiss
Allow Notifications