通过手势切换图片
1、创建安卓应用【SwtichBelleImageByGesture】
单击【finish】按钮
2、将图片素材拷贝到drawable目录
3、字符串资源文件
4、主布局资源文件activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/img1"
android:orientation="vertical"
tools:context=".MainActivity">
</LinearLayout>
5、主界面类MainActivity
- 定义常量和变量
private LinearLayout root;//线性根布局
private int[] imgIds;//图像资源标识符
private int imgIndex;//图像索引,图像资源标识符数组的位置
private final int IMG_COUNT = 10;//图像的总数
private GestureDetector detector;//手势侦测器
private final String TAG ="switch_belle";//标记
- 通过控件资源标识符获得控件实例
- 初始化图像标识数组
// 初始化图像标识数组
imgIds = new int[IMG_COUNT];
for (int i=0;i < IMG_COUNT;i++){
imgIds[i] = getResources().getIdentifier(
"img" + (i + 1),//标识符名称
"drawable",//定义类型
"dirnet.zh.swtich_bellei"//定义包名
);
}
- 实例化手势侦测器,每个事件处理方法输出一条调试信息
// 实例化手势侦测器
detector = new GestureDetector(new GestureDetector.OnGestureListener() {
@Override
public boolean onDown(MotionEvent e) {
Log.i(TAG,"onDown event invoked");
return false;
}
@Override
public void onShowPress(MotionEvent e) {
Log.i(TAG,"onShowPress event invoked");
}
@Override
public boolean onSingleTapUp(MotionEvent e) {
Log.i(TAG,"onSingleTapUp event invoked");
return false;
}
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
Log.i(TAG,"onScroll event invoked");
return false;
}
@Override
public void onLongPress(MotionEvent e) {
Log.i(TAG,"onLongPress event invoked");
}
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
Log.i(TAG,"onFling event invoked");
return false;
}
});
- 编写onFling()事件处理方法,通过手势切换图片
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
Log.i(TAG,"onFling event invoked");
//手势往左滑动5个像素,图片切换到下一张
if (e2.getX() < e1.getX() - 20){
if (imgIndex < IMG_COUNT - 1){
imgIndex++;
}else {
imgIndex = 0;
}
}
//手势往右5个像素,图片切换到上一张
if (e2.getX() > e1.getX() + 20){
if (imgIndex > 0){
imgIndex--;
}else {
imgIndex = IMG_COUNT - 1;
}
}
//根据变化之后的图像索引更新布局的背景图片
root.setBackgroundResource(imgIds[imgIndex]);
return false;
}
- 将窗口的触摸事件交给手势侦测器来处理
/**
* 将窗口的触摸事件交给手势侦测器来处理
*
* @param event
* @return
**/
@Override
public boolean onTouchEvent(MotionEvent event){
return detector.onTouchEvent(event);
}
- 查看完整代码
package dirnet.zh.swtich_bellei;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.widget.LinearLayout;
public class MainActivity extends AppCompatActivity {
private LinearLayout root;//线性根布局
private int[] imgIds;//图像资源标识符
private int imgIndex;//图像索引,图像资源标识符数组的位置
private final int IMG_COUNT = 10;//图像的总数
private GestureDetector detector;//手势侦测器
private final String TAG ="switch_belle";//标记
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// 利用布局资源文件设置用户界面
setContentView(R.layout.activity_main);
// 通过控件资源标识符获得控件实例
root = findViewById(R.id.root);
// 初始化图像标识数组
imgIds = new int[IMG_COUNT];
for (int i=0;i < IMG_COUNT;i++){
imgIds[i] = getResources().getIdentifier(
"img" + (i + 1),//标识符名称
"drawable",//定义类型
"dirnet.zh.swtich_bellei"//定义包名
);
}
// 实例化手势侦测器
detector = new GestureDetector(new GestureDetector.OnGestureListener() {
@Override
public boolean onDown(MotionEvent e) {
Log.i(TAG,"onDown event invoked");
return false;
}
@Override
public void onShowPress(MotionEvent e) {
Log.i(TAG,"onShowPress event invoked");
}
@Override
public boolean onSingleTapUp(MotionEvent e) {
Log.i(TAG,"onSingleTapUp event invoked");
return false;
}
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
Log.i(TAG,"onScroll event invoked");
return false;
}
@Override
public void onLongPress(MotionEvent e) {
Log.i(TAG,"onLongPress event invoked");
}
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
Log.i(TAG,"onFling event invoked");
//手势往左滑动5个像素,图片切换到下一张
if (e2.getX() < e1.getX() - 5){
if (imgIndex < IMG_COUNT - 1){
imgIndex++;
}else {
imgIndex = 0;
}
}
//手势往右5个像素,图片切换到上一张
if (e2.getX() > e1.getX() + 5){
if (imgIndex > 0){
imgIndex--;
}else {
imgIndex = IMG_COUNT - 1;
}
}
//根据变化之后的图像索引更新布局的背景图片
root.setBackgroundResource(imgIds[imgIndex]);
return false;
}
});
}
/**
* 将窗口的触摸事件交给手势侦测器来处理
*
* @param event
* @return
**/
@Override
public boolean onTouchEvent(MotionEvent event){
return detector.onTouchEvent(event);
}
}
6、启动应用,查看效果
- 左右滑动