歌曲来源:QQ音乐说明因为个人开发者无法发布在线音乐播放小程序,所以开发该小程序目的只为学习小程序开发;小程序涉及到到所有歌曲资源都来源于QQ音乐,部分API由本人对QQ音乐接口进行了二次封装(我会另外再写一篇文章专门用来分享API,敬请期待)编辑器效果展示因为要压缩为GIF格式,所以加快了播放速度并且画质有点差真机截图推荐页面歌手列表各大排行榜搜索页面歌手详情页歌单(排行榜)详情页播放器页面分享页面目前实现的功能歌单电台歌曲播放MV播放(最近发现QQ音乐的接口不返回MV数据了,所以这个功能暂时无法展示)歌手列表排行榜歌曲歌手搜索(支持模糊查询)最近搜索记录热门搜索词条歌手详情页歌单详情页歌曲分享查看评论歌词滚动最近播放歌曲接下来准备实现的功能用户登录私人FM增加点赞,评论功能歌曲播放方式(随机,单曲,循环)收藏全局播放器组件项目目录comment–自定义组件(播放器组件,开发中)img–存放图片gedan–歌单页index–首页logs–歌手列表页playSong–播放器页rank–排行榜页search–搜索页share–分享页singer–歌手详情页top–歌单详情页app.js–应用程序逻辑app.json–应用程序配置app.wxss–应用程序公共样式app.json应用程序配置文件{ “pages”: [ “pages/index/index”, “pages/logs/logs”, “pages/rank/rank”, “pages/search/search”, “pages/gedan/gedan”, “pages/playSong/playSong”, “pages/singer/singer”, “pages/top/top”, “pages/share/share” ],//页面路径列表 “requiredBackgroundModes”: [ “audio” ],//需要在后台使用的能力,这里我们使用到了【音乐播放】 “window”: { “backgroundTextStyle”: “light”, “navigationBarBackgroundColor”: “#fff”, “navigationBarTitleText”: “HMusic”, “navigationBarTextStyle”: “black” },//全局到默认窗口表现 “tabBar”: { “list”: [ { “pagePath”: “pages/index/index”, “text”: “推荐” }, { “pagePath”: “pages/logs/logs”, “text”: “歌手” }, { “pagePath”: “pages/rank/rank”, “text”: “排行榜” }, { “pagePath”: “pages/playSong/playSong”, “text”: “播放器” } ], “position”: “top” }//tab栏到表现,默认是放在底部,根据position,我们将其设置为顶部显示}每个页面都有各自到配置页面,可以对各自页面进行单独对配置[pageName].json用于指定页面工作时,window的设置:{ // 导航条背景色 “navigationBarBackgroundColor”: “#fff”, // 导航条前景色(只能是white/black) “navigationBarTextStyle”: “black”, // 导航条文本 “navigationBarTitleText”: “HMusic”, // 窗口背景颜色 “backgroundColor”: “#fff”, // 窗口前景色 “backgroundTextStyle”: “dark”, // 是否开启下拉刷新 “enablePullDownRefresh”: false}app.js应用程序逻辑// App函数是一个全局函数,用于创建应用程序对象App({ // ========== 全局数据对象(可以整个应用程序共享) ========== globalData: { … }, // ========== 应用程序全局方法 ========== method1 (p1, p2) { … }, method2 (p1, p2) { … }, // ========== 生命周期方法 ========== // 应用程序启动时触发一次 onLaunch () { … }, // 当应用程序进入前台显示状态时触发 onShow () { … }, // 当应用程序进入后台状态时触发 onHide () { … }})欢迎StarGitHub 博客