微信小程序新增的拖动组件movable
来源:诚信在线    发布时间:2017-07-04 14:26:05

  咱们用movable-area设定了一个200x200巨细的一个否拖动地区(赤色),而后正在这个区域内安排了一个巨细为50x50的能够拖动内容movable-view(蓝色),这个否拖动内容的direction配置为all,示意能够正在随便偏向上停止拖动。

  vertical - 纵向拖动

  你大概感兴趣的文章:微信小步伐 (十七)input 组件具体先容微信小步伐 倒计时组件完成代码微信小步伐 Image组件实例详解微信小顺序 Button 组件详解及简略实例

  总结

  正在一个movable-area标签外,实在不止能够搁一个movable-view,它撑持安排多个movable-view,望如下例子:

  好了,小步伐的拖动组件的功用大体便如许简略的先容一下,但愿本文的内容对于大师的进修大概事情能带来肯定的匡助,若是有疑难大师能够留言交换,感谢大师对于剧本之野的撑持。

  拖动演示二

  

  拖动演示

  界面二

  horizontal - 横向拖动

  none - 不克不及拖动

  前三个值好了解。假如direction配置为最初这个none,则只能寄托配置x,y属性值去为它举行正在movable-area中的定位:

  此次的更新外,也新增了一个UI组件,它便是视图组件movable-view,它需求共同movable-area去一路应用。容易来讲,它便是一个撑持正在指定区域内能够拖动内容的容器。

  那段代码1运转,蓝色的movable-view便显现正在了(50,50)的地位上了:

  咱们来看一个简朴的示例:

  小顺序正在520节日前夕,让程序员们又躁动了一把,更新了一些很迷人的功效,如内容转发API,iBeacon API,振动API,屏幕亮度调理API等,也加强了舆图组件的功效。

  界面

  all - 随意率性标的目的拖动

  

  媒介

  

  

  

  movable-view的direction属性撑持下列四个值:


诚信在线 除注明原创以外,其余均来自互联网以及微信朋友圈,如有侵权请联系站长立即删除!
文章地址:http://www.my517517.com/YY/20170704429.html



上一篇:Bootstrap每天必学之日期控制 下一篇:ASPNET中图片显示方法实例