大家好，我是林译川，今天我们来聊聊uni-app中一个实用但有点 tricky 的功能——图片手势缩放。你是否想过，如何像微信图片查看器一样，实现指尖滑动即可放大缩小图片呢？今天，我就来带你一步步实现这个功能。
关键知识点：
- 使用
touches而非changedTouches判断双指触控 - 缩放锚点应为两指中心
- 使用复合
transform实现缩放 - 小程序需使用
catchtouchmove和enhanced模式优化频率 - 双击放大基于
tap事件，并动态计算最大缩放倍数
实操步骤详解
1. 监听 touchstart 和 touchmove 事件，但所有距离/角度计算基于 event.touches。
2. 在 touchstart 阶段检查 event.touches.length === 2，满足条件才启用缩放状态，避免单指误触发。
3. H5 平台下部分安卓 WebView 对 touches 更新有延迟，建议加一层防抖：两次 touchmove 间隔小于 16ms 才计算，否则跳过。
4. 使用 transform: scale() 缩放图片，但要注意缩放后定位偏移问题。微信查看器是以两指中心为缩放锚点的，所以我们需要同步计算两指中心点 centerX/centerY，并用复合 transform 实现锚点缩放。
5. 注意，不要使用 transform-origin 动态改，因为 uni-app 的 view 或 image 在某些小程序平台不支持该 CSS 属性动态生效。
6. 缩放后立刻调用 uni.createSelectorQuery() 获取缩放后真实尺寸，用于后续边界检测。
7. 如果在微信小程序平台（微信/支付宝）里，发现 touchmove 频率太低导致缩放卡顿，可以考虑升级微信小程序基础库到 2.20+，因为 touchmove 默认被节流，iOS 尤其明显。
小结与拓展
通过以上步骤，我们就可以在 uni-app 中实现图片手势缩放功能，让用户体验更加流畅。当然，这只是一个基础实现，你还可以根据需求进行扩展，比如添加图片预加载、缓存机制等。
我是林译川，如果你对编程思维和技术有更多的疑问，欢迎关注「新派编程网」（www.xjpbg.com），我们下期再见！