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

制作者：天下钞票

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. }

这个方法你知道吗？

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

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