小程序
小游戏
企业微信
微信支付
扫描小程序码分享
最后的this.setData的marginTop和marginLeft为控制图片的拖动。我看过官方的文档说不要频繁使用setData。但是不使用setData不知道如何实时的渲染到页面上啊
7 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
我做完了 发现卡的要死，唉 感觉一下午的努力白费了， 真的离谱
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
catch:touchmove 直接用就行，现在流畅多了 直接setData值就可以了
1、用 movable-view （不推荐，有些现成的效果但不灵活局限太大（没有旋转），而且不能监听拖动结束事件，，所以还是要不停的setData没有解决根本问题）
2、wxs （推荐 将部分逻辑放在渲染层执行）https://developers.weixin.qq.com/miniprogram/dev/framework/view/interactive-animation.html
3、关键帧动画（非常推荐 我感觉比第2种方法简单而且效果也更好,可以直接在逻辑层就直接修改渲染层的样式效果比setData好太多了,拖动结束要将最终值setData回去）
https://developers.weixin.qq.com/miniprogram/dev/framework/view/animation.html
this.animate('#container', [ { left: 20 + 'px', top: 20 + 'px' }, ], 0, )
4、webview （不推荐 更极端的你可以在webview做那就是传统网页，根本没有通信非常流畅，比上面的都快）
可以参考一下我总结的文章：
https://juejin.im/post/5cd18bb86fb9a0325031c8e1
楼主你好，请问你搞这个问题搞定没有，我开发中也遇见了拖拽缩放旋转图片的需求，在找解决方案
可以参考一下：
列表中怎么设置动画 每个向下移动的位置不一样
移动结束后，得讲最后移动的位置设置初始值
列表中的图片，每张图片都向下移动一点 这个怎么设置 而且要看不见才能设置初始值
也刚做过，不建议用movable-view组件，坑实在太多，你可以把moveX和moveY放到一个数组里，最后再统一setData
其实这样也会很卡，只能降低点卡顿。不是根本的办法。毕竟一拖动还是几毫秒的触发一次setData
目前体验可以吧，同求更好的优化方法
这样来setData 确实会被卡得不要不要的，给你两个方案：
1、用 movable-view （推荐）
2、用动画来设置当前位置，timingFunction设置为 step-end （不推荐）
我试过用transform：translate然而也是很卡
我之前也想过用movable-view ，不过不支持放大还有旋转啊
用wx.createAnimation的动画，他export的时候会清理掉上次的动画，所以不会一卡一卡的
movable-view 有 scale属性啊，旋转倒是不可以
有demo看看吗谢谢了
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
我做完了 发现卡的要死，唉 感觉一下午的努力白费了， 真的离谱
catch:touchmove 直接用就行，现在流畅多了 直接setData值就可以了
1、用 movable-view （不推荐，有些现成的效果但不灵活局限太大（没有旋转），而且不能监听拖动结束事件，，所以还是要不停的setData没有解决根本问题）
2、wxs （推荐 将部分逻辑放在渲染层执行）https://developers.weixin.qq.com/miniprogram/dev/framework/view/interactive-animation.html
3、关键帧动画（非常推荐 我感觉比第2种方法简单而且效果也更好,可以直接在逻辑层就直接修改渲染层的样式效果比setData好太多了,拖动结束要将最终值setData回去）
https://developers.weixin.qq.com/miniprogram/dev/framework/view/animation.html
this.animate('#container', [ { left: 20 + 'px', top: 20 + 'px' }, ], 0, )4、webview （不推荐 更极端的你可以在webview做那就是传统网页，根本没有通信非常流畅，比上面的都快）
可以参考一下我总结的文章：
https://juejin.im/post/5cd18bb86fb9a0325031c8e1
楼主你好，请问你搞这个问题搞定没有，我开发中也遇见了拖拽缩放旋转图片的需求，在找解决方案
可以参考一下：
https://juejin.im/post/5cd18bb86fb9a0325031c8e1
列表中怎么设置动画 每个向下移动的位置不一样
移动结束后，得讲最后移动的位置设置初始值
列表中的图片，每张图片都向下移动一点 这个怎么设置 而且要看不见才能设置初始值
也刚做过，不建议用movable-view组件，坑实在太多，你可以把moveX和moveY放到一个数组里，最后再统一setData
其实这样也会很卡，只能降低点卡顿。不是根本的办法。毕竟一拖动还是几毫秒的触发一次setData
目前体验可以吧，同求更好的优化方法
这样来setData 确实会被卡得不要不要的，给你两个方案：
1、用 movable-view （推荐）
2、用动画来设置当前位置，timingFunction设置为 step-end （不推荐）
我试过用transform：translate然而也是很卡
我之前也想过用movable-view ，不过不支持放大还有旋转啊
用wx.createAnimation的动画，他export的时候会清理掉上次的动画，所以不会一卡一卡的
movable-view 有 scale属性啊，旋转倒是不可以
有demo看看吗谢谢了