评论

滑块拖动排序 【恋爱小清单开发总结】

滑块拖动排序示例

分享一下滑块拖动排序的案例,其实主要的关键点在于判断当前长按的坐标点跟滑块中心的位置关系,这次直接分享代码片段了。有兴趣的有小伙伴可以打开瞧一瞧。

https://developers.weixin.qq.com/s/qKcgIVmL7Qj7

也可以打开恋爱小清单小程序 -> 我-> 纪念日

页面效果图:

最后一次编辑于  2021-09-09  
点赞 2
收藏
评论

2 个评论

  • 阿旺
    阿旺
    2020-09-22

    不错,不过感觉touchmove的事件不断的去和逻辑层通信来移动拖动的view会比较容易阻塞渲染线程,我记得官方有一个wxs的脚本机制,而且提供了布局的api,同时还支持和逻辑层通讯,看过你的代码后,个人感觉可以在拖动的view中单独通过wxs去处理他需要transform的X和Y(只是在webview层去改变位置),当拖动的位置达到交换点条件的时候,再通过wxs提供的和逻辑层交互的api 去触发其他滑块的交互设置,这样就不会在前期拖动的过程中不断的通过逻辑层的setData去改变拖动块的位置,性能应该会有提升。我是因为最近也有个拖动块的需求正好看到此分享,个人愚见。


    附注wxs机制链接:https://developers.weixin.qq.com/miniprogram/dev/framework/view/interactive-animation.html

    2020-09-22
    赞同
    回复 2
    • showms
      showms
      2020-09-22
      确实可以这样,我在小清单里面的自由裁剪就是用wxs去做计算。会比js流畅
      2020-09-22
      回复
    • bibolibo
      bibolibo
      2021-06-28
      请问有demo吗?希望可以借鉴下.谢谢
      2021-06-28
      回复
  • admin
    admin
    2020-08-27

    已阅

    2020-08-27
    赞同
    回复
登录 后发表内容