Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 

  • How to implement animation on custom view in android?

    @arvind.kumar
    Recommendations Offline Message

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 813
    Comment on it

    In this tutorial, we will know that how to implement animation on our custom view in android through a simple example using a Library AndroidViewAnimations. The Animation is a technique which can effect  to any still view. In this tutorial, we will create a simple form and then will use animation to see effect and movement. Use following steps to implement animation technique in your  project.

    Step1- Adding support library in the dependencies

    To compile this library, we will add app's dependencies file. Open project build.gradle file and add this library. It will compile library at run time.

    1. dependencies {
    2.      compile 'com.nineoldandroids:library:2.4.0'
    3.      compile 'com.daimajia.easing:library:1.0.1@aar'
    4.      compile 'com.daimajia.androidanimations:library:1.1.3@aar'
    5.      compile 'com.android.support:recyclerview-v7:23.1.1'
    6. }

    Step2- Implementation of Animation on any custom view

    We will use with(), duration() and  playOn method. These method used to make animation on your view.

    1. YoYo.with(Techniques.Tada) // Tada is a Animation type.
    2.     .duration(700)
    3.     .playOn(Your view);

    Step3- Creating a layout

    Next, we will create a form view. So we have one EditText and one Button view in this layout. On button click, we will perform animation effect.

    1. <?xml version="1.0" encoding="utf-8"?>
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    3.     android:orientation="vertical"
    4.     android:layout_width="match_parent"
    5.     android:padding="@dimen/activity_horizontal_margin"
    6.     android:layout_height="match_parent">
    7.  
    8.     <LinearLayout
    9.         android:padding="@dimen/activity_horizontal_margin"
    10.         android:id="@+id/edit_area"
    11.         android:orientation="vertical"
    12.         android:layout_width="match_parent"
    13.         android:layout_height="wrap_content">
    14.  
    15.         <EditText
    16.             android:hint="Username"
    17.             android:layout_width="match_parent"
    18.             android:layout_height="wrap_content" />
    19.  
    20.         <EditText
    21.             android:hint="Password"
    22.             android:layout_width="match_parent"
    23.             android:layout_height="wrap_content" />
    24.     </LinearLayout>
    25.  
    26.     <LinearLayout
    27.         android:padding="@dimen/activity_horizontal_margin"
    28.         android:orientation="vertical"
    29.         android:layout_width="wrap_content"
    30.         android:layout_height="wrap_content">
    31.  
    32.         <Button
    33.             android:id="@+id/submit"
    34.             android:text="Submit"
    35.             android:layout_width="wrap_content"
    36.             android:layout_height="wrap_content" />
    37.     </LinearLayout>
    38.  
    39. </LinearLayout>

     

    Step4- Implement animation on form view

    By click on submit button, we perform animation technique on our custom view.

    1. public class MainActivity extends Activity {
    2.     @Override
    3.     protected void onCreate(Bundle savedInstanceState) {
    4.         super.onCreate(savedInstanceState);
    5.         setContentView(R.layout.activity_main);
    6.          
    7.         // this is click listener method. It call when use click on the submit button
    8.         findViewById(R.id.submit).setOnClickListener(new View.OnClickListener() {
    9.             @Override
    10.             public void onClick(View v) {
    11.                 
    12.                 YoYo.with(Techniques.Tada)  // set the animation techniques
    13.                         // set the time duration, with in animation to be performed
    14.                         .duration(700)      
    15.                         .playOn(findViewById(R.id.edit_area)); // set your view
    16.  
    17.             }
    18.         });
    19.     }
    20. }

     

    Animaton on custom view in android Android animation on view Animation Custom view animation
    Comment on it

 0 Comment(s)

Sign In
Forgot Password?
                           OR                           
Create an account !!
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Reset Password
Fill out the form below and reset your password: