小程序模板网

Demo分析学习《三》破车:音乐播放,循环,上首/下首,菜单

2018-04-18 没咒念

制作者:天下钞票

demo地址:微信小程序demo:破车:音乐播放,循环,上首/下首,菜单

一个很不错的音乐播放demo

亮点一、使用swiper组件,制作了一个顶部的tabBar,效果很不错,可以左右滑动切换整个页面,之前一直没想到swiper组件可以滑动整个页面。。唯一感觉不足,页面切换的时候标题头下的横线没有动画移动效果,下面平滑移动,上面瞬间切换,视觉效果有点突兀,有兴趣的同学可以利用css动画使下划线跟随页面相应移动,跟帖发出来有奖励哦。^_^

亮点二、页面之间的参数传递方式,使用的代码如下:

 

  1. itemClick: function(event) {
  2. var p = event.currentTarget.id
  3. var that = this
  4. var pages = getCurrentPages()
  5.  
  6. if(pages.length > 1) {
  7. //上一个页面实例对象
  8. var [color=Red]prePage = pages[pages.length - 2][/color]
  9. prePage.changeData(this.data.tracks, p, 1)
  10. wx.navigateBack({
  11. url: '../home/index?currentTab=1'
  12. })
  13. }
  14.  
  15. }

这个方法你知道吗?

亮点三、还有一些播放窗口的细节,比如样式控制的背景模糊、图像旋转动画、音乐播放的控制等等,不再一一说明,有兴趣的可以自己查找代码分析。  另外:学姐有篇后台音乐播放注意事项,做音乐播放的可以参考一下。http://www.wxapp-union.com/portal.php?mod=view&aid=2111

总体上,适合新手学习demo,也适合想做播放器的同学熟悉各种api。


易优小程序(企业版)+灵活api+前后代码开源 码云仓库:starfork
本文地址:https://www.eyoucms.com/wxmini/doc/course/23603.html 复制链接 如需定制请联系易优客服咨询:800182392 点击咨询
QQ在线咨询