movable-area双指缩放仅微信小程序原生支持，H5/App端需手写实现；须用touches而非changedTouches计算两指中心锚点并配合transform实现精准缩放。
uni-app里用movable-area实现双指缩放最省事但有硬伤
直接套用官方movable-area + movable-view能快速支持双指缩放，但仅限微信小程序，H5 和 App 端不支持 scale 属性，会直接失效。这不是配置问题，是平台能力缺失。
实操建议：
- 只在
mp-weixin平台启用该方案，其他端必须降级或手写 -
movable-view必须加scale和scale-area属性，缺一不可 -
scale-min和scale-max要设合理值（如0.8～3），否则缩到 0.1 倍会导致图片不可见、拖拽错乱 - 别把
image直接塞进movable-view内部再设width: 100%——缩放后宽高计算失真，应让movable-view自身撑满容器，image用mode="aspectFit"或固定宽高
双指缩放必须用 touches 而不是 changedTouches
很多同学监听 touchmove 后发现两指距离算不准、缩放跳变，根源是误用了 event.changedTouches。它只返回本次移动变化的手指，而双指缩放需要实时跟踪当前屏幕上的全部手指位置。
正确做法：
- 在
touchstart阶段就检查event.touches.length === 2，满足才进入缩放状态 - 所有距离/中心点计算一律基于
event.touches数组，取[0]和[1]的clientX/clientY - 缩放锚点必须是两指中心：
centerX = (t0.clientX + t1.clientX) / 2，再配合transform: translate(-cx, -cy) scale(s) translate(cx, cy)实现“指哪打哪” - H5 端安卓 WebView 可能有 touches 更新延迟，加个简单防抖：两次
touchmove间隔
微信小程序 touchmove 频率低导致缩放卡顿怎么破
基础库 2.20+ 后，微信小程序默认节流 touchmove，iOS 上尤其明显，事件间隔可能达 60ms，手势一卡一卡的。
关键解法：
- 容器元素必须加
catchtouchmove（不是bindtouchmove），否则事件冒泡中断后续响应 - 在
pages.json对应页面配置中加入"touchMove": true开启 enhanced 模式（仅微信有效） - 缩放逻辑别依赖绝对位移，改用与上一次
touchmove的相对变化量累加：deltaScale = currentDistance / lastDistance，再乘到当前scale上 - 每次缩放后立刻调用
uni.createSelectorQuery()获取真实渲染尺寸，用于后续边界限制，避免缩出可视区后拖拽失控
双击放大和双指缩放共存时容易踩的坑
双击判定不能只看时间差，否则快速滑动会被误认为双击；缩放后拖拽起点没重置，会导致下一次拖拽“跳一下”；还有更隐蔽的：双击还原时若没同步清空 transform-origin，缩放中心会偏移。
避坑要点：
- 双击判定必须同时满足：
timeDiff 且 <code>distance （两次点击坐标差） - 双击触发时，先记录点击位置
clientX/clientY，再通过getBoundingClientRect()换算成图片内坐标，作为transform-origin值 - 每次缩放（无论双指还是双击）后，必须重置拖拽起点
startX/startY，否则touchmove中的位移计算会叠加错误偏移 - 缩放倍数要动态限制最大值（建议 ≤3），不同设备屏幕密度差异大，硬写死
scale-max="4"在小屏上极易内存溢出或渲染卡死
