天天看点

android 辅助功能 翻页,Android使用手势实现翻页效果

本程序的手势检测思路就是把Activity的TouchEvent交给GestureDetector处理,本程序使用了一个ViewFlipper组件,ViewFlipper可使用动画控制多个组件之间的切换效果。

本实例程序通过GestureDetector来检测用户的手势动作,并根据手势动作来控制ViewFlipper包含的View组件的切换,从而实现翻页效果。

activity_main.xml布局界面代码:

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical">

android:id="@+id/flipper"

android:layout_width="wrap_content"

android:layout_height="wrap_content" />

MainActivity.java逻辑代码:

package com.fukaimei.gestureflip;

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.view.GestureDetector;

import android.view.MotionEvent;

import android.view.View;

import android.view.animation.Animation;

import android.view.animation.AnimationUtils;

import android.widget.ImageView;

import android.widget.ViewFlipper;

public class MainActivity extends AppCompatActivity implements GestureDetector.OnGestureListener {

// ViewFlipper实例

ViewFlipper flipper;

// 定义手势检测实例

GestureDetector detector;

// 定义一个动画数组,用于为ViewFlipper指定切换动画效果

Animation[] animations = new Animation[4];

// 定义手势动作亮点之间的最小距离

final int FLIP_DISTANCE = 50;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

// 创建手势检测器

detector = new GestureDetector(this, this);

// 获得ViewFlipper实例

flipper = (ViewFlipper) this.findViewById(R.id.flipper);

// 为ViewFlipper添加8个ImageView组件

flipper.addView(addImageView(R.drawable.img01));

flipper.addView(addImageView(R.drawable.img02));

flipper.addView(addImageView(R.drawable.img03));

flipper.addView(addImageView(R.drawable.img04));

flipper.addView(addImageView(R.drawable.img05));

flipper.addView(addImageView(R.drawable.img06));

flipper.addView(addImageView(R.drawable.img07));

flipper.addView(addImageView(R.drawable.img08));

// 初始化Animation数组

animations[0] = AnimationUtils.loadAnimation(this, R.anim.left_in);

animations[1] = AnimationUtils.loadAnimation(this, R.anim.left_out);

animations[2] = AnimationUtils.loadAnimation(this, R.anim.right_in);

animations[3] = AnimationUtils.loadAnimation(this, R.anim.right_out);

}

// 定义添加ImageView的工具方法

private View addImageView(int resId) {

ImageView imageView = new ImageView(this);

imageView.setImageResource(resId);

imageView.setScaleType(ImageView.ScaleType.CENTER);

return imageView;

}

@Override

public boolean onTouchEvent(MotionEvent event) {

// 将该Activity上的触碰事件交给GestureDetector处理

return detector.onTouchEvent(event);

}

@Override

public boolean onDown(MotionEvent e) {

return false;

}

@Override

public void onShowPress(MotionEvent e) {

}

@Override

public boolean onSingleTapUp(MotionEvent e) {

return false;

}

@Override

public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {

return false;

}

@Override

public void onLongPress(MotionEvent e) {

}

@Override

public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {

// 如果第一个触点事件的X坐标大于第二个触点事件的X坐标超过FLIP_DISTANCE

// 也就是手势从右向左滑

if (e1.getX() - e2.getX() > FLIP_DISTANCE) {

// 为flipper设置切换的动画效果

flipper.setInAnimation(animations[0]);

flipper.setOutAnimation(animations[1]);

flipper.showPrevious();

return true;

}

// 如果第二个触点事件的X坐标大于第一个触点事件的X坐标超过FLIP_DISTANCE

// 也就是手势从右向左滑

else if (e2.getX() - e1.getX() > FLIP_DISTANCE) {

// 为flipper设置切换的动画效果

flipper.setInAnimation(animations[2]);

flipper.setOutAnimation(animations[3]);

flipper.showNext();

return true;

}

return false;

}

}

anim/left_in.xml代码:

android:duration="500"

android:fromXDelta="100%p"

android:toXDelta="0" />

android:duration="500"

android:fromAlpha="0.1"

android:toAlpha="1.0" />

anim/left_out.xml代码:

android:duration="500"

android:fromXDelta="0"

android:toXDelta="-100%p" />

android:duration="500"

android:fromAlpha="0.1"

android:toAlpha="1.0" />

anim/right_in.xml代码:

android:duration="500"

android:fromXDelta="-100%p"

android:toXDelta="0" />

android:duration="500"

android:fromAlpha="0.1"

android:toAlpha="1.0" />

anim/right_out.xml代码:

android:duration="500"

android:fromXDelta="0"

android:toXDelta="100%p" />

android:duration="500"

android:fromAlpha="0.1"

android:toAlpha="1.0" />

上面的MainActivity.java逻辑代码只是实现了GestureDetector.OnGestureListener的onFling()方法,上面的程序的代码负责实现:当e1.getX() - e2.getX()的距离大于特定距离时,即可判断用户手势为从右向左滑动,此时设置ViewFlipper采用动画方式切换为上一个View;当e2.getX() - e2.getX()的距离大于特定距离时,即可判断用户手势为从左向右滑动,此时设置ViewFlipper采用动画方式切换为下一个View——这样就实现了所谓的“翻页”效果。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。