How to Animate your Android App

In Android  |  Last Updated on Sun, 08 May 2016

 Hi, Today I am going to talk about How to Animate your Android Application. In todays Android Market most of the App  use Animation. It may be tween Animation or transition or may be both .In this post I am going  to work with tween Animation. In this example you will know  how your  Animation starts Automatically when a apps start. We will use scale Animation  in this Application without  working with  height and width of a image. At the Initial stage your image will be invisible but it slowly grow  to its original size. Let’s start the application.


Prerequisites:
 

• JDK 7.0 or Above
• Android Studio 2.0

Steps to follow:  
 

1. Create a New Android Studio project name AnimationExample.
2. Select minimum API level 21 as some of the Animation will run from this Application.Select Empty Activity and your Activity name is MainActivity click next.
3. Give your layout xml name is  activity_main And click finish .
4. Now inside MainActivity write the following  code

 

 import android.animation.ObjectAnimator;
import android.animation.PropertyValuesHolder;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
 
public class MainActivity extends AppCompatActivity {
 
    private View container;
    private View hello;
    private View Profile;
 
    private boolean playAnimations = true;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        container = findViewById(R.id.container);
        hello = findViewById(R.id.welcome);
        Profile = findViewById(R.id.profile);
    }
 
 
    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        super.onWindowFocusChanged(hasFocus);
 
        if(hasFocus && playAnimations){
            showContainer();
            showOtherItems();
            playAnimations = false;
        }
    }
 
    private void showContainer() {
 
        container.animate().alpha(1f).setDuration(1000);
 
 
    }
 
 
     private void showOtherItems() {
 
         float startXhello = 0 - hello.getWidth();
 
         float endXhello = hello.getX();
 
         ObjectAnimator Animhello = ObjectAnimator.ofFloat(hello, View.X, startXhello, endXhello);
 
         Animhello.setDuration(1500);
         hello.setVisibility(View.VISIBLE);
         Animhello.start();
 
         PropertyValuesHolder scaleXHolder = PropertyValuesHolder.ofFloat(View.SCALE_X, 1f);
 
         PropertyValuesHolder scaleYHolder = PropertyValuesHolder.ofFloat(View.SCALE_Y, 1f);
 
         ObjectAnimator AnimProfile = ObjectAnimator.ofPropertyValuesHolder(Profile, scaleXHolder, scaleYHolder);
 
         AnimProfile.setDuration(1500);
 
         AnimProfile.start();
 
 
     }
 
 }
 

And your layout is like below
 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.prosen.animationexample.MainActivity"
    android:background="#DADADA">
 
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentStart="true"
        android:background="#FFFFFF"
        android:id="@+id/container"
        android:alpha="0"
        android:weightSum="1"
        android:layout_alignParentEnd="true">
 
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/profile"
            android:layout_gravity="center_horizontal"
            android:layout_weight="0.14"
            android:scaleX="0"
            android:scaleY="0"
            android:src="@drawable/empty_user" />
 
        <TextView
            android:layout_width="296dp"
            android:layout_height="43dp"
            android:text="Hello! Sign in to your Account please"
            android:id="@+id/welcome"
            android:layout_gravity="center_horizontal"
            android:textSize="17sp"
            android:textStyle="bold"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"
            android:visibility="invisible" />
 
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/userneme"
            android:layout_gravity="center_horizontal"
            android:hint="Username" />
 
        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textPassword"
            android:ems="10"
            android:id="@+id/password"
            android:layout_gravity="center_horizontal"
            android:hint="password" />
 
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Sign in"
            android:id="@+id/sign_in"
            android:layout_gravity="center_horizontal"
            android:layout_marginTop="10dp" />
    </LinearLayout>
 
</RelativeLayout>