TouchEvent

@touchstart
手指接触屏幕就触发，就触发一次
@touchend
手指从屏幕抬起松开触发一次
@touchmove
手指在屏幕滑动

手指点击，立刻抬起松开，触发一次 touchstart，触发一次touchend，不触发touchmove
手指按住，开始移动，触发一次 touchstart，按住移动的过程中持续触发touchmove，抬起松开触发一次 touchend

touchmove 事件中，中途移动到其他元素，Touch对象并不会改变，还是touchstart 一开始的对象

TouchEvent

touches：当前正在屏幕上的接触点Touch的数组 TouchList【{Touch}】。TouchList不是数组对象，只能使用普通for循环遍历
不能使用forEach ,map

几根手指正在接触就有几个Touch

targetTouches ：targetTouches 元素是 touches 的真子集。

一根手指操作，触摸的target 就是包含在当前 TouchList中，只能包含一个触摸对象。target对象就是一开始接触的点（touchstart）就确定了，开始进入一个元素，move到其他元素target 对象不会改变

2根手指（一前一后或同时按下）触摸的是同一个元素，TouchList 有2个相同的Touch对象（位置坐标不同）。
如果触摸的是不同的元素，一前一后，则 TouchList 只有最后一次(touchstart)触摸的target，move后 target不会改变

和touches 的区别，2根手指触摸的2个不同元素，touches有2个对象，targetTouches 只有触摸的最后一次 target对象。
如果2根手指触摸的相同元素，则 targetTouches =touches

子集就是一个集合中的元素，全部都是另一个集合中的元素，有可能与另一个集合相等。真子集就是一个集合中的元素，全部是另一个集合中的元素，但不存在相等。

举例说明：
设全集I为{1, 2, 3}，则它的子集是{1}、{2}、{3}、{1, 2}、{1, 3}、{2, 3}、{1, 2, 3}、?。而它的`真子集为{1}、{2}、{3}、{1, 2}、{1, 3}、{2, 3}。

changedTouches：当前(引发)事件的触摸点的
一根手指按住，就是当前操作的Touch
2根手指，一前一后，第一个不动，第2个移动。只有正在移动的的触摸点
2个手指，touchstart时只有一个触摸点，2个手指同时移动，会有2个触摸点Touch。当一个停下不动，只会留下正在移动的Touch 对象。全部离开touchend ，只会留下最后移动的触摸点(这个值一直会存在)。为最后一个离开屏幕的手指的接触点

touchend 触发后，touches和targetTouches中将不会再有值，changedTouches还保留最后一个离开屏幕的手指的接触点

用一个手指接触屏幕，触发事件， changedTouches 和 targetTouches，touches 有相同的值

Touch

pageX
pageY:鼠标在整个html页面y轴的位置
clientX:触点相对于可见视区上边缘的 Y 坐标不包括任何滚动偏移
clientY:鼠标在整个视口的位置（可视区域：可以看得见的页面区域,不包括任何滚动偏移
screenY:鼠标到浏览器最上端的距离,触点相对于屏幕上边缘的 Y 坐标。
screenX:触点相对于屏幕左边缘的 X 坐标。
force:用户对触摸平面的压力大小是一个从 0.0(没有压力) 到 1.0(最大压力) 的浮点数

target: 触摸的对象，触摸子元素,target 就是子元素

没有滚动条时 clientY=pageY，
有滚动条时：pageY=clientY+scrollTop(滚动的距离)

比较

offsetY:鼠标相对于触发事件的元素的位置
clientTop:元素顶部边框的宽度
offsetTop:元素到到浏览器最上端的距离

参考

https://www.cnblogs.com/mengff/p/6005516.htmltouches: 当前屏幕上所有触摸点的列表;targetTouches: 当前对象上所有触摸点的列表;changedTouches: 涉及当前(引发)事件的触摸点的列表通过一个例子来区分一下触摸事件中的这三个属性：1. 用一个手指接触屏幕，触发事件，此时这三个属性有相同的值。2. 用第二个手指接触屏幕，此时，touches有两个元素，每个手指触摸点为一个值。当两个手指触摸相同元素时，
targetTouches和touches的值相同，否则targetTouches 只有一个值。changedTouches此时只有一个值，
为第二个手指的触摸点，因为第二个手指是引发事件的原因3. 用两个手指同时接触屏幕，此时changedTouches有两个值，每一个手指的触摸点都有一个值4. 手指滑动时，三个值都会发生变化5. 一个手指离开屏幕，touches和targetTouches中对应的元素会同时移除，而changedTouches仍然会存在元素。6. 手指都离开屏幕之后，touches和targetTouches中将不会再有值，changedTouches还会有一个值，
此值为最后一个离开屏幕的手指的接触点。

TouchEvent相关推荐

Android系统--TouchEvent的处理流程
TouchEvent的处理流程就是TouchEvent在View树中的传递的过程: 这个过程分为2步: 第一步,ACTION_DOWN在View树中寻找处理TouchEvent的View; 第二步,剩 ...
Android TouchEvent 分发流程
消息分发知识基础动作序列的三个事件 TouchEvent 分三种事件:down.move.up. 其中move事件在一个操作中(这里说的一个操作就是用户与屏幕的交互,即由down到up的动作序列)可 ...
Android 利用源码调试详解TouchEvent 事件分发机制
1.如果有触摸事件,首先会调用到Activity 的dispatchTouchEvent 方法. public boolean dispatchTouchEvent(MotionEvent ev) { ...
Android -- TouchEvent的分发和截获方式
Android系统中的每个ViewGroup的子类都具有下面三个和TouchEvent处理密切相关的方法: public boolean dispatchTouchEvent(MotionEvent ...
QT：触摸屏支持手指触摸，增加touch事件touchevent，记录前后touch坐标并处理
QT:触摸屏支持手指触摸,增加touch事件touchevent,记录前后touch坐标并处理 1.手指触摸事件当做鼠标事件去响应的可行性 2.触摸事件touchEvent的添加 3.重写touch事 ...
触摸事件touchevent
触摸事件的历史: 2007年乔帮主神之手iphone的发布,使得便携设备进入了每个普通人的生活. 多年以后的一个秋天,也就是2013年的10月10日,touchevent被写入了w3c的提案中http ...
ios 滑动手势事件与cell touchevent事件_深入浅出~手势操作原理分析
序言在移动端开发中,手势操作非常常见,本篇文章主要讲解常见的 9 种手势操作原理,期间会穿插一些数学知识,将数学运用到实际问题中,数学部分可能会比较枯燥,但希望大家坚持读完,相信会收益良多. 点按: ...
android 触摸事件控制,Android笔记:触摸事件的分析与总结----TouchEvent处理机制
其他相关博文: Android中的事件类型分为按键事件和屏幕触摸事件.TouchEvent是屏幕触摸事件的基础事件,要深入了解屏幕触摸事件的处理机制,就必须掌握TouchEvent在整个触摸事件中的转 ...
鸿蒙TouchEvent已实现单击、连续、长按功能，安卓也可以模仿着原理实现（网上绝大多未实现不动长按），这个支持不动长按事件
原创文章引用请注明出处,文章问题持续优化中. 以下的例子是模仿抖音的刷视频的单击播放.暂停,长按弹出框,连续点击是点赞的效果.连续点击视频时候,视频处于播放或者暂停是不会击穿事件导致视频播放或者暂停的 ...

TouchEvent

TouchEvent

Touch

比较

TouchEvent相关推荐

最新文章

热门文章