A ViewAnimator is used to animate or switch between the screens.
To learn Basic of Android Animation go to Android Animation Tutorial.
In this example i will show how to use ViewAnimator to switch between screen with Animation.
Let’s get start by creating a project in Eclipse IDE.
1. Create a new project in Eclipse by navigating to File ⇒ New Android ⇒ Application Project and fill required details. (I kept my main activity name as MainActivity.java)
2. Create a layout file for MainActivtiy.java under res ⇒ layout folder. I named the layout file as activity_main.xml. In this layout i had taken ViewAnimator and inside it i had taken some views like ImageView, Button, TextView, etc.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 |
<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" > <LinearLayout android:id="@+id/LinearLayout01" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" > <!-- View Animator containing many views --> <ViewAnimator android:id="@+id/viewAnimator" android:layout_width="wrap_content" android:layout_height="wrap_content" > <ImageView android:id="@+id/imageView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/a" > </ImageView> <Button android:id="@+id/button" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_gravity="center" android:text="View Animator Button" android:textSize="20sp" > </Button> <ImageView android:id="@+id/imageView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/b" > </ImageView> <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="View Animator Text" android:textColor="#000000" android:textSize="20sp" > </TextView> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:text="View Animator Text 2" android:textColor="#ff00" android:textSize="20sp" > </TextView> </ViewAnimator> </LinearLayout> <LinearLayout android:id="@+id/LinearLayout02" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_marginTop="400dp" > <Button android:id="@+id/buttonPrevious" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Previous" /> <Button android:id="@+id/buttonNext" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Next" /> </LinearLayout> </RelativeLayout> |
3. Now, add the following code to MainActivity.java , in this activity i am going to show how to switch between the view using animations.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 |
package com.android_viewanimator_demo; import android.os.Bundle; import android.support.v7.app.ActionBarActivity; import android.view.View; import android.view.View.OnClickListener; import android.view.animation.Animation; import android.view.animation.AnimationUtils; import android.widget.Button; import android.widget.Toast; import android.widget.ViewAnimator; public class MainActivity extends ActionBarActivity implements OnClickListener { private static Button btnNext, btnPrevious, my_button; private static ViewAnimator viewAnimator; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); init(); setListeners(); } void init() { viewAnimator = (ViewAnimator) findViewById(R.id.viewAnimator); btnNext = (Button) findViewById(R.id.buttonNext); btnPrevious = (Button) findViewById(R.id.buttonPrevious); my_button = (Button) findViewById(R.id.button); //Load animations for in and out for viewanimator final Animation inAnim = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left); final Animation outAnim = AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right); viewAnimator.setInAnimation(inAnim); viewAnimator.setOutAnimation(outAnim); } //Setting listeners to buttons and viewanimator void setListeners() { btnNext.setOnClickListener(this); btnPrevious.setOnClickListener(this); viewAnimator.setOnClickListener(this); my_button.setOnClickListener(this); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.buttonNext: //Show next view viewAnimator.showNext(); break; case R.id.buttonPrevious: //Show Previous view viewAnimator.showPrevious(); break; case R.id.viewAnimator: viewAnimator.showNext(); break; case R.id.button: //Show toast on button click Toast.makeText(MainActivity.this, "My button Pressed", Toast.LENGTH_SHORT).show(); break; } } } |
4. Finally, run the app and you will get the output as shown in video.
Thanks.
Subscribe to us and get the latest news.