TextSwitcher and ImageSwitcher in Android

Introduction

 
This article explains TextSwitcher and ImageSwitcher in Android. Android Studio is used to create the sample.
 
TextSwitcher and ImageSwitcher are used for simple animated transitions. TextSwitcher and ImageSwitcher are used for smooth transition animation in Android. For example, changing a number in a DatePicker, CountDown timer in a clock. Text Switcher and ImageSwittcher are the classes in Android.
 
Step 1
 
Create a project like this:
 
textSwitcherproject
 
Step 2
 
Create an XML file and with the following.
 
In this, you will use a TextSwitcher and an ImageSwitcher.
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent" >  
  5.    
  6.     <ImageSwitcher  
  7.         android:id="@+id/switcherImage"  
  8.         android:layout_width="fill_parent"  
  9.         android:layout_height="fill_parent"  
  10.         android:layout_alignParentLeft="true" >  
  11.     </ImageSwitcher>  
  12.    
  13.     <TextSwitcher  
  14.         android:id="@+id/switcherText"  
  15.         android:layout_width="fill_parent"  
  16.         android:layout_height="wrap_content"  
  17.         android:layout_alignParentBottom="true"  
  18.         android:layout_centerHorizontal="true"  
  19.         android:background="#99000000"  
  20.         android:padding="10dp" />  
  21.    
  22.     <Button  
  23.         android:layout_width="wrap_content"  
  24.         android:layout_height="wrap_content"  
  25.         android:layout_alignParentRight="true"  
  26.         android:layout_alignParentTop="true"  
  27.         android:layout_marginTop="10dp"  
  28.         android:onClick="onSwitch"  
  29.         android:text="Next Image >>" />  
  30.    
  31. </RelativeLayout> 
Step 3
 
Create a Java class file with the following.
 
In a Java class file, you will create the id of the TextSwitcher and ImageSwitcher. Now call the setFactory method and the view as an argument.
  1. package com.textswitcher;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5. import android.view.Gravity;  
  6. import android.view.View;  
  7. import android.widget.ImageSwitcher;  
  8. import android.widget.ImageView;  
  9. import android.widget.TextSwitcher;  
  10. import android.widget.TextView;  
  11. import android.widget.ViewSwitcher.ViewFactory;  
  12.   
  13. public class MainActivity extends Activity   
  14. {  
  15.   
  16.  private static final String[] TEXT =   
  17.  {  
  18.   "Image 1",  
  19.   "Image 2",  
  20.   "Image 3"  
  21.  };  
  22.  private static final int[] IMAGES =   
  23.  {  
  24.   R.drawable.image1,  
  25.   R.drawable.images2,  
  26.   R.drawable.images3  
  27.  };  
  28.  private int Position = 0;  
  29.  private TextSwitcher switcherText;  
  30.  private ImageSwitcher switcherImage;  
  31.   
  32.  @Override  
  33.  public void onCreate(Bundle savedInstanceState)   
  34.  {  
  35.   super.onCreate(savedInstanceState);  
  36.   setContentView(R.layout.activity_main);  
  37.   
  38.   switcherText = (TextSwitcher) findViewById(R.id.switcherText);  
  39.   switcherText.setFactory(new ViewFactory()   
  40.   {  
  41.    @Override  
  42.    public View makeView()   
  43.    {  
  44.     TextView textView = new TextView(MainActivity.this);  
  45.     textView.setGravity(Gravity.CENTER);  
  46.     return textView;  
  47.    }  
  48.   });  
  49.   
  50.   switcherText.setInAnimation(this, android.R.anim.fade_in);  
  51.   switcherText.setOutAnimation(this, android.R.anim.fade_out);  
  52.   
  53.   switcherImage = (ImageSwitcher) findViewById(R.id.switcherImage);  
  54.   switcherImage.setFactory(new ViewFactory()   
  55.   {  
  56.    @Override  
  57.    public View makeView()   
  58.    {  
  59.     ImageView imageView = new ImageView(MainActivity.this);  
  60.     return imageView;  
  61.    }  
  62.   });  
  63.   switcherImage.setInAnimation(this, android.R.anim.slide_in_left);  
  64.   switcherImage.setOutAnimation(this, android.R.anim.slide_out_right);  
  65.   
  66.   onSwitch(null);  
  67.  }  
  68.   
  69.  public void onSwitch(View view)   
  70.  {  
  71.   switcherText.setText(TEXT[Position]);  
  72.   switcherImage.setBackgroundResource(IMAGES[Position]);  
  73.   Position = (Position + 1) % TEXT.length;  
  74.  }  
Step 4
 
Android Manifest.xml file
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <manifest xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     package="com.textswitcher"  
  4.     android:versionCode="1"  
  5.     android:versionName="1.0" >  
  6.    
  7.     <uses-sdk  
  8.         android:minSdkVersion="7"  
  9.         android:targetSdkVersion="16" />  
  10.    
  11.     <application  
  12.         android:allowBackup="true"  
  13.         android:icon="@drawable/ic_launcher"  
  14.         android:label="@string/app_name"  
  15.         android:theme="@style/AppTheme" >  
  16.         <activity  
  17.             android:name="com.textswitcher.MainActivity"  
  18.             android:label="@string/app_name" >  
  19.             <intent-filter>  
  20.                 <action android:name="android.intent.action.MAIN" />  
  21.    
  22.                 <category android:name="android.intent.category.LAUNCHER" />  
  23.             </intent-filter>  
  24.         </activity>  
  25.     </application>  
  26. </manifest> 
Step 5
 
ImageSwitch1
 
textswitcher2
 
textswitcher3


Similar Articles