Tuesday, November 5, 2013

Android example: ImageSwitcher

A simple example to implement ImageSwitcher.

Example of ImageSwitcher

package com.example.androidimageswitcher;

import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup.LayoutParams;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.ViewSwitcher.ViewFactory;

public class MainActivity extends Activity {

 Button buttonNext;
 ImageSwitcher imageSwitcher;

 Animation slide_in_left, slide_out_right;

 int imageResources[] = { 
   android.R.drawable.ic_dialog_alert,
   android.R.drawable.ic_dialog_dialer,
   android.R.drawable.ic_dialog_email,
   android.R.drawable.ic_dialog_info, 
   android.R.drawable.ic_dialog_map };

 int curIndex;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);

  buttonNext = (Button) findViewById(R.id.next);
  imageSwitcher = (ImageSwitcher) findViewById(R.id.imageswitcher);

  slide_in_left = AnimationUtils.loadAnimation(this,
    android.R.anim.slide_in_left);
  slide_out_right = AnimationUtils.loadAnimation(this,
    android.R.anim.slide_out_right);

  imageSwitcher.setInAnimation(slide_in_left);
  imageSwitcher.setOutAnimation(slide_out_right);

  imageSwitcher.setFactory(new ViewFactory() {

   @Override
   public View makeView() {

    ImageView imageView = new ImageView(MainActivity.this);
    imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);

    LayoutParams params = new ImageSwitcher.LayoutParams(
      LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);

    imageView.setLayoutParams(params);
    return imageView;

   }
  });

  curIndex = 0;
  imageSwitcher.setImageResource(imageResources[curIndex]);

  buttonNext.setOnClickListener(new OnClickListener() {

   @Override
   public void onClick(View arg0) {
    if (curIndex == imageResources.length - 1) {
     curIndex = 0;
     imageSwitcher.setImageResource(imageResources[curIndex]);
    } else {
     imageSwitcher.setImageResource(imageResources[++curIndex]);
    }
   }
  });
 }

}


<LinearLayout 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"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:autoLink="web"
        android:text="http://android-er.blogspot.com/"
        android:textStyle="bold" />

    <ImageSwitcher
        android:id="@+id/imageswitcher"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal" />

    <Button
        android:id="@+id/next"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="next" />

</LinearLayout>


4 comments:

  1. Hi, may i know how to change the images?

    ReplyDelete
  2. Hello liyana,

    You can change content in imageResources[]

    ReplyDelete
  3. hi

    when i change the name of the image from imareResources[] with anouther image lacated in drawable file its not working.

    is it possible to make an example about to use saved drawable images.

    ReplyDelete
  4. hello Bustirgit,
    In this example, I use system drawable, so the name is 'android.R.drawable.ic_dialog_alert'...
    If you load drawable from drawable folder, it should be something like 'R.drawable.your_drawable_name'. - as i remember.

    ReplyDelete