Monday, February 24, 2020

ViewAnimator in Android

ViewAnimator n Android is a Base class of a FrameLayout, which defines the Animation on it when switching between views. ViewAnimator can be altered in order to change the in-Animation and out-Animation of the FrameLayout or defining custom animation to the Views at hand.
ViewAnimator in Android

We will be using the ViewAnimator tag in our layout like below
<ViewAnimator
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/view_animator">
</ViewAnimator>
As always, this View takes the default attributes layout_width and layout_height. You can make use of the attributes of a View or a ViewGroup also. Check here for the list of all the attributes related to it.
Create your layout named view_animator.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center">
    <ViewAnimator
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/view_animator">
        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="First View"
            android:textSize="40dp"/>
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/monk"/>
        <Button
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="Button View"/>
    </ViewAnimator>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Next"
            android:id="@+id/next"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Previous"
            android:id="@+id/prev"/>
    </LinearLayout>
</LinearLayout>
Once your layout is set, it is time for the Activity. Check the ViewAnimatorActivity.java we have created below.
public class ViewAnimatorActivity extends AppCompatActivity{
    ViewAnimator viewAnimator;
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.view_animator);
        viewAnimator = findViewById(R.id.view_animator);
        Button prev = findViewById(R.id.prev);
        Button next = findViewById(R.id.next);
        Animation inAnimation = AnimationUtils.loadAnimation(this, android.R.anim.fade_in);
        Animation outAnimation = AnimationUtils.loadAnimation(this, android.R.anim.fade_out);
        viewAnimator.setInAnimation(inAnimation);
        viewAnimator.setOutAnimation(outAnimation);
        next.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                viewAnimator.showNext();
            }
        });
        prev.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                viewAnimator.showPrevious();
            }
        });
    }
}
On the out set it is self explanatory, but we have to see how the animation is created. Here, we use the AnimationUtils class and load our Animation. AnimationUtils class contains lot of useful methods. You can check here for the entire list of methods in that class