uniapp图片设置双指放大缩小这个功能相对来说比较简单的

首先，点击触发图片浏览界面

在浏览界面去实现图片移动和放缩

图片设置双指放大缩小这个功能相对来说比较简单的，是用于官方文档的路径(组件->视图容器->movable-area)，movable-area可以做双指放大缩小，并且放大的同时可以左右移动图片(页面)，至于怎么做呢？

用HBuilder X编辑器创建个uni-app项目

html代码

<template>
<view>
<view class="uni-padding-wrap uni-common-mt">
<movable-area scale-area>
<movable-view direction="all" @scale="onScale" scale="true" scale-min="1" scale-max="4" :scale-value="scale">
<image src="图片路径" mode="widthFix"></image>
</movable-view>
</movable-area>
</view>
</view>
</template>```

需要说一下movable-view标签里的 scale-min=“1” scale-max="4"是干嘛用的，这两个设置相对来说也比较重要
scale-min 拿图片来说，如果 scale-min=“0.5” 的话那图片就会显示50%，不会完全100%显示，所以就让他初始化等于 1
scale-max 他的意思是双指放大可以放大几倍，比如 scale-max=“4” 那么双指放大4倍
movable-area是不需要写任何js代码的

onScale是空函数

css代码

```php
movable-view {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height:100%;
}
movable-area {
height: 100%;
width: 100%;
position:fixed;
overflow: hidden;
}
movable-view image{
width:100%;
}```