Using ViewFlipper in Android

In this blog post, I would like to show how to use ViewFlipper in Android as a slideshow automatically and manual too.

1. Create a new project File -> Android Project. On MainActivity.java and copy paste this code:

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.ViewFlipper;

public class MainActivity extends Activity {

 ViewFlipper flipper;
 /** Called when the activity is first created. */
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 //Getting View Flipper from main.xml and assigning to flipper reference variable
 flipper=(ViewFlipper)findViewById(R.id.viewFlipper1);
 }

 public void flipByClick(View v)
 {
 if(flipper.isFlipping())//Checking flipper is flipping or not.
 {
 flipper.stopFlipping(); //stops the flipping .
 }
 flipper.showNext();//shows the next view element of ViewFlipper
 }
 public void flipByInterval(View v)
 {
 flipper.setFlipInterval(500);//setting the interval 500 milliseconds
 flipper.startFlipping(); //views flipping starts.
 }
}

2. Now open your main.xml layout and copy paste this code:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:orientation="vertical" >

 <LinearLayout
 android:id="@+id/linearLayout1"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:orientation="horizontal" >

 <Button
 android:id="@+id/flipbyinterval"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_weight="0.25"
 android:onClick="flipByInterval"
 android:text="Flip By Interval" />
 <!-- Calling flipByInterval() method of Activity class -->

 <Button
 android:id="@+id/flipbyclick"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_weight="0.49"
 android:onClick="flipByClick"
 android:text="Flip By Click" />
 <!-- calling flipByClick() method of Activity class -->
 </LinearLayout>
 <!-- ViewFlipper can contains any view elements in this case it contains 5 ImageView view Component with different Images -->

 <ViewFlipper
 android:id="@+id/viewFlipper1"
 android:layout_width="match_parent"
 android:layout_height="fill_parent" >

 <ImageView
 android:id="@+id/imageView1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:src="@drawable/one" />
 <!-- Setting img1 from drawable folder in ImageView -->

 <ImageView
 android:id="@+id/imageView2"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:src="@drawable/two" />
 <!-- Setting img2 from drawable folder in ImageView -->

 <ImageView
 android:id="@+id/imageView3"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:src="@drawable/three" />
 <!-- Setting img3 from drawable folder in ImageView -->

 <ImageView
 android:id="@+id/imageView4"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:src="@drawable/four" />
 <!-- Setting img4 from drawable folder in ImageView -->

 <ImageView
 android:id="@+id/imageView5"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:src="@drawable/five" />
 <!-- Setting img5 from drawable folder in ImageView -->

 <ImageView
 android:id="@+id/imageView6"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:src="@drawable/six" />
 <!-- Setting img6 from drawable folder in ImageView -->

 </ViewFlipper>

</LinearLayout>

ScreenShots:

Screenshot_2014-10-04-20-59-25[1] Screenshot_2014-10-04-20-59-32[1] Screenshot_2014-10-04-20-59-43[1]

Tips to Remember Always:

Android View Flipper is used to flip between views. The main advantage of using this class is that it can have any number of views, through which we can flip, but only one view is shown at a time. ThisView Flipper class can also be used to create a slideshow of views with regular intervals.

 

Hope this helpful. Your valuable comments are always welcomed. It will help to improve my post and understanding.
Download Source Code from here.

durga chiranjeevi

durga chiranjeevi

I'm currently working as Android developer at Energy Alternatives India. Interested in Application and Game development.
durga chiranjeevi

Leave a Reply

Your email address will not be published. Required fields are marked *