public class
ViewFlipper
extends ViewAnimator
java.lang.Object
   ?    android.view.View
       ?    android.view.ViewGroup
           ?    android.widget.FrameLayout
               ?    android.widget.ViewAnimator
                   ?    android.widget.ViewFlipper

可以看出ViewFlipper繼承自ViewAnimator，ViewAnimator的官方解釋如下：

Base class for a FrameLayout container that will perform animations when switching between its views. 也就是說ViewAnimator是一個(gè)視圖容器基類，并在其子View切換時(shí)提供動(dòng)畫效果。其直接子類除了本節(jié)介紹的ViewFlipper之外還有ViewSwitcher。言歸正傳，下面看一下ViewFlipper常用的屬性和方法有哪些？

http://wiki.jikexueyuan.com/project/twenty-four-Scriptures/images/16-1.png" alt="這里寫圖片描述" />

常用方法如下表：

http://wiki.jikexueyuan.com/project/twenty-four-Scriptures/images/16-2.png" alt="這里寫圖片描述" />

ViewFlipper進(jìn)行圖片配置時(shí)也有兩種方式，一種稱為靜態(tài)配置，即在布局文件中進(jìn)行配置，另一種稱為動(dòng)態(tài)配置，即在Java代碼中進(jìn)行配置，下面通過一個(gè)小實(shí)例看一下如何實(shí)現(xiàn)這兩種配置。

靜態(tài)配置

【實(shí)例11.1】主布局文件（activity_main.xml）

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ViewFlipper
        android:id="@+id/viewflipper"
        android:layout_width="match_parent"
        android:layout_height="100dp">
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:src="@drawable/img1" />
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:src="@drawable/img2" />
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:src="@drawable/img3" />
    </ViewFlipper>
</RelativeLayout>

在ViewFlipper標(biāo)簽中嵌入三個(gè)ImageView，并通過src屬性配置了每個(gè)ImageView的圖片源。

MainActivity代碼（MainActivity.java）

public class MainActivity extends Activity  {
    private ViewFlipper viewFlipper;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewFlipper = (ViewFlipper) findViewById(R.id.viewflipper);
        viewFlipper.setAutoStart(true); // 設(shè)置自動(dòng)播放功能（點(diǎn)擊事件，前自動(dòng)播放）
        viewFlipper.setFlipInterval(3000);//間隔3秒
        if (viewFlipper.isAutoStart() && !viewFlipper.isFlipping()) {
            viewFlipper.startFlipping();//自動(dòng)播放
        }
    }
}

實(shí)例化ViewFlipper之后調(diào)用其setAutoStart方法設(shè)置自動(dòng)播放；調(diào)用setFlipInterval設(shè)置播放時(shí)間間隔；調(diào)用startFlipping方法開始自動(dòng)播放。

動(dòng)態(tài)配置

主布局文件（activity_main.xml）

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ViewFlipper
        android:id="@+id/viewflipper"
        android:layout_width="match_parent"
        android:layout_height="100dp" />
</RelativeLayout>

動(dòng)態(tài)配置不用再布局文件中添加子View，通過Java代碼動(dòng)態(tài)添加。

public class MainActivity extends Activity  {
    private int[] imgs = { R.drawable.img1, R.drawable.img2, R.drawable.img3 };//圖片源
    private ViewFlipper viewFlipper;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewFlipper = (ViewFlipper) findViewById(R.id.viewflipper);
        for (int i = 0; i < imgs.length; i++) { // 動(dòng)態(tài)添加圖片源
            ImageView iv = new ImageView(this);
            iv.setImageResource(imgs[i]);
            iv.setScaleType(ImageView.ScaleType.FIT_XY);
            viewFlipper.addView(iv, new LayoutParams(LayoutParams.MATCH_PARENT,
                    LayoutParams.MATCH_PARENT));
        }
        viewFlipper.setAutoStart(true); // 設(shè)置自動(dòng)播放功能（點(diǎn)擊事件，前自動(dòng)播放）
        viewFlipper.setFlipInterval(3000);//間隔3秒
        if (viewFlipper.isAutoStart() && !viewFlipper.isFlipping()) {
            viewFlipper.startFlipping();//自動(dòng)播放
        }
    }
}

首先設(shè)置了圖片源imgs數(shù)組，然后通過遍歷的方式，將ImageView通過add方法添加到ViewFlipper中，這里ImageView調(diào)用了setScaleType方法設(shè)置了圖片在ImageView上的顯示樣式，這里總結(jié)一下方法里參數(shù)的含義：

SetScaleType(ImageView.ScaleType.CENTER)：不改變圖片的size居中顯示，當(dāng)圖片的長/寬超過View的長或?qū)挄r(shí)，截取圖片的居中部分顯示。
setScaleType(ImageView.ScaleType.CENTER_INSIDE)：改變圖片的size居中顯示，可以顯示完成的圖片。
setScaleType(ImageView.ScaleType.FIT_CENTER)：把圖片按比例縮放到View的寬度，居中顯示。
setScaleType(ImageView.ScaleType.FIT_XY)：不按比例縮放圖片，將圖片塞滿整個(gè)View（圖片會(huì)被拉扯變形）。
SetScaleType(ImageView.ScaleType.CENTER_CROP)：按比例擴(kuò)大圖片居中顯示，占據(jù)整個(gè)View，圖片會(huì)被截取，不會(huì)變形。
SetScaleType(ImageView.ScaleType.FIT_START/FIT_END)：與FIT_CENTER一樣，都是按比例縮放圖片，只不過FiT_CENTER是居中顯示，而FIT_START是置于頂部，F(xiàn)IT_END是置于底部。

代碼中調(diào)用了ViewFlipper的setAutoStart方法，設(shè)置自動(dòng)播放，調(diào)用了setFlipInterval方法，設(shè)置了自動(dòng)播放的時(shí)間間隔，調(diào)用了startFlipping方法，開始自動(dòng)播放。

運(yùn)行項(xiàng)目實(shí)例如下：

http://wiki.jikexueyuan.com/project/twenty-four-Scriptures/images/16-3.png" alt="這里寫圖片描述" />

圖片每隔3秒鐘會(huì)自動(dòng)切換。

除了自動(dòng)播放之外，還可以通過覆寫onTouch方法，通過監(jiān)聽用戶手指滑動(dòng)方向，并結(jié)合showPrevious和showNext方法實(shí)現(xiàn)圖片切換。下面在MainActivity中添加一些代碼實(shí)現(xiàn)手勢切換圖片。

MainActivity代碼（MainActivity.java）

public class MainActivity extends Activity  {
    private int[] imgs = { R.drawable.img1, R.drawable.img2, R.drawable.img3 };//圖片源
    private ViewFlipper viewFlipper;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewFlipper = (ViewFlipper) findViewById(R.id.viewflipper);
        for (int i = 0; i < imgs.length; i++) { // 動(dòng)態(tài)添加圖片源
            ImageView iv = new ImageView(this);
            iv.setImageResource(imgs[i]);
            iv.setScaleType(ImageView.ScaleType.CENTER);
            viewFlipper.addView(iv, new LayoutParams(LayoutParams.MATCH_PARENT,
                    LayoutParams.MATCH_PARENT));
        }
        viewFlipper.setAutoStart(true); // 設(shè)置自動(dòng)播放功能（點(diǎn)擊事件，前自動(dòng)播放）
        viewFlipper.setFlipInterval(3000);//間隔3秒
        if (viewFlipper.isAutoStart() && !viewFlipper.isFlipping()) {
            viewFlipper.startFlipping();//自動(dòng)播放
        }
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        float startX=0f,tempX;
        switch (event.getAction()){
            case MotionEvent.ACTION_DOWN:
                startX=event.getX();
                break;
            case MotionEvent.ACTION_MOVE:
                break;
            case MotionEvent.ACTION_UP:
                viewFlipper.stopFlipping();
                tempX=event.getX();
                if(tempX-startX>100){//向右滑動(dòng)看前一頁
                    viewFlipper.showPrevious();
                 viewFlipper.setInAnimation(this,R.anim.push_left_in);
                 viewFlipper.setOutAnimation(this,R.anim.push_left_out);
                }else if(startX-tempX>100){//向左滑動(dòng)看后一頁
                    viewFlipper.showNext();
               viewFlipper.setInAnimation(this,R.anim.push_right_in);
               viewFlipper.setOutAnimation(this,R.anim.push_right_out);
                }
                break;
        }
        return super.onTouchEvent(event);
    }
}

這里覆寫了onTouchEvent方法，由參數(shù)event并調(diào)用getAction方法可以獲得三個(gè)常量：

MotionEvent.ACTION_DOWN：手指按下事件，每按下一次觸發(fā)一次
MotionEvent.ACTION_MOVE：手指滑動(dòng)事件，滑動(dòng)時(shí)觸發(fā)N次
MotionEvent.ACTION_UP：手指抬起事件，每抬起一次觸發(fā)一次

這里在手指按下時(shí)，通過變量startX記錄初始x坐標(biāo)值，在手指抬起時(shí)，記錄抬起時(shí)刻的x坐標(biāo)值，通過兩次坐標(biāo)值之差間接反映用戶左劃還是右劃，然后調(diào)用showNext或showPrevious方法進(jìn)行圖片的切換，并在切換時(shí)設(shè)置了動(dòng)畫效果。注意，在手動(dòng)切換時(shí)調(diào)用ViewFlipper的stopFlipping方法停止自動(dòng)播放圖片，以免造成切換混亂。下面將講解四個(gè)動(dòng)畫文件，動(dòng)畫文件中各標(biāo)簽的含義在動(dòng)畫部分會(huì)詳細(xì)講解。

動(dòng)畫代碼（push_left_in.xml）

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
    <translate
        android:duration="1500"
        android:fromXDelta="100%p"
        android:toXDelta="0" />  <!-- 位移   -->
    <alpha
        android:duration="1500"
        android:fromAlpha="0.1"
        android:toAlpha="1.0" /> <!-- 漸變    -->
</set>

動(dòng)畫代碼（push_left_out.xml）

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
    <translate
        android:duration="1500"
        android:fromXDelta="0"
        android:toXDelta="-100%p" />
    <alpha
        android:duration="1500"
        android:fromAlpha="1.0"
        android:toAlpha="0.1" />
</set>

動(dòng)畫代碼（push_right_in.xml）

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
    <translate
        android:duration="1500"
        android:fromXDelta="-100%p"
        android:toXDelta="0" />
    <alpha
        android:duration="1500"
        android:fromAlpha="0.1"
        android:toAlpha="1.0" />
</set>

動(dòng)畫代碼（push_right_out.xml）

<set xmlns:android="http://schemas.android.com/apk/res/android" >
    <translate
        android:duration="1500"
        android:fromXDelta="0"
        android:toXDelta="100%p" />
    <alpha
        android:duration="1500"
        android:fromAlpha="1.0"
        android:toAlpha="0.1" />
</set>

運(yùn)行實(shí)例：

http://wiki.jikexueyuan.com/project/twenty-four-Scriptures/images/16-4.png" alt="這里寫圖片描述" />

這時(shí)可以看到動(dòng)畫過渡效果。

上一篇：第十一章-各種對(duì)話框Dialog集錦下一篇：第八章-時(shí)間相關(guān)控件

在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

第十六章-幻燈片ViewFlipper

靜態(tài)配置

動(dòng)態(tài)配置