movable-view 可移动的视图容器,在页面中可以拖拽滑动。

movable-view必须在 movable-area 组件中,并且必须是直接子节点,否则不能移动。

如果想让图片实现缩放,拖拽效果。则可以把图片放到movable-view容器里面movable-view 可移动的视图容器,在页面中可以拖拽滑动。

效果如下:

movable-view可移动的视图容器

代码如下,布局文件代码: sacle-value 定义缩放倍数

<view style="display: flex;margin-top: 10rpx;">
  <movable-area scale-area>
    <movable-view direction="all"  scale scale-min="0.5" scale-max="4" scale-value="1">
      <image src="/images/test.jpg" mode='widthFix' style="width:750rpx;height: 500rpx"></image>
    </movable-view>
  </movable-area>
</view>

ps:图片从网上下载。如有侵权,请联系删除!

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐