先看看繼承關係，ImageSwitcher和TextSwitcher的繼承關係是一樣的。兩個重要的父類：ViewSwitcher和ViewAnimator

繼承於ViewSwitcher，說明具備了切換功能

繼承於ViewAnimator，說明具備了動畫功能

ImageSwitcher原理

ImageSwitcher的內容在Gallery中已經有所講解，這邊系統的詳解一下

ImageSwitcher粗略的理解就是ImageView的選擇器

ImageSwitcher的原理：ImageSwitcher有兩個子View：ImageView，當左右滑動的時候，就在這兩個ImageView之間來回切換來顯示圖片

下面我們來看看Android自帶的source，以便更深的理解這個原理：

既然有兩個子ImageView，那麼我們要建立兩個ImageView給ImageSwitcher。建立ImageSwitcher是通過工廠來實現的，看下面程式碼

1. imageSwicher.setFactory(this);  

1. @Override
2. public View makeView() {  
3.     ImageView imageView = new ImageView(this);  
4.     imageView.setImageResource(arrayPictures[pictureIndex]);  
5.     return imageView;  
6. }  

下面再來看看setFactory()方法的具體程式碼

1. publicvoid setFactory(ViewFactory factory) {  
2.     mFactory = factory;  
3.     obtainView();  
4.     obtainView();  
5. }  

再來看看obtainView()方法的具體程式碼

1. private View obtainView() {  
2.     View child = mFactory.makeView();  
3.     LayoutParams lp = (LayoutParams) child.getLayoutParams();  
4.     if (lp == null) {  
5.         lp = new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);  
6.     }  
7.     addView(child, lp);  
8.     return child;  
9. }  

再來看看下面的方法

1. publicvoid setImageResource(int resid)  
2. {  
3.     ImageView image = (ImageView)this.getNextView();  
4.     image.setImageResource(resid);  
5.     showNext();  
6. }  

1. public View getNextView() {  
2.     int which = mWhichChild == 0 ? 1 : 0;  
3.     return getChildAt(which);  
4. }  

1. publicvoid showNext() {  
2.     setDisplayedChild(mWhichChild + 1);  
3. }  

也就是說，現用getNextView()方法得到下一個View，然後重新設定這個View的imageResource，最後通過showNext()方法將下一個View顯示出來

好了，ImageSwitcher的原理講完了。下面附上一個Demo

ImageSwitcher例項

1. <?xmlversion="1.0"encoding="utf-8"?>
2. <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
3.     android:layout_width="fill_parent"
4.     android:layout_height="fill_parent"
5.     android:orientation="vertical">
6.     <ImageSwitcher
7.         android:id="@+id/imageSwicher"
8.         android:layout_width="fill_parent"
9.         android:layout_height="0dip"
10.         android:layout_weight="1"
11.         android:background="@android:color/white"
12.         android:gravity="center">
13.     </ImageSwitcher>
14. </LinearLayout>

1. package com.tianjf;  
2. import android.app.Activity;  
3. import android.os.Bundle;  
4. import android.view.MotionEvent;  
5. import android.view.View;  
6. import android.view.View.OnTouchListener;  
7. import android.view.animation.AnimationUtils;  
8. import android.widget.ImageSwitcher;  
9. import android.widget.ImageView;  
10. import android.widget.ViewSwitcher.ViewFactory;  
11. /** 
12.  * 一個左右滑動瀏覽圖片的Demo 
13.  *  
14.  * @author tianjf 
15.  *  
16.  */
17. publicclass ImageSwicherDemoActivity extends Activity implements ViewFactory,  
18.         OnTouchListener {  
19.     private ImageSwitcher imageSwicher;  
20.     // 圖片陣列
21.     privateint[] arrayPictures = { R.drawable.bg001, R.drawable.bg002,  
22.             R.drawable.bg003, R.drawable.bg004 };  
23.     // 要顯示的圖片在圖片陣列中的Index
24.     privateint pictureIndex;  
25.     // 左右滑動時手指按下的X座標
26.     privatefloat touchDownX;  
27.     // 左右滑動時手指鬆開的X座標
28.     privatefloat touchUpX;  
29.     @Override
30.     publicvoid onCreate(Bundle savedInstanceState) {  
31.         super.onCreate(savedInstanceState);  
32.         setContentView(R.layout.main);  
33.         imageSwicher = (ImageSwitcher) findViewById(R.id.imageSwicher);  
34.         // 為ImageSwicher設定Factory，用來為ImageSwicher製造ImageView
35.         imageSwicher.setFactory(this);  
36.         // 設定ImageSwitcher左右滑動事件
37.         imageSwicher.setOnTouchListener(this);  
38.     }  
39.     @Override
40.     public View makeView() {  
41.         ImageView imageView = new ImageView(this);  
42.         imageView.setImageResource(arrayPictures[pictureIndex]);  
43.         return imageView;  
44.     }  
45.     @Override
46.     publicboolean onTouch(View v, MotionEvent event) {  
47.         if (event.getAction() == MotionEvent.ACTION_DOWN) {  
48.             // 取得左右滑動時手指按下的X座標
49.             touchDownX = event.getX();  
50.             returntrue;  
51.         } elseif (event.getAction() == MotionEvent.ACTION_UP) {  
52.             // 取得左右滑動時手指鬆開的X座標
53.             touchUpX = event.getX();  
54.             // 從左往右，看前一張
55.             if (touchUpX - touchDownX > 100) {  
56.                 // 取得當前要看的圖片的index
57.                 pictureIndex = pictureIndex == 0 ? arrayPictures.length - 1
58.                         : pictureIndex - 1;  
59.                 // 設定圖片切換的動畫
60.                 imageSwicher.setInAnimation(AnimationUtils.loadAnimation(this,  
61.                         android.R.anim.slide_in_left));  
62.                 imageSwicher.setOutAnimation(AnimationUtils.loadAnimation(this,  
63.                         android.R.anim.slide_out_right));  
64.                 // 設定當前要看的圖片
65.                 imageSwicher.setImageResource(arrayPictures[pictureIndex]);  
66.                 // 從右往左，看下一張
67.             } elseif (touchDownX - touchUpX > 100) {  
68.                 // 取得當前要看的圖片的index
69.                 pictureIndex = pictureIndex == arrayPictures.length - 1 ? 0
70.                         : pictureIndex + 1;  
71.                 // 設定圖片切換的動畫
72.                 // 由於Android沒有提供slide_out_left和slide_in_right，所以仿照slide_in_left和slide_out_right編寫了slide_out_left和slide_in_right
73.                 imageSwicher.setInAnimation(AnimationUtils.loadAnimation(this,  
74.                         R.anim.slide_out_left));  
75.                 imageSwicher.setOutAnimation(AnimationUtils.loadAnimation(this,  
76.                         R.anim.slide_in_right));  
77.                 // 設定當前要看的圖片
78.                 imageSwicher.setImageResource(arrayPictures[pictureIndex]);  
79.             }  
80.             returntrue;  
81.         }  
82.         returnfalse;  
83.     }  
84. }  

slide_in_right.xml

1. <?xmlversion="1.0"encoding="utf-8"?>
2. <setxmlns:android="http://schemas.android.com/apk/res/android">
3.     <translateandroid:fromXDelta="50%p"android:toXDelta="0"android:duration="300"/>
4.     <alphaandroid:fromAlpha="0.0"android:toAlpha="1.0"android:duration="300"/>
5. </set>

1. <?xmlversion="1.0"encoding="utf-8"?>
2. <setxmlns:android="http://schemas.android.com/apk/res/android">
3.     <translateandroid:fromXDelta="0"android:toXDelta="-50%p"android:duration="300"/>
4.     <alphaandroid:fromAlpha="1.0"android:toAlpha="0.0"android:duration="300"/>
5. </set>

好了ImageSwitcher的講解到此結束，下面附上一個和ImageSwitcher差不多的TextSwitcher的Demo。

由於TextSwitcher的原理和ImageSwitcher一樣，只是一個是ImageView，一個是TextView。那麼在此就不多說，直接上程式碼

main.xml

1. <?xmlversion="1.0"encoding="utf-8"?>
2. <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
3.     android:layout_width="fill_parent"
4.     android:layout_height="fill_parent"
5.     android:orientation="vertical">
6.     <TextSwitcher
7.         android:id="@+id/textSwicher"
8.         android:layout_width="fill_parent"
9.         android:layout_height="0dip"
10.         android:layout_weight="1"
11.         android:background="@android:color/white"
12.         android:gravity="center">
13.     </TextSwitcher>
14. </LinearLayout>

1. package com.tianjf;  
2. import android.app.Activity;  
3. import android.os.Bundle;  
4. import android.view.Gravity;  
5. import android.view.MotionEvent;  
6. import android.view.View;  
7. import android.view.View.OnTouchListener;  
8. import android.view.ViewGroup.LayoutParams;  
9. import android.view.animation.AnimationUtils;  
10. import android.widget.TextSwitcher;  
11. import android.widget.TextView;  
12. import android.widget.ViewSwitcher.ViewFactory;  
13. /** 
14.  * 一個左右滑動瀏覽文字的Demo 
15.  *  
16.  * @author tianjf 
17.  *  
18.  */
19. publicclass TextSwitcherDemoActivity extends Activity implements ViewFactory,  
20.         OnTouchListener {  
21.     private TextSwitcher textSwicher;  
22.     // 圖片陣列
23.     private String[] arrayTexts = { "文字01", "文字02", "文字03", "文字04" };  
24.     // 要顯示的圖片在圖片陣列中的Index
25.     privateint textIndex;  
26.     // 左右滑動時手指按下的X座標
27.     privatefloat touchDownX;  
28.     // 左右滑動時手指鬆開的X座標
29.     privatefloat touchUpX;  
30.     @Override
31.     publicvoid onCreate(Bundle savedInstanceState) {  
32.         super.onCreate(savedInstanceState);  
33.         setContentView(R.layout.main);  
34.         textSwicher = (TextSwitcher) findViewById(R.id.textSwicher);  
35.         // 為TextSwitcher設定Factory，用來為TextSwitcher製造TextView
36.         textSwicher.setFactory(this);  
37.         // 設定TextSwitcher左右滑動事件
38.         textSwicher.setOnTouchListener(this);  
39.     }  
40.     @Override
41.     public View makeView() {  
42.         TextView textView = new TextView(this);  
43.         textView.setTextSize(100);  
44.         textView.setLayoutParams(new TextSwitcher.LayoutParams(  
45.                 LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));  
46.         textView.setGravity(Gravity.CENTER);  
47.         textView.setText(arrayTexts[textIndex]);  
48.         return textView;  
49.     }  
50.     @Override
51.     publicboolean onTouch(View v, MotionEvent event) {  
52.         if (event.getAction() == MotionEvent.ACTION_DOWN) {  
53.             // 取得左右滑動時手指按下的X座標
54.             touchDownX = event.getX();  
55.             returntrue;  
56.         } elseif (event.getAction() == MotionEvent.ACTION_UP) {  
57.             // 取得左右滑動時手指鬆開的X座標
58.             touchUpX = event.getX();  
59.             // 從左往右，看前一文字
60.             if (touchUpX - touchDownX > 100) {  
61.                 // 取得當前要看的文字的index
62.                 textIndex = textIndex == 0 ? arrayTexts.length - 1
63.                         : textIndex - 1;  
64.                 // 設定文字切換的動畫
65.                 textSwicher.setInAnimation(AnimationUtils.loadAnimation(this,  
66.                         android.R.anim.slide_in_left));  
67.                 textSwicher.setOutAnimation(AnimationUtils.loadAnimation(this,  
68.                         android.R.anim.slide_out_right));  
69.                 // 設定當前要看的文字
70.                 textSwicher.setText(arrayTexts[textIndex]);  
71.                 // 從右往左，看下一張
72.             } elseif (touchDownX - touchUpX > 100) {  
73.                 // 取得當前要看的文字的index
74.                 textIndex = textIndex == arrayTexts.length - 1 ? 0
75.                         : textIndex + 1;  
76.                 // 設定文字切換的動畫
77.                 // 由於Android沒有提供slide_out_left和slide_in_right，所以仿照slide_in_left和slide_out_right編寫了slide_out_left和slide_in_right
78.                 textSwicher.setInAnimation(AnimationUtils.loadAnimation(this,  
79.                         R.anim.slide_out_left));  
80.                 textSwicher.setOutAnimation(AnimationUtils.loadAnimation(this,  
81.                         R.anim.slide_in_right));  
82.                 // 設定當前要看的文字
83.                 textSwicher.setText(arrayTexts[textIndex]);  
84.             }  
85.             returntrue;  
86.         }  
87.         returnfalse;  
88.     }  
89. }