小程序图片可以由用户调节大小

在小程序中，你可以使用`<movable-view>`组件来实现图片大小可调节的效果。`<movable-view>`是一个可移动的视图容器，可以用于实现拖拽、缩放等交互操作。

以下是一个示例代码，展示如何使用`<movable-view>`来实现可调节大小的图片：

<view class="container">
  <movable-view
    class="resizable-image"
    direction="all"
    scale="true"
    bindchange="onChangeSize"
  >
    <image class="image" src="your-image-src"></image>
  </movable-view>
</view>

.container {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.resizable-image {
  width: 200px;
  height: 200px;
}

.image {
  width: 100%;
  height: 100%;
}

在上述代码中，我们将`<movable-view>`作为图片的父容器，并将`direction`属性设置为"all"，使其可在水平和垂直方向上移动。同时，将`scale`属性设置为"true"，使其可以缩放。

在`<movable-view>`中，我们嵌套了一个`<image>`标签，用于显示图片。通过设置`.resizable-image`类的宽度和高度，可以控制初始的图片大小。你可以根据需要自行调整。

在JavaScript中，你可以监听`bindchange`事件来获取用户调整大小后的图片尺寸，例如：

Page({
  onChangeSize: function (e) {
    console.log('Image size changed:', e.detail.width, e.detail.height);
  }
});

通过监听`bindchange`事件，你可以在用户调整大小后执行相应的逻辑。

请注意，使用`<movable-view>`来实现可调节大小的图片需要一些额外的处理，如限制最小和最大尺寸、适应屏幕等。以上代码只是一个基本示例，你可以根据实际需求进行进一步的定制和优化。