1、app.js
App({
globalData: {
g_isPlayingMusic:
false,
g_currentMusicPostId:
null
}
})
2、post-detail.js
var app=getApp();
var globalData = app.globalData;
//获取
var inTheatersUrl = app.globalData.doubanBase +
"/v2/movie/in_theaters"+
"?start=0&count=3";
App({ /** * 当小程序初始化完成时,会触发 onLaunch(全局只触发一次) */ onLaunch: function () { }, /** * 当小程序启动,或从后台进入前台显示,会触发 onShow */ onShow: function (options) { }, /** * 当小程序从前台进入后台,会触发 onHide */ onHide: function () { }, /** * 当小程序发生脚本错误,或者 api 调用失败时,会触发 onError 并带上错误信息 */ onError: function (msg) { } })
音乐播放
var postsData = require('../../../data/posts-data.js'); var app=getApp(); Page({ data: { isPlayingMusic: false }, onLoad: function (option) { var globalData = app.globalData; var postId=option.id this.data.currentPostId = postId; var postData = postsData.postList[postId]; this.setData({ postData: postData }); var postsCollected = wx.getStorageSync('posts_collected') if (postsCollected) { var postCollected = postsCollected[postId] this.setData({ collected: postCollected }) } else { var postsCollected = {}; postsCollected[postId] = false; wx.setStorageSync('posts_collected', postsCollected); } if (app.globalData.g_isPlayingMusic && app.globalData.g_currentMusicPostId === postId) { //判断是否播放 并且播放的id和当前文章相等 如果相当则显示播放按钮 如果不等 则显示没播放按钮 this.setData({ isPlayingMusic: true }) } this.setMusicMonitor(); }, setMusicMonitor: function () { //点击播放图标和总控开关都会触发这个函数 var that = this; wx.onBackgroundAudioPlay(function (event) { var pages = getCurrentPages(); var currentPage = pages[pages.length - 1]; if (currentPage.data.currentPostId === that.data.currentPostId) { // 打开多个post-detail页面后,每个页面不会关闭,只会隐藏。通过页面栈拿到到 // 当前页面的postid,只处理当前页面的音乐播放。 if (app.globalData.g_currentMusicPostId == that.data.currentPostId) { // 播放当前页面音乐才改变图标 that.setData({ isPlayingMusic: true }) } // if(app.globalData.g_currentMusicPostId == that.data.currentPostId ) // app.globalData.g_currentMusicPostId = that.data.currentPostId; } app.globalData.g_isPlayingMusic = true; }); wx.onBackgroundAudioPause(function () { var pages = getCurrentPages(); var currentPage = pages[pages.length - 1]; if (currentPage.data.currentPostId === that.data.currentPostId) { if (app.globalData.g_currentMusicPostId == that.data.currentPostId) { that.setData({ isPlayingMusic: false }) } } app.globalData.g_isPlayingMusic = false; // app.globalData.g_currentMusicPostId = null; }); wx.onBackgroundAudioStop(function () { that.setData({ isPlayingMusic: false }) app.globalData.g_isPlayingMusic = false; // app.globalData.g_currentMusicPostId = null; }); }, onCollectiontap:function(event){ //首先获取缓存是否存在 var postsCollected = wx.getStorageSync('posts_collected') var postCollected = postsCollected[this.data.currentPostId]; // 收藏变成未收藏,未收藏变成收藏 postCollected = !postCollected; postsCollected[this.data.currentPostId] = postCollected; //更新文章是否收藏的缓存 this.showToast(postsCollected, postCollected); }, showModal: function (postsCollected, postCollected) { var that = this; wx.showModal({ title: "收藏", content: postCollected ? "收藏该文章?" : "取消收藏该文章?", showCancel: "true", cancelText: "取消", cancelColor: "#333", confirmText: "确认", confirmColor: "#405f80", success: function (res) { if (res.confirm) { wx.setStorageSync('posts_collected', postsCollected); // 更新数据绑定变量,从而实现切换图片 that.setData({ collected: postCollected }) } } }) }, showToast: function (postsCollected, postCollected) { // 更新文章是否的缓存值 wx.setStorageSync('posts_collected', postsCollected); // 更新数据绑定变量,从而实现切换图片 this.setData({ collected: postCollected }) wx.showToast({ title: postCollected ? "收藏成功" : "取消成功", duration: 1000, icon: "success" }) }, onSharetap: function (event) { var itemList = [ "分享给微信好友", "分享到朋友圈", "分享到QQ", "分享到微博" ]; wx.showActionSheet({ itemList: itemList, itemColor: "#405f80", success: function (res) { // res.cancel 用户是不是点击了取消按钮 // res.tapIndex 数组元素的序号,从0开始 wx.showModal({ title: "用户 " + itemList[res.tapIndex], content: "用户是否取消?" + res.cancel + "现在无法实现分享功能,什么时候能支持呢" }) } }) }, onMusicTap: function (event) { //升级版 // const innerAudioContext = wx.createInnerAudioContext() // innerAudioContext.autoplay = true // innerAudioContext.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46' // innerAudioContext.onPlay(() => { // console.log('开始播放') // }) // innerAudioContext.onError((res) => { // console.log(res.errMsg) // console.log(res.errCode) // }) //音乐在移动设备上 不主动关闭切换另一个页面时是不会自动停止的 var currentPostId = this.data.currentPostId; var postData = postsData.postList[currentPostId]; var isPlayingMusic = this.data.isPlayingMusic; if (isPlayingMusic) { wx.pauseBackgroundAudio(); this.setData({ isPlayingMusic: false }) app.globalData.g_currentMusicPostId = null; app.globalData.g_isPlayingMusic = false; } else { wx.playBackgroundAudio({ dataUrl: postData.music.url, title: postData.music.title, coverImgUrl: postData.music.coverImg, }) this.setData({ isPlayingMusic: true }) app.globalData.g_currentMusicPostId = this.data.currentPostId; app.globalData.g_isPlayingMusic = true; } } })