Android ViewFlipper


Download ViewFlipper sample

Android ViewFlipper is subclass of ViewAnimator class. It can be used to provide smooth animation between 2 or more views that has been added to ViewFlipper. Android ViewFlipper shows one view at a time.

Android ViewFlipper can be used to flip between views automatically as well as manually.

In this example, we are going to learn following things:

  1. Android ViewFlipper usage
  2. Xml attributes of Android ViewFlipper
  3. Impartant methods of Android ViewFlipper
  4. Touch gesture detection on Android ViewFlipper
  5. How to add simple animation on ViewFlipper
  6. Auto/manual image slide show example

Android ViewFlipper usage?


Android ViewFlipper can be defined in xml layout as follows:

Here, we can add any View or ViewGroup in place of ImageView.

android:autoStart attribute of ViewFlipper?


android:autoStart attribute of ViewFlipper define whether ViewFlipper will start flipping automatically or not. It can have true or false as its value.

android:autoStart has true value so it will flip automatically.

android:flipInterval of ViewFlipper?


android:flipInterval of ViewFlipper define time in miliseconds that ViewFlipper will take to animate between views. An example of android:flipInterval attribute is given below:

Impartant methods of Android ViewFlipper?


Here are some impartant method of Android ViewFlipper which we use frequently:

startFlipping method of ViewFlipper?

As the name suggest, startFlipping method of ViewFlipper used to start flipping of a ViewFlipper. Syntax of using startFlipping method is given below:

stopFlipping method of ViewFlipper?

As the name suggest, stopFlipping method of ViewFlipper used to stop flipping of a ViewFlipper. Syntax of using stopFlipping method is given below:

setFlipInterval method of ViewFlipper?

setFlipInterval method of ViewFlipper used to set flipping interval in miliseconds between views. Syntax of using setFlipInterval method is given below:

setAutoStart method of ViewFlipper?

setAutoStart method of ViewFlipper handle whether auto flipping of ViewFlipper will take place or not:

Since, I passed true value in setAutoStart method of ViewFlipper, so it will start flipping automatically.

isAutoStart method of ViewFlipper?

isAutoStart method of ViewFlipper return true or false value depending on whether ViewFlipper is auto flipping or not

How to detect touch gesture of a view?


In this example, I wanted when user fling left to right then ViewFlipper flip next image and when user fling right to left then ViewFlipper flip previous image. We need to detect touch gesture of a view so that we can implement this logic.

I created an abstract class OnFlingListener.java, as follows:

Next step is to set touch listener of ViewFlipper in our Activity class as follows:

Adding animation in ViewFlipper?


To add simple animation on ViewFlipper I created 2 xml resource under res -> anim as given below:

left_to_right.xml

right_to_left.xml

Last step was to call it, when user fling on ViewFlipper left to right or right to left.

Image slide show example using Android ViewFlipper


Android ViewFlipper

In Android ViewFlipper example, we are going to implement image slide show that can be flip automatically as well as manually.

Step 1: Create a new project in Android Studio and name it Android ViewFlipper.

Step 2: Open res -> drawable and add six images with name nature_1.jpg, nature_2.jpg, nature_3.jpg, nature_4.jpg, nature_5.jpg, nature_6.jpg

Step 3: Open res -> layout -> activity_main.xml and add following code

activity_main.xml

Step 4: Create a new directory under res and named it anim

Step 5: open res -> anim and add a new file left_to_right.xml, replace its code with below given code:

left_to_right.xml

Step 6: open res -> anim and add a new file right_to_left.xml, replace its code with below given code:

right_to_left.xml

Step 7: Now create an abstract class OnFlingListener.java and implement View.OnTouchListener , replace its code with below given code:

OnFlingListener.java

Step 8: Open your MainActivity.java and replace it source with source of my MainActivity.java as follows:

MainActivity.java

Step 9: Clean and run the project to see the result.


Share & Like

Tutorial topics

About ApnaTutorials.com

ApnaTutorials.com is for Java, J2ee, Html5 and android developers. All tutorials are well explained and are easy to understand. We have tested every tutorials on our developement environment before posting it in public domain.