触控与多点触控测试
用手指在下面的区域里划一划,看看每个触点是不是都被认出来了,顺便扫一遍有没有没反应的区域。
- 桌面浏览器看不到完整的触控。这是最容易被误会的一点。很多触屏笔记本在 Windows 和 macOS 上,只会把最高几个触点交给网页,甚至只给 1 个。这跟硬件能力关系不大,是操作系统和浏览器的事件模型决定的。所以「桌面浏览器只测出 2 个触点」不代表屏幕只能识别两个手指,要验证多点触控请在手机上打开这个页面。
- 浏览器的默认手势会抢走触摸。双指缩放、单指下拉刷新、左右滑返回上一页、长按选中文字或弹出菜单,这些都被浏览器和系统提前占用了。测试页会尽力拦掉一部分,但拦不干净。所以双指以上、边缘滑动这些操作有可能会触发页面缩放或者跳走,属于正常现象。
触控区域
浅色方格是被碰过的位置。想查死区就用一根手指在整块区域里慢慢扫一遍,尽量横向和纵向都走到;扫完之后如果还有成片的方格没亮,那一片就有问题。零星几个空格通常只是没扫到。
还有 1 个格子没被碰过(占 100%)。如果这些空格子集中在某一块,说明那一片触控有问题;如果只是零星散着,多半是手指没扫到,重新扫一遍更仔细些。
还有几点要知道
「没反应」可能是系统在占用边缘。手机屏幕四周靠边的十几像素往往留给了系统手势和曲面误触抑制,那一条本来就不该响应普通触摸。所以覆盖测试里边缘一圈留空是正常的,判断死区要看屏幕中间有没有成片的空洞。
压力数值大多是个固定值。网页里的 pressure 字段几乎总是 0.5 或 1 这种常数。真压感需要屏幕硬件支持,而且浏览器还要愿意把它透出来,两者缺一不可。这个工具只是把原样数值显示出来,让你看到它到底变不变。
画线顺不顺还受刷新率影响。手指画出来的线是否圆滑,取决于屏幕的触控采样率和刷新率,两者都高的设备线条才跟手。60Hz 屏幕上快速画圈会明显看到折线,这是采样不足,不代表屏幕坏。
触控测试该怎么用,以及那些反直觉的地方
「桌面浏览器只测出两个触点」通常是正常的。这是最容易引起误会的一点。很多触屏笔记本在 Windows 和 macOS 上,操作系统只把最高几个触点交给浏览器,甚至只给一个。这跟屏幕硬件的触控能力关系不大,是系统的事件模型和浏览器的处理方式共同决定的。所以如果你在笔记本上看到「最大触点数 2」,先别怀疑屏幕坏了——把页面在手机上打开再测一次,才是验证多点触控的正确做法。
覆盖网格查的是「有没有完全不响的区域」。把触点位置映射到一张细网格上、把碰过的格子点亮,是发现死区最直观的办法。判断的时候要注意两点:一是边缘一圈留空是正常的,手机屏幕靠边的十几像素往往留给了系统手势和防误触,本来就不该响应普通触摸;二是要配合扫动方向——横着扫只能盖住横条,想覆盖整块区域得横竖都走一遍,斜着扫效率更高。真正需要警惕的是屏幕中间出现成片的空白。
拖动连续性会受浏览器任务调度影响。手指贴着屏幕连续划,事件本该连绵不断,但网页里跑着别的任务时,浏览器可能把一段时间内的事件延后处理,表现出来就是一个明显的空档。所以「疑似断点」只能作为线索,要和覆盖网格一起看:如果断点位置恰好落在某片空白格上,那更可能是触控问题;如果断点散布在各处、位置每次都不一样,那多半是浏览器的调度抖动。
压力数值几乎总是常数。网页里的 pressure 字段大多数情况下是 0.5 或者 1 这种固定值,因为绝大多数手机屏幕和笔记本触屏根本没有压感硬件,浏览器只是照规范填了个占位值。只有带压感笔的设备,或者少数做了力度识别的屏幕,才会给出随力度变化的真实数值。所以这个工具的判断标准是「数值有没有随力度变化」,而不是「有没有这个字段」——看到它一直不变,属于正常现象。
浏览器的默认手势会抢先一步。双指缩放、单指下拉刷新、左右边缘滑动返回上一页、长按选中文字或者弹出菜单,这些都被浏览器和系统提前占用了。页面虽然设了 touch-action 去拦住一部分,但拦不干净——尤其是双指以上和从屏幕边缘起手的滑动,有可能会触发页面缩放或者跳转。做这些动作时请有心理准备,跳走了返回上一页即可。