in this post we are goin to learn about an android project in this project we can learn "how to create android image switcher" for android app projects
Step 1 - Create A Empty Projects
Step 2 - Add
Images in drawable folder Which You Want To Include In Your App For Switch One
Image To Another Image (Two or More Image)
Step 3 Add This Xml Code In Your Xml Activity Or Fragment
<ImageSwitcher
android:id="@+id/simpleImageSwitcher"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="50dp"
/>
<Button
android:id="@+id/buttonNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="150dp"
android:layout_gravity="center"
android:background="#050"
android:textColor="#fff"
android:textStyle="bold"
android:text="NEXT"
/>
Step 4 - Add Java
Code In Your Java Code Activity
private ImageSwitcher simpleImageSwitcher;
Button btnNext;
// Array of Image IDs to Show In ImageSwitcher
int imageIds[] = {R.drawable.image1, R.drawable.images2, R.drawable.image3, R.drawable.images4, R.drawable.images5};
int count = imageIds.length;
// to keep current Index of ImageID array
int currentIndex = -1;
// get The references of Button and ImageSwitcher
btnNext = (Button) findViewById(R.id.buttonNext);
simpleImageSwitcher = (ImageSwitcher) findViewById(R.id.simpleImageSwitcher);
// Set the ViewFactory of the ImageSwitcher that will create ImageView object when asked
simpleImageSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
public View makeView() {
// TODO Auto-generated method stub
// Create a new ImageView and set it's properties
ImageView imageView = new ImageView(getApplicationContext());
// set Scale type of ImageView to Fit Center
imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
// set the Height And Width of ImageView To FIll PARENT
imageView.setLayoutParams(new ImageSwitcher.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.FILL_PARENT));
return imageView;
}
});
// Declare in and out animations and load them using AnimationUtils class
Animation in = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left);
Animation out = AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right);
// set the animation type to ImageSwitcher
simpleImageSwitcher.setInAnimation(in);
simpleImageSwitcher.setOutAnimation(out);
// ClickListener for NEXT button
// When clicked on Button ImageSwitcher will switch between Images
// The current Image will go OUT and next Image will come in with specified animation
btnNext.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
// TODO Auto-generated method stub
currentIndex++;
// Check If index reaches maximum then reset it
if (currentIndex == count)
currentIndex = 0;
simpleImageSwitcher.setImageResource(imageIds[currentIndex]); // set the image in ImageSwitcher
}
});
Now Your Android Image Switcher Project Is Ready
Now Install , I Hope Your App Is Done , If You Have Any
Query Then You Can Comment In The Comments Box
Xml Code Like This
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical">
<ImageSwitcher
android:id="@+id/simpleImageSwitcher"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="50dp" />
<Button
android:id="@+id/buttonNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="150dp"
android:layout_gravity="center"
android:background="#050"
android:textColor="#fff"
android:textStyle="bold"
android:text="NEXT" />
</LinearLayout>
Java Code Like This
package com.example.imageswitcherandroid;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
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.LinearLayout;
import android.widget.ViewSwitcher;
public class MainActivity extends AppCompatActivity {
private ImageSwitcher simpleImageSwitcher;
Button btnNext;
// Array of Image IDs to Show In ImageSwitcher
int imageIds[] = {R.drawable.image1, R.drawable.images2, R.drawable.image3, R.drawable.images4, R.drawable.images5};
int count = imageIds.length;
// to keep current Index of ImageID array
int currentIndex = -1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// get The references of Button and ImageSwitcher
btnNext = (Button) findViewById(R.id.buttonNext);
simpleImageSwitcher = (ImageSwitcher) findViewById(R.id.simpleImageSwitcher);
// Set the ViewFactory of the ImageSwitcher that will create ImageView object when asked
simpleImageSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
public View makeView() {
// TODO Auto-generated method stub
// Create a new ImageView and set it's properties
ImageView imageView = new ImageView(getApplicationContext());
// set Scale type of ImageView to Fit Center
imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);
// set the Height And Width of ImageView To FIll PARENT
imageView.setLayoutParams(new ImageSwitcher.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.FILL_PARENT));
return imageView;
}
});
// Declare in and out animations and load them using AnimationUtils class
Animation in = AnimationUtils.loadAnimation(this, android.R.anim.slide_in_left);
Animation out = AnimationUtils.loadAnimation(this, android.R.anim.slide_out_right);
// set the animation type to ImageSwitcher
simpleImageSwitcher.setInAnimation(in);
simpleImageSwitcher.setOutAnimation(out);
// ClickListener for NEXT button
// When clicked on Button ImageSwitcher will switch between Images
// The current Image will go OUT and next Image will come in with specified animation
btnNext.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
// TODO Auto-generated method stub
currentIndex++;
// Check If index reaches maximum then reset it
if (currentIndex == count)
currentIndex = 0;
simpleImageSwitcher.setImageResource(imageIds[currentIndex]); // set the image in ImageSwitcher
}
});
}
}