How to Apply View Animations Effects in Android?

Android View Animations are used to apply amazing animations on TextView and EditText in the android application. Such animations provide the app with a smooth look in a new way. In this article, we are going to develop the Android View Animation effect in Android Studio.

What we are going to build in this article? 

In this article, we will develop a sample application with the TextView animation effect over its activity. A sample gif 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 Java language. 

Step by Step Implementation

Step 1: Create a New Project

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language.

Step 2: Add dependency

Now, Navigate to the Gradle Scripts > build.gradle(Module:app) add the below dependencies in the dependencies section.

Java

implementation 'com.daimajia.androidanimations:library:2.4@aar'

Now, sync your project and now we have everything which we will need during implementation so now, move towards its implementation.  

Step 3: Working with the activity_main.xml file

Now, go-to the app >res > layout > activity_main.xml and paste the below-written code in the activity_main.xml file.

XML

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    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:id="@+id/relative_layout"
    tools:context=".MainActivity">

    <!-- TextView to display text-->
    <TextView
        android:id="@+id/textView"
        android:layout_width="750px"
        android:layout_height="200px"
        android:layout_centerInParent="true"
        android:fontFamily="sans-serif-black"
        android:text="GeeksForGeeks"
        android:textColor="#4CAF50"
        android:textSize="35dp" />

    <!--Button to perform click event-->
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/textView"
        android:layout_centerInParent="true"
        android:background="#4CAF50"
        android:text="Click Me" />

</RelativeLayout>

Step 4: Working with the MainActivity.java file

Go to the app > java > package name > MainActivity.java file and refer to the following code. Below is the code for the MainActivity.java file. Comments are added inside the code to understand the code in more detail.

Java

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

import androidx.appcompat.app.AppCompatActivity;
import com.daimajia.androidanimations.library.Techniques;
import com.daimajia.androidanimations.library.YoYo;

public class MainActivity extends AppCompatActivity {

   // declaring textView
   TextView textView;

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

        // initializing textView by findViewById
        textView= findViewById(R.id.textView);

        // initializing button by findViewById
        button= findViewById(R.id.button);

        // apply click event to button
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                // making animated textView using YoYo.with()
                // Tada can be replaced with other animation Effects
                YoYo.with(Techniques.Tada)
                        .duration(700)
                        .repeat(5)
                        .playOn(findViewById(R.id.textView));
            }
        });
    }
}

Note: 

We can also use other animation effects like Tada. A list of some beautiful effects are given below with their categories:

• Attention: Flash, Pulse, RubberBand, Shake, Swing, Wobble, Bounce, Tada, StandUp, Wave
• Special:  Hinge, RollIn, RollOut,Landing,TakingOff,DropOut
• Bounce:  BounceIn, BounceInDown, BounceInLeft, BounceInRight, BounceInUp
• Fade:  FadeIn, FadeInUp, FadeInDown, FadeInLeft, FadeInRight, FadeOut, FadeOutDown, FadeOutLeft, FadeOutRight, FadeOutUp
• Flip:  FlipInX, FlipOutX, FlipOutY
• Rotate:  RotateIn, RotateInDownLeft, RotateInDownRight, RotateInUpLeft, RotateInUpRight, RotateOut, RotateOutDownLeft, RotateOutDownRight, RotateOutUpLeft, RotateOutUpRight
• Slide:  SlideInLeft, SlideInRight, SlideInUp, SlideInDown, SlideOutLeft, SlideOutRight, SlideOutUp, SlideOutDown
• Zoom:  ZoomIn, ZoomInDown, ZoomInLeft, ZoomInRight, ZoomInUp, ZoomOut, ZoomOutDown, ZoomOutLeft, ZoomOutRight, ZoomOutUp

That’s all, now the application is ready to install on the device. Here is what the output of the application looks like.

Output: