鸿蒙手势交互(四:多层手势)

在这里插入图片描述

四、多层手势

指父子组件嵌套时,父子组件均绑定了手势或事件。有两种,一种默认多层级手势事件,一种自定义多层级手势事件。

  1. 默认多层级手势事件:需要分清两个概念,触摸事件,手势与事件
  • 触摸事件:
    触摸事件(onTouch事件)是所有手势组成的基础,有Down,Move,Up,Cancel四种。手势均由触摸事件组成,例如,点击为Down+Up,滑动为Down+一系列Move+Up

//组件B和组件C作为组件A的子组件,当触摸到组件B或者组件C时,组件A也会被触摸到。
ComponentA() {ComponentB().onTouch(() => {})ComponentC().onTouch(() => {})
}.onTouch(() => {})//组件B和组件C作为Stack A的子组件,组件C覆盖在组件B上。当触摸到组件B或者组件C时,Stack A也会被触摸到。(组件B被组件C遮盖)
Stack A() {ComponentB().onTouch(() => {})ComponentC().onTouch(() => {})
}.onTouch(() => {})
  • 手势与事件:
    除了触摸事件(onTouch事件)外的所有手势与事件,均是通过基础手势或者组合手势实现的。例如,拖拽事件是由长按手势和滑动手势组成的一个顺序手势。
  1. 自定义控制的多层级手势事件
    通过设置属性,控制默认的多层级手势事件竞争流程,更好的实现手势事件。
    responseRegion属性和hitTestBehavior属性可以控制Touch事件的分发,从而可以影响到onTouch事件和手势的响应。而绑定手势方法属性可以控制手势的竞争从而影响手势的响应,但不能影响到onTouch事件。
  • responseRegion对手势和事件的控制
// 当绑定了responseRegion后,手势与事件的响应区域范围将以所绑定的区域范围为准,而不是以布局区域为准,可能出现布局相关区域不响应手势与事件的情况ComponentA() {// 当组件B绑定了.responseRegion({Rect1, Rect2, Rect3})的属性后,// 所有落在Rect1,Rect2和Rect3区域范围的触摸事件和手势可被组件B对应的回调响应。ComponentB().onTouch(() => {}).gesture(TapGesture({count: 1})).responseRegion({Rect1, Rect2, Rect3})
}
.onTouch(() => {})
// 当组件A绑定了.responseRegion({Rect4})的属性后,
// 所有落在Rect4区域范围的触摸事件和手势可被组件A对应的回调响应。
.gesture(TapGesture({count: 1}))
.responseRegion({Rect4})
  • hitTestBehavior对手势和事件的控制
// hitTestBehavior属性可以实现在复杂的多层级场景下,一些组件能够响应手势和事件,而一些组件不能响应手势和事件ComponentA() {ComponentB().onTouch(() => {}).gesture(TapGesture({count: 1}))ComponentC() {ComponentD().onTouch(() => {}).gesture(TapGesture({count: 1}))}.onTouch(() => {}).gesture(TapGesture({count: 1})).hitTestBehavior(HitTestMode.Block)
}
.onTouch(() => {})
.gesture(TapGesture({count: 1}))// HitTestMode.Block自身会响应触摸测试,阻塞子节点和兄弟节点的触摸测试,从而导致子节点和兄弟节点的onTouch事件和手势均无法触发。// 当组件C未设置hitTestBehavior时,点击组件D区域,组件A、组件C和组件D的onTouch事件会触发,组件D的点击手势会触发。// 当组件C设置了hitTestBehavior为HitTestMode.Block时,点击组件D区域,组件A和组件C的onTouch事件会触发,组件D的onTouch事件未触发。同时,由于组件D的点击手势因为被阻塞而无法触发,组件C的点击手势会触发。

Stack A() {ComponentB().onTouch(() => {}).gesture(TapGesture({count: 1}))ComponentC().onTouch(() => {}).gesture(TapGesture({count: 1})).hitTestBehavior(HitTestMode.Transparent)
}
.onTouch(() => {})
.gesture(TapGesture({count: 1}))// HitTestMode.Transparent自身响应触摸测试,不会阻塞兄弟节点的触摸测试。// 当组件C未设置hitTestBehavior时,点击组件B和组件C的重叠区域时,Stack A和组件C的onTouch事件会触发,组件C的点击事件会触发,组件B的onTouch事件和点击手势均不触发。// 而当组件C设置hitTestBehavior为HitTestMode.Transparent时,点击组件B和组件C的重叠区域,组件A和组件C不受到影响与之前一致,组件A和组件C的onTouch事件会触发,组件C的点击手势会触发。而组件B因为组件C设置了HitTestMode.Transparent,组件B也收到了Touch事件,从而组件B的onTouch事件和点击手势触发。
  • 绑定手势方法对手势的控制
// 父子组件所绑定手势类型相同时,子组件优先于父组件响应
ComponentA() {ComponentB().gesture(TapGesture({count: 1}))
}
.gesture(TapGesture({count: 1}))
// 以带优先级的方式绑定手势,则可使得父组件所绑定手势的响应优先级高于子组件
ComponentA() {ComponentB().gesture(TapGesture({count: 1}))
}
.priorityGesture(TapGesture({count: 1}))
// 使用并行的方式在父组件绑定手势,父子组件所绑定的手势不发生冲突,均可响应
ComponentA() {ComponentB().gesture(TapGesture({count: 1}))
}
.parallelGesture(TapGesture({count: 1}))

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/54322.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Parallels Desktop 20 for Mac中文版发布了?会哪些新功能

Parallels Desktop 20 for Mac 正式发布,完全支持 macOS Sequoia 和 Windows 11 24H2,并且在企业版中引入了全新的管理门户。 据介绍,新版本针对 Windows、macOS 和 Linux 虚拟机进行了大量更新,最大的亮点是全新推出的 Parallels…

智慧火灾应急救援航拍检测数据集(无人机视角)

智慧火灾应急救援。 无人机,直升机等航拍视角下火灾应急救援检测数据集,数据分别标注了火,人,车辆这三个要素内容,29810张高清航拍影像,共31GB,适合森林防火,应急救援等方向的学术研…

【C++ Primer Plus习题】16.10

大家好,这里是国中之林! ❥前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站。有兴趣的可以点点进去看看← 问题: 解答: #include <iostream> #include <string> #include <…

高质量的翻译:应用程序可用性和成功的关键

在日益全球化的应用市场中&#xff0c;开发一款优秀的产品只是成功的一半。另一半&#xff1f;确保你的用户&#xff0c;无论他们在哪里或说什么语言&#xff0c;都能无缝理解和使用它。这就是高质量翻译的用武之地——不是事后的想法&#xff0c;而是应用程序可用性和最终成功…

2-100 基于matlab的水果识别

基于matlab的水果识别。从面积特征、似圆形特征&#xff0c;颜色(rgb值和hsv值)特征对图像中的梨子、苹果、桃子、香蕉和菠萝进行特征提取&#xff0c;边缘检测识别&#xff0c;最后按照筛选出来的特征对水果进行识别。程序已调通&#xff0c;可直接运行。 下载源程序请点链接…

一天认识一个硬件之连接线

我们在日常工作生活中经常会用到许多连接线&#xff0c;比如视频线&#xff0c;USB线&#xff0c;但是他们的区别在哪里&#xff0c;可能太不清楚&#xff0c;今天就来给大家分享一下。 HDMI线 特点&#xff1a;HDMI线是一种全数字化视频和声音发送接口&#xff0c;可以发送未…

PCL 点云圆柱邻域搜索

目录 一、概述 1.1原理 1.2实现步骤 1.3应用场景 二、代码实现 2.1关键函数 2.2完整代码 三、实现效果 PCL点云算法汇总及实战案例汇总的目录地址链接&#xff1a; PCL点云算法与项目实战案例汇总&#xff08;长期更新&#xff09; 一、概述 本文将介绍如何使用PCL库进…

Snapchat API 访问:Objective-C 实现示例

Snapchat 是一个流行的社交媒体平台&#xff0c;它允许用户发送和接收短暂存在的图片和视频。对于开发者来说&#xff0c;访问 Snapchat API 可以为应用程序添加独特的社交功能。本文将介绍如何在 Objective-C 中实现对 Snapchat API 的访问&#xff0c;并提供一个详细的代码示…

spring boot启动报错:so that it conforms to the canonical names requirements

springboot 2.x的版本中对配置文件中的命名规范有了强制性的要求&#xff0c;如下图所示中的dataSource属性属于驼峰格式&#xff0c;但是在springboot 2.x中不允许使用驼峰形式。 根据错误提示可知将其使用 - 来分割即可 错误信息的含义&#xff1a;“Canonical names should…

LLM - 理解 多模态大语言模型(MLLM) 的 指令微调(Instruction-Tuning) 与相关技术 (四)

欢迎关注我的CSDN&#xff1a;https://spike.blog.csdn.net/ 本文地址&#xff1a;https://spike.blog.csdn.net/article/details/142237871 免责声明&#xff1a;本文来源于个人知识与公开资料&#xff0c;仅用于学术交流&#xff0c;欢迎讨论&#xff0c;不支持转载。 完备(F…

最新版本TensorFlow训练模型TinyML部署到ESP32入门实操

最新版本TensorFlow训练模型TinyML入门实操 1.概述 这篇文章介绍微型嵌入式设备的机器学习TinyML&#xff0c;它们的特点就是将训练好的模型部署到单片机上运行。 2.TensorFlow深度学习原理 TensorFlow开源项目是由google研发的一个嵌入式机器学习工具&#xff0c;通过调用…

鸿蒙媒体开发系列07——AVRecorder音频录制

如果你也对鸿蒙开发感兴趣&#xff0c;加入“Harmony自习室”吧&#xff01;扫描下方名片&#xff0c;关注公众号&#xff0c;公众号更新更快&#xff0c;同时也有更多学习资料和技术讨论群。 1、概述 在HarmonyOS系统中&#xff0c;多种API都提供了音频录制开发的支持&#x…

2024永久激活版 Studio One 6 Pro for mac 音乐创作编辑软件 完美兼容

Studio One 6是一款功能强大的音乐制作软件&#xff0c;由PreSonus公司开发。它提供了全面的音频录制、编辑、混音和母带处理工具&#xff0c;适用于音乐制作人、音频工程师和创作人员。 Studio One 6拥有直观的用户界面&#xff0c;使用户能够快速而流畅地进行音乐创作。它采…

ubuntu安装emqx

目录 1.预先下载好emqx压缩包 2.使用tar命令解压 3.进入bin目录 5.放开访问端口18083 6.从通过ip地址访问emqx后台 7.默认用户名密码为admin/public 8.登录后台 9.资源包绑定在此博文可自取 1.预先下载好emqx压缩包 2.使用tar命令解压 sudo tar -xzvf emqx-5.0.8-el8-…

莱卡相机sd内存卡格式化了怎么恢复数据

在数字化时代&#xff0c;相机已成为我们记录生活、捕捉瞬间的重要设备。而SD内存卡&#xff0c;作为相机的存储媒介&#xff0c;承载着我们的珍贵记忆和重要数据。然而&#xff0c;有时由于误操作、系统错误或其他原因&#xff0c;我们可能会不小心格式化SD内存卡&#xff0c;…

一个基于VB的期刊信息管理系统

一个基本的期刊信息管理系统的示例&#xff0c;使用 Visual Basic (VB.NET) 编写。这个示例将展示如何创建一个简单的期刊信息管理系统&#xff0c;其中包括添加、查看、编辑和删除期刊的功能。 系统需求 添加期刊&#xff1a;允许用户输入期刊的信息&#xff08;如标题、作者…

OpenAI GPT o1技术报告阅读(3)-英文阅读及理解

✨继续阅读报告&#xff1a;使用大模型来学习推理(Reason) 原文链接&#xff1a;https://openai.com/index/learning-to-reason-with-llms/ 这次我们继续看一个英文阅读理解的案例。 原问题&#xff1a; The following passage is the draft of an excerpt from a contempora…

条件编译代码记录

#include <iostream>// 基类模板 template<typename T> class Base { public:void func() {std::cout << "Base function" << std::endl;} };// 特化的子类 template<typename T> class Derived : public Base<T> { public:void…

MYSQL数据库——MYSQL管理

MYSQL数据库安装完成后&#xff0c;自带四个数据库&#xff0c;具体作用如下&#xff1a; 常用工具 1.mysql 不是指mysql服务&#xff0c;而是指mysql的客户端工具 例如&#xff1a; 2.mysqladmin 这是一个执行管理操作的客户端程序&#xff0c;可以用它来检查服务器的配置和…

多线程篇六

多线程篇六 如笔者理解有误欢迎交流指正~⭐ 什么是单例模式&#xff1f; 单例模式是最常见的 设计模式. 顾名思义&#xff0c;单例模式指的就是单个实例的模式.&#xff08;针对某些类只能使用一个对象的场景【如MySQL、JDBC、DataSource】&#xff09; 设计模式 设计模式是…