微信小程序 — 图片实现缩放,拖拽功能
微信小程序 — 图片实现缩放,拖拽功能
·
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:图片从网上下载。如有侵权,请联系删除!
更多推荐
已为社区贡献5条内容
所有评论(0)