Android三種左右滑動效果 手勢識別左右滑動效果左右滑動指引效果漸顯按鈕的左右滑動效果

手勢識別

1.onCreate中添加GestureDetector mGestureDetector;

 //監聽手勢事件

mGestureDetector = new GestureDetector(this, onGestureListener);

2.//實現處理事件

OnGestureListener onGestureListener = new OnGestureListener() {

 //添加未實現的方法

};

 3.重寫onTouch事件

//交由手勢探測介面處理觸摸事件

public boolean onTouchEvent(MotionEvent event) {

return mGestureDetector.onTouchEvent(event);

}

左右滑動效果

1、在xml中定義ViewFlipper控制項；

2、重寫onTouchEvent方法，用於捕獲Touch事件

View Code

3、寫push_left_in.xml、push_left_out.xml、push_right_in.xml、push_right_out.xml檔案，用於滑動時的效果顯現；

4、在Activity中定義OnGestureListener，重寫onFling方法，根據e1、e2的座標差判斷左右滑動，同時在裡面寫滑動的效果。

View Code

@Override    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,            float velocityY) {        if (e1.getX() - e2.getX() > 120) {            this.flipper.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.push_left_in));            this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.push_left_out));            this.flipper.showNext();            return true;        } else if (e1.getX() - e2.getX() < -120) {            this.flipper.setInAnimation(AnimationUtils.loadAnimation(this, R.anim.push_right_in));            this.flipper.setOutAnimation(AnimationUtils.loadAnimation(this, R.anim.push_right_out));            this.flipper.showPrevious();            return true;        }                return false;    }

工程下載：GuideViewTest.rar

來自：http://www.cnblogs.com/hanyonglu/archive/2012/02/13/2349827.html

左右滑動指引效果

1、加入android-support-v4.jar，關於android-support-v4.jar的詳細資料，大家可以訪問google官方網站：http://developer.android.com/sdk/compatibility-library.html；

2、XML中，用FrameLayout完成布局，放入ViewPager和指引表徵圖

View Code

<?xml version="1.0" encoding="utf-8"?><FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="vertical" >        <include layout="@layout/item_header" />        <android.support.v4.view.ViewPager            android:id="@+id/guidePages"            android:layout_width="fill_parent"            android:layout_height="wrap_content" />    </LinearLayout>    <!-- 指引表徵圖 -->    <LinearLayout        android:id="@+id/viewGroup"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:layout_gravity="bottom"        android:layout_marginBottom="40dp"        android:gravity="center_horizontal"        android:orientation="horizontal" >    </LinearLayout></FrameLayout>

3、將頁面配置加入View的列表中，有幾個布局頁面就有幾個圓點圖片，通過for迴圈設定圓點圖片的布局；

View Code

//添加到View的List中LayoutInflater inflater = getLayoutInflater();pageViews = new ArrayList<View>();pageViews.add(inflater.inflate(R.layout.item05, null));pageViews.add(inflater.inflate(R.layout.item06, null));pageViews.add(inflater.inflate(R.layout.item01, null));pageViews.add(inflater.inflate(R.layout.item02, null));pageViews.add(inflater.inflate(R.layout.item03, null));pageViews.add(inflater.inflate(R.layout.item04, null));// 有幾個布局頁面就有幾個圓點圖片imageViews = new ImageView[pageViews.size()];// 通過for迴圈設定圓點圖片的布局for (int i = 0; i < pageViews.size(); i++) {    imageView = new ImageView(GuideViewTestActivity.this);    imageView.setLayoutParams(new LayoutParams(20, 20));    imageView.setPadding(20, 0, 20, 0);    imageViews[i] = imageView;    if (i == 0) {    　　// 預設選中第一張圖片    　　imageViews[i].setBackgroundResource(R.drawable.page_indicator_focused);    } else{    　　imageViews[i].setBackgroundResource(R.drawable.page_indicator);    }    group.addView(imageViews[i]);}

4、資料配接器和頁面切換事件監聽器

5、在指引頁面變更事件監聽器(GuidePageChangeListener)中要確保在切換頁面時下面的圓點圖片也跟著改變

View Code

@Override  public void onPageSelected(int arg0) {        for (int i = 0; i < imageViews.length; i++) {             imageViews[arg0].setBackgroundResource(R.drawable.page_indicator_focused);                           if (arg0 != i) {                  imageViews[i].setBackgroundResource(R.drawable.page_indicator);             }         }}

工程下載：MyAndroidFlip.rar

來自：http://www.cnblogs.com/hanyonglu/archive/2012/04/07/2435589.html

漸顯按鈕的左右滑動效果

1、XML中，定義ViewFlipper控制項，在裡面加入多個頁面配置，也可以用代碼ViewFlipper的addView方法；

2、寫push_left_in.xml、push_left_out.xml、push_right_in.xml、push_right_out.xml檔案；

3、加入許可權

 <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />

4、在Activity中，初始化左右懸浮按鈕，建立左右按鈕，並設定監聽事件(替換圖片)；

View Code

/**     * 初始化懸浮按鈕     */    private void initImageButtonView() {        // 擷取WindowManager        wm = (WindowManager) getApplicationContext().getSystemService("window");        // 設定LayoutParams相關參數        wmParams = new WindowManager.LayoutParams();        // 設定window type        wmParams.type = LayoutParams.TYPE_PHONE;        // 設定圖片格式，效果為背景透明        wmParams.format = PixelFormat.RGBA_8888;        // 設定Window flag參數        wmParams.flags = LayoutParams.FLAG_NOT_TOUCH_MODAL                | LayoutParams.FLAG_NOT_FOCUSABLE;        // 設定x、y初始值        wmParams.x = 0;        wmParams.y = 0;        // 設定視窗長寬資料        wmParams.width = 50;        wmParams.height = 50;        // 建立左右按鈕        createLeftButtonView();        createRightButtonView();    }

5、重寫onTouchEvent事件，用於觸發顯示和隱藏懸浮按鈕事件（MotionEvent.ACTION_DOWN和MotionEvent.ACTION_UP）；

6、利用線程，控制懸浮按鈕的透明度（Alpha和invalidate）

工程下載：MyPageFliper.rar

來自：http://www.cnblogs.com/hanyonglu/archive/2012/02/13/2350171.html