Android技術——視圖切換（四）“ViewSwitcher+手勢識別”實現視圖的滑動切換

標籤：android

Android技術——視圖切換（一）~（四）項目的原始碼在：https://github.com/YongYuIT/MeiNv_Liulanqi

上文《Android技術——視圖切換（三）》實現的圖片切換，雖然切換時有動畫效果，但是卻需要使用按鈕才能切換。這個執行個體中，將嘗試用手勢識別代替按鈕來實現圖片切換。

這個執行個體也是基於前三篇文章裡的項目添加而來的。

/MeiNv_Liulanqi/res/layout/activity_view_switcher_huadong.xml檔案：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
    <!-- 定義一個ViewSwitcher組件 -->
    <ViewSwitcher
        android:id="@+id/viewSwitcher"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />
    <!-- 定義滾動到上一屏的按鈕 -->
</RelativeLayout>

/MeiNv_Liulanqi/src/com/example/meinv_liulanqi/ViewSwitcherHuadongActivity.java檔案：

package com.example.meinv_liulanqi;
import android.app.Activity;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ViewSwitcher;
import android.widget.ViewSwitcher.ViewFactory;
public class ViewSwitcherHuadongActivity extends Activity
{
    private int             screenNo = -1;
    private int             screenNum;
    public ViewSwitcher     switcher;
    public int[]            img_ids;
    private GestureDetector myDesDet;
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_view_switcher_huadong);
        // GestureDetector用於從OnTouchListener的onTouch函數中接收資料由此判別手勢，
        // 識別出手勢後，由OnGestureListener響應。
        myOnGestureListener listener = new myOnGestureListener(this);
        myDesDet = new GestureDetector(listener);
        img_ids = new int[] { R.drawable.linzhiling, R.drawable.liuyan,
                R.drawable.yangmi };
        screenNum = img_ids.length;
        // 為ViewSwitcher提供視圖工廠
        switcher = (ViewSwitcher) findViewById(R.id.viewSwitcher);
        myViewFactory factory = new myViewFactory(this.getLayoutInflater(),
                myDesDet);
        switcher.setFactory(factory);
        // 初始化
        getNext(switcher, img_ids);
    }
    public void getNext(ViewSwitcher _switcher, int[] _img_ids)
    {
        if (screenNo < screenNum - 1)
        {
            screenNo++;
            // 設定視圖切換的動畫效果
            _switcher.setInAnimation(ViewSwitcherHuadongActivity.this,
                    R.anim.slide_in_right);
            _switcher.setOutAnimation(ViewSwitcherHuadongActivity.this,
                    R.anim.slide_out_left);
            // 擷取下一個視圖的執行個體
            LinearLayout lil = (LinearLayout) _switcher.getNextView();
            ImageView img = (ImageView) lil.findViewById(R.id.img_meinv);
            img.setImageResource(_img_ids[screenNo]);
            // 切換視圖
            _switcher.showNext();
        }
    }
    public void getPrev(ViewSwitcher _switcher, int[] _img_ids)
    {
        if (screenNo > 0)
        {
            screenNo--;
            // 設定視圖切換的動畫效果
            _switcher.setInAnimation(ViewSwitcherHuadongActivity.this,
                    R.anim.slide_in_lef);
            _switcher.setOutAnimation(ViewSwitcherHuadongActivity.this,
                    R.anim.slide_out_right);
            // 擷取下一個視圖的執行個體
            LinearLayout lil = (LinearLayout) _switcher.getNextView();
            ImageView img = (ImageView) lil.findViewById(R.id.img_meinv);
            img.setImageResource(_img_ids[screenNo]);
            // 切換視圖
            _switcher.showPrevious();
        }
    }
    class myViewFactory implements ViewFactory
    {
        private LayoutInflater  inflater;
        private GestureDetector desDet;
        public myViewFactory(LayoutInflater _inf, GestureDetector _desDet)
        {
            inflater = _inf;
            desDet = _desDet;
        }
        @Override
        public View makeView()
        {
            // 提供下一個視圖的執行個體
            View v = inflater.inflate(R.layout.fragment_layout, null);
            ImageView img = (ImageView) v.findViewById(R.id.img_meinv);
            // 為圖片註冊觸摸事件監聽器
            img.setOnTouchListener(new myOnTouchListener(desDet));
            return v;
        }
    }
    // 擴充得到自己的觸摸事件監聽器
    class myOnTouchListener implements OnTouchListener
    {
        private GestureDetector desDet;
        public myOnTouchListener(GestureDetector _desDet)
        {
            desDet = _desDet;
        }
        @Override
        public boolean onTouch(View arg0, MotionEvent arg1)
        {
            // 將監聽資料傳到GestureDetector，GestureDetector可以從中判別手勢
            return desDet.onTouchEvent(arg1);
        }
    }
}

/MeiNv_Liulanqi/src/com/example/meinv_liulanqi/myOnGestureListener.java檔案：

package com.example.meinv_liulanqi;
import java.util.Date;
import android.view.MotionEvent;
import android.view.GestureDetector.OnGestureListener;
public class myOnGestureListener implements OnGestureListener
{
    private ViewSwitcherHuadongActivity act;
    private static Date                 lastTime = null;
    public myOnGestureListener(ViewSwitcherHuadongActivity a)
    {
        act = a;
    }
    @Override
    // 第三個參數是：滑動手勢在水平方向上的位移量
    // 第四個參數是：滑動手勢在垂直方向上的位移量
    public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
            float distanceY)
    {
        // 擷取目前時間
        Date curDate = new Date(System.currentTimeMillis());
        float shijiancha = 1000;
        if (lastTime != null)
        {
            shijiancha = curDate.getTime() - lastTime.getTime();
        }
        // 對比兩次滑動手勢之間的時間間隔。
        // 由於對螢幕的一次滑動可能會被GestureDetector識別到好幾次手勢，所以需要過濾掉時間間隔太短的手勢。
        if (shijiancha > 500)
        {
            if (distanceX > 10)
            {
                act.getNext(act.switcher, act.img_ids);
            }
            if (distanceX < -10)
            {
                act.getPrev(act.switcher, act.img_ids);
            }
        }
        lastTime = curDate;
        return true;
    }
    @Override
    public boolean onDown(MotionEvent arg0)
    {
        // TODO Auto-generated method stub
        return true;
    }
    @Override
    public boolean onFling(MotionEvent arg0, MotionEvent arg1, float arg2,
            float arg3)
    {
        // TODO Auto-generated method stub
        return true;
    }
    @Override
    public void onLongPress(MotionEvent arg0)
    {
        // TODO Auto-generated method stub
    }
    @Override
    public void onShowPress(MotionEvent arg0)
    {
        // TODO Auto-generated method stub
    }
    @Override
    public boolean onSingleTapUp(MotionEvent arg0)
    {
        // TODO Auto-generated method stub
        return true;
    }
}

實現的效果：

美女滑動中...

Android技術——視圖切換（四）“ViewSwitcher+手勢識別”實現視圖的滑動切換