How to use ImageSwitcher in Android?

In Android, there will be some situations where we need to change to image in an image view with some animations and all this must be managed correctly and efficiently, otherwise, some issues will happen. Here comes Android's ImageSwitcher. ImageSwitcher will switch between images easily. Image switcher will also allow you to add some animations in the way they appear. Here I am going to tell you the basic usage of image switcher with a button. On clicking on the button the image switcher will change its image
Please see the main activity xml file for the usage,
  1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. android:paddingBottom="@dimen/activity_vertical_margin"
  6. android:paddingLeft="@dimen/activity_horizontal_margin"
  7. android:paddingRight="@dimen/activity_horizontal_margin"
  8. android:paddingTop="@dimen/activity_vertical_margin"
  9. tools:context=".MainActivity">
  10. <ImageSwitcher
  11. android:id="@+id/imageSwitch"
  12. android:layout_width="300dp"
  13. android:layout_centerHorizontal="true"
  14. android:layout_height="300dp" />
  15. <Button
  16. android:layout_width="wrap_content"
  17. android:layout_height="wrap_content"
  18. android:text="Switch"
  19. android:id="@+id/switchButton"
  20. android:layout_margin="20dp"
  21. android:layout_below="@+id/imageSwitch"
  22. android:layout_centerHorizontal="true" />
  24. </RelativeLayout>
Now bind the controls to the java file on the onCreate(),
  1. imageSwitcher = (ImageSwitcher) findViewById(R.id.imageSwitch);
  2. Button button = (Button) findViewById(R.id.switchButton);
Next we need to implement the ViewFactory interface and override the makeView() to set the layout and image switcher properties each time while switching like the following.
  1. imageSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
  2. @Override
  3. public View makeView() {
  4. ImageView myView = new ImageView(getApplicationContext());
  5. myView.setScaleType(ImageView.ScaleType.FIT_CENTER);
  6. myView.setLayoutParams(new ImageSwitcher.LayoutParams(300,300));
  7. return myView;
  8. }
  9. });
Each time we are change the image in the ImageSwitcher this method will be called. Now go to the button and click and change the image according to some conditions. For that I declared a boolean variable, which will store the status of the image switched or not. See the button click listener below.
  1. button.setOnClickListener(new View.OnClickListener() {
  2. @Override
  3. public void onClick(View view) {
  4. if(isImageSwitched){
  5. imageSwitcher.setImageResource(R.drawable.android);
  6. isImageSwitched = false;
  7. }else{
  8. imageSwitcher.setImageResource(R.drawable.android_one);
  9. isImageSwitched = true;
  10. }
  11. }
  12. });
On the button click, it will check the boolean variable and change the image according to the boolean value. But the switching of the image will be very smooth, which is the main property of the Image Switcher. For that, I have added two images in the drawable folder. We need to call only the setImageResource each time to change the image in the Image Switcher. I did not set any images in the initial loading
Please see the screen shots also...