收藏
评论

微信朋友圈选图效果

中秋快乐,帮社区里的小伙伴写的选图效果,仿造的微信朋友圈选图,长按拖动排序主要是用交互监听来实现的。还有几个需要处理的地方。另外在真机上的动画速度总感觉快那么一丢丢。没做预览图,详情见代码片段咯。安卓机效果没试过。。

今天是9月23,这两天接受定制改动~

第一次发经验分享。。轻点喷。。

哦,对了,这里 wx.createSelectorQuery 有个bug。。如果选择的基础库版本在2.0.9以上,第一次打开开发者工具,要先直接点一次编译,不然会出错。。真机上没问题


代码片段:wechatide://minicode/RFLmzDmL7I2a


有小伙伴反馈,在片段上面增加内容会乱位,是因为没计算顶部偏移量,方便懒人,完善了下

新的片段:wechatide://minicode/fOTEM3mI7l3B


终于拿到安卓机器试了,果然卡得很。。要控制频率。这很尴尬,太频繁的话,安卓会卡,太不频繁呢,刚开始移动那阵子会卡。。有同学反馈,说点快了会出问题,于是又加了点击频率的限制

现在的代码片段:wechatide://minicode/xBDdCom17R3c(要重新拿安卓机测试了再看看。。)


附上gif:


最后一次编辑于  2018-10-24
收藏

24 个评论

  • 2018-12-07

    牛逼。小程序iOS和安卓下的性能差距真的是很明显。强烈建议官方增加一个原生组件

    2018-12-07
    赞同
    回复 4
    • 卢霄霄
      卢霄霄
      2018-12-07

      从此转果粉。。

      2018-12-07
      回复
    • 2018-12-07回复卢霄霄

      真的测试起来 安卓机各种问题

      2018-12-07
      回复
    • 卢霄霄
      卢霄霄
      2018-12-07回复

      if(安卓机) return

      2018-12-07
      回复
    • 2018-12-07回复卢霄霄

      hhh

      2018-12-07
      回复
  • hooks
    hooks
    2018-11-28

    可以可以  我用在了项目里面

    2018-11-28
    赞同
    回复 2
    • 卢霄霄
      卢霄霄
      2018-11-28

      建议尽量在单页里用,页面宽高超过屏幕宽高之后,动画性能会极其显著的下降

      2018-11-28
      回复
    • hooks
      hooks
      2018-11-28

      我试了一下很难在组件里引用,我现在是使用方法是 单页里 图片上传加表单

      2018-11-28
      回复
  • Efforts
    Efforts
    2018-11-05

    我跑这里来了。会云开发吗,求分享经验,感觉以后会流行毕竟降低成本。

    2018-11-05
    赞同
    回复 1
    • 卢霄霄
      卢霄霄
      2018-11-05

      ……额。。demo都还没跑完。。我自己的小程序下一个阶段可能也要走云开发,到时候再去看。。现阶段云开发经常出问题呢,官方每周一道歉。。等稳定点了来

      2018-11-05
      回复
  • Wayne
    Wayne
    2018-10-20

    很厉害,原本打算用movable-view去做,然而效果不是很好。


    这边在PC稍微测试了一下,看到了2个问题:

    1. 偶尔出现 Cannot read property '0' of undefined或者Cannot read property 'opacity' of undefined

    2. 拖动稍快一点图片会消失


    另外安卓机没有测试,会卡顿是因为动画还是频繁setData?😀

    2018-10-20
    赞同
    回复 8
    • 卢霄霄
      卢霄霄
      2018-10-20

      谢谢测试~你测的哪个片段呢?相交状态的触发,模拟器上效果不如真机。

      安卓上动画设置频繁会卡顿,我好像最后设的80来着。。在小米6和最新的华为上看着基本和iOS无异

      2018-10-20
      回复
    • 卢霄霄
      卢霄霄
      2018-10-20

      消失的问题,可能是我没加touchcancel,在模拟器上会出现移出手机屏幕范围的问题

      2018-10-20
      回复
    • Wayne
      Wayne
      2018-10-20回复卢霄霄

      测试的是这一个:wechatide://minicode/aGBZrhmL7E3M


      iOS版本:12.0.1

      微信版本:6.7.3

      小程序基础库:2.3.0


      iOS上看到的是 undefined is not an object(evaluating 'r[0]') 或者 undefined is not an object(evaluating 'i[this.selected].opacity'),和PC应该是同样的错误。




      2018-10-20
      回复
    • 卢霄霄
      卢霄霄
      2018-10-20回复Wayne

      好的 我知道啦~ 谢谢~

      2018-10-20
      回复
    • 卢霄霄
      卢霄霄
      2018-10-20回复Wayne

      晚上改了重发个片段~

      2018-10-20
      回复
    查看更多(3)
  • 2018-10-19

    学到了学到了。

    2018-10-19
    赞同
    回复 5
    • 卢霄霄
      卢霄霄
      2018-10-19

      咦。。。从我主页进来的吗?

      2018-10-19
      回复
    • 2018-10-19

      并不是的,是搜索拖动排序然后看到你说你做了一个就点进来啦

      2018-10-19
      回复
    • 卢霄霄
      卢霄霄
      2018-10-19回复

      今天拿到安卓测试机了,发现安卓机上有性能问题,需要优化下。。如果你要用的话,最好下周一再来

      2018-10-19
      回复
    • 2018-10-19

      好的,谢谢。不过知道思路啦,自己先尝试着开发一下

      2018-10-19
      回复
    • 卢霄霄
      卢霄霄
      2018-10-19回复

      安卓上要注意控制频率。。在联发科的机器上。。根本卡的不行了。。我试了下,频率大概在100ms比较合适~ 祝好运

      2018-10-19
      回复
  • 李智
    李智
    2018-10-15

    才发现朋友圈的选图居然还可以移动。。。

    2018-10-15
    赞同
    回复 1
    • 卢霄霄
      卢霄霄
      2018-10-15

      怪我咯。。

      2018-10-15
      回复
  • 2018-10-12

    感觉以后遇到问题直接@霄神就好了  哈哈哈哈

    2018-10-12
    赞同
    回复 1
    • 卢霄霄
      卢霄霄
      2018-10-12

      不听不听 王八念经

      2018-10-12
      回复
  • 2018-10-10

    大佬,想请问一些问题,小程序可以主动推送消息吗?我目前需求是想把报警信息进行推送给用户。就是检测到有报警就推送给用户,

    2018-10-10
    赞同
    回复 14
    • 卢霄霄
      卢霄霄
      2018-10-10

      是推给他的微信吗?可以用模板消息。请参考下面的文档

      https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/template-message.html

      2018-10-10
      回复
    • 2018-10-10回复卢霄霄

      用户没有进行表单提交操作,他可能登入小程序没有报警,退出后有报警了,我想推送给他。

      2018-10-10
      回复
    • 2018-10-10

      我想做的就是 只要检测到报警信息,我就推送给他,在过一两个小时,如果还有报警信息或者推送了他没有处理,我就继续推送。

      2018-10-10
      回复
    • 卢霄霄
      卢霄霄
      2018-10-10回复

      用户在你的小程序里总有点击的地方吧。。比如你本来是写的

      <view bindtap="func">啦啦</view>

      你要改成

      <form bindsubmit="submitFn">

          <button form-type="submit" bindtap="func">啦啦</button>

      </form>

      submitFn里会有个formid,你要在后端存起来

      2018-10-10
      回复
    • 2018-10-10

      那我可以在他登录成功的时候把这个formid存起来。 另外我想知道这个模板消息限制是多少条,最短发送时间间隔多少。而且 一个formid 可以 多次推送吗。这个推送次数我也不确定。不知道啥时候有报警消息。

      2018-10-10
      回复
    查看更多(9)
  • 2018-10-09

    厉害了,并且哪都能看到你

    2018-10-09
    赞同
    回复 5
    • 卢霄霄
      卢霄霄
      2018-10-09

      别眨眼 我马上回来

      2018-10-09
      回复
    • 卢霄霄
      卢霄霄
      2018-10-09

      你头像。是未来吗?好模糊呀

      2018-10-09
      回复
    • 2018-10-09回复卢霄霄

      不是哇 没有眼镜

      2018-10-09
      回复
    • 卢霄霄
      卢霄霄
      2018-10-09回复

      眼镜属性是必须的吗。。原来如此

      2018-10-09
      回复
    • 2018-10-09回复卢霄霄

      眼镜娘嘛

      2018-10-09
      回复
  • 尚
    2018-09-30

    老大,666..

    2018-09-30
    赞同
    回复 1
    • 卢霄霄
      卢霄霄
      2018-10-01

      国庆节快乐

      2018-10-01
      回复

正在加载...

登录 后发表内容