258资源分享网

制作者：天下钞票

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

一个很不错的音乐播放demo

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

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

itemClick: function(event) {

var p = event.currentTarget.id

var that = this

var pages = getCurrentPages()

if(pages.length > 1) {

//上一个页面实例对象

var [color=Red]prePage = pages[pages.length - 2][/color]

prePage.changeData(this.data.tracks, p, 1)

wx.navigateBack({

url: '../home/index?currentTab=1'

})

}

}

这个方法你知道吗？

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

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