Android使用手势实现翻页效果

发布时间 - 2026-01-11 03:19:57    点击率:

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

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

activity_main.xml布局界面代码:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical">
 <!-- 定义ViewFlipper组件 -->
 <ViewFlipper
  android:id="@+id/flipper"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content" />
</LinearLayout>

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代码:

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

anim/left_out.xml代码:

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

anim/right_in.xml代码:

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

anim/right_out.xml代码:

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

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

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


# Android  # 手势  # 翻页  # android中图片翻页效果简单的实现方法  # 解析Android中实现滑动翻页之ViewFlipper的使用详解  # Android实现阅读APP平移翻页效果  # Android利用悬浮按钮实现翻页效果  # Android通过手势实现答题器翻页效果  # 基于Android实现3D翻页效果  # Android程序开发ListView+Json+异步网络图片加载+滚动翻页的例子(图片能缓存  # 图片不错乱)  # android ViewPager实现滑动翻页效果实例代码  # Android基于ListView实现类似QQ空间的滚动翻页与滚动加载效果  # android自定义控件创建翻页接口详细代码  # 第一个  # 第二个  # 实现了  # 多个  # 将该  # 大家多多  # 为上  # 触碰  # 使用了  # os  # AppCompatActivity  # app  # animation  # MotionEvent  # view  # Bundle  # package  # fukaimei  # MainActivity 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: Laravel项目如何进行性能优化_Laravel应用性能分析与优化技巧大全  Laravel策略(Policy)如何控制权限_Laravel Gates与Policies实现用户授权  Laravel如何从数据库删除数据_Laravel destroy和delete方法区别  在线制作视频网站免费,都有哪些好的动漫网站?  html5如何设置样式_HTML5样式设置方法与CSS应用技巧【教程】  Zeus浏览器网页版官网入口 宙斯浏览器官网在线通道  如何在沈阳梯子盘古建站优化SEO排名与功能模块?  微博html5版本怎么弄发语音微博_语音录制入口及时长限制操作【教程】  深圳网站制作的公司有哪些,dido官方网站?  Bootstrap整体框架之CSS12栅格系统  微信公众帐号开发教程之图文消息全攻略  非常酷的网站设计制作软件,酷培ai教育官方网站?  成都品牌网站制作公司,成都营业执照年报网上怎么办理?  利用vue写todolist单页应用  详解Huffman编码算法之Java实现  SQL查询语句优化的实用方法总结  Laravel如何发送系统通知?(Notification渠道示例)  Linux后台任务运行方法_nohup与&使用技巧【技巧】  Laravel如何生成API文档?(Swagger/OpenAPI教程)  深圳网站制作平台,深圳市做网站好的公司有哪些?  Laravel Eloquent性能优化技巧_Laravel N+1查询问题解决  长沙企业网站制作哪家好,长沙水业集团官方网站?  微信小程序 wx.uploadFile无法上传解决办法  Python正则表达式进阶教程_复杂匹配与分组替换解析  微信小程序 input输入框控件详解及实例(多种示例)  制作ppt免费网站有哪些,有哪些比较好的ppt模板下载网站?  Bootstrap整体框架之JavaScript插件架构  昵图网官网入口 昵图网素材平台官方入口  如何在Windows环境下新建FTP站点并设置权限?  Laravel的HTTP客户端怎么用_Laravel HTTP Client发起API请求教程  如何在七牛云存储上搭建网站并设置自定义域名?  Laravel怎么集成Log日志记录_Laravel单文件与每日日志配置及自定义通道【详解】  谷歌浏览器如何更改浏览器主题 Google Chrome主题设置教程  香港服务器部署网站为何提示未备案?  Laravel中的Facade(门面)到底是什么原理  如何在Windows虚拟主机上快速搭建网站?  Laravel如何实现密码重置功能_Laravel密码找回与重置流程  网站视频制作书签怎么做,ie浏览器怎么将网站固定在书签工具栏?  Laravel如何正确地在控制器和模型之间分配逻辑_Laravel代码职责分离与架构建议  Laravel如何创建和注册中间件_Laravel中间件编写与应用流程  HTML5打空格有哪些误区_新手常犯的空格使用错误【技巧】  IOS倒计时设置UIButton标题title的抖动问题  深圳网站制作公司好吗,在深圳找工作哪个网站最好啊?  胶州企业网站制作公司,青岛石头网络科技有限公司怎么样?  Laravel如何使用Socialite实现第三方登录?(微信/GitHub示例)  Win11搜索不到蓝牙耳机怎么办 Win11蓝牙驱动更新修复【详解】  Win11怎样安装网易有道词典_Win11安装词典教程【步骤】  黑客入侵网站服务器的常见手法有哪些?  香港服务器选型指南:免备案配置与高效建站方案解析  儿童网站界面设计图片,中国少年儿童教育网站-怎么去注册?