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;
}
}
})