创建audioManager.js作为全局播放管理工具,代码如下
// 创建一个全局的音频管理对象,用于存储音频相关状态和方法
const audioManager = {
// 背景音频管理器实例
// #ifdef H5
bgAudioManager: uni.createInnerAudioContext(),
// #endif
// #ifdef APP-PLUS
bgAudioManager: uni.getBackgroundAudioManager(),
// #endif
// 当前音频播放状态,true表示播放中,false表示暂停
isPlaying: false,
// 当前音频的相关信息,例如标题、作者、封面等,可根据实际需求扩展
currentIndex: 0,
currentAudioInfo: {
musicTitle: '',
musicImgPath: '',
musicFilePath: '' ,
musicDuration: 0
},
currentDuration: 0,
playType: 0, // 默认 0 播放1 2 暂停
timingDs: 0,
timing: 0,
timingIndex: 0,
// 定时关闭
timingArr: [
{title: '60分钟', value: 3600},
{title: '45分钟', value: 2700},
{title: '30分钟', value: 1800},
{title: '15分钟', value: 900},
{title: '1分钟-测试', value: 60},
{title: '关闭', value: 0},
],
// 音乐列表
musicArr: [],
loopType: 0, // 循环模式 0 单曲循环 1 列表循环
// 初始化音频管理器,设置一些默认的监听事件等
init() {
this.bgAudioManager.onPlay(() => {
this.isPlaying = true;
this.playType = 1;
// 可以在这里添加其他逻辑,比如更新页面上的播放状态图标等
});
this.bgAudioManager.onPause(() => {
this.isPlaying = false;
this.playType = 2;
// 相应页面状态更新逻辑
});
this.bgAudioManager.onStop(() => {
this.isPlaying = false;
this.playType = 0;
// 可能的清理或重置逻辑
});
this.bgAudioManager.onEnded(() => {
// this.isPlaying = false;
// this.playType = 0;
// 比如自动播放下一首等逻辑(需进一步实现)
if(this.loopType == 0) { // 单曲循环
audioManager.play(this.currentAudioInfo)
} else { // 列表循环
if (this.currentIndex == this.musicArr.length - 1) {
this.currentIndex = 0;
} else {
this.currentIndex ++;
}
audioManager.play(this.musicArr[this.currentIndex])
}
});
this.bgAudioManager.onTimeUpdate(() => {
// 获取当前播放进度,单位为秒
this.currentDuration = this.bgAudioManager.currentTime > 0 ? this.bgAudioManager.currentTime : this.currentDuration;
// this.progressPercent = (this.currentTime / this.duration) * 100;
// console.log('当前播放进度:', this.currentTime);
});
},
// 播放音频方法,传入音频信息对象
play(audioInfo) {
// this.currentAudioInfo = audioInfo;
console.log("进来了~1")
this.currentDuration = 0;
this.currentAudioInfo = {
musicTitle: audioInfo.musicTitle,
musicImgPath: audioInfo.musicImgPath,
musicFilePath: audioInfo.musicFilePath,
musicDuration: audioInfo.musicDuration
}
this.bgAudioManager.title = audioInfo.musicTitle;
this.bgAudioManager.coverImgUrl = audioInfo.musicImgPath;
this.bgAudioManager.singer = audioInfo.musicTitle;
this.bgAudioManager.src = audioInfo.musicFilePath;
this.bgAudioManager.play();
},
play1() {
console.log("进来了~2")
let audioInfo = this.currentAudioInfo;
this.bgAudioManager.title = audioInfo.musicTitle;
this.bgAudioManager.coverImgUrl = audioInfo.musicImgPath;
this.bgAudioManager.singer = audioInfo.musicTitle;
this.bgAudioManager.src = audioInfo.musicFilePath;
this.bgAudioManager.seek(this.currentDuration);
this.bgAudioManager.play();
},
// 暂停音频播放
pause() {
this.bgAudioManager.pause();
},
// 停止音频播放并重置相关状态
stop() {
this.bgAudioManager.stop();
this.isPlaying = false;
this.currentAudioInfo = {
musicTitle: '',
musicImgPath: '',
musicFilePath: '' ,
musicDuration: 0
};
this.currentDuration = 0;
this.playType = 0;
this.musicArr = [];
this.currentIndex = 0;
clearInterval(this.timingDs)
},
// 定时关闭
timeOutBtn(val,inx) {
this.timing = val;
this.timingIndex = inx;
if (this.timing == 0) {
clearInterval(this.timingDs)
return;
}
clearInterval(this.timingDs)
this.timingDs = setInterval(() => {
if (this.timing > 0) {
this.timing --
} else {
clearInterval(this.timingDs)
audioManager.stop();
this.timingDs = 0;
this.timing = 0;
this.timingIndex = 0;
}
},1000)
},
// 更新循环模式
loopTypeBtn() {
this.loopType = this.loopType == 0 ? 1 : 0;
if (this.loopType == 0) {
uni.showToast({
title: '已切换为单曲循环',
icon: 'none',
duration: 2000
});
} else {
uni.showToast({
title: '已切换为列表循环',
icon: 'none',
duration: 2000
});
}
},
// 更新当前音乐列表
upListBtn(arr,index) {
this.musicArr = arr;
this.currentIndex = index;
},
// 上一首
preBtn() {
if (this.currentIndex == 0) {
uni.showToast({
title: '已经第一首了',
icon: 'none',
duration: 2000
});
return;
}
this.currentIndex --;
audioManager.play(this.musicArr[this.currentIndex])
},
// 下一首
nextBtn() {
if (this.currentIndex == this.musicArr.length - 1) {
uni.showToast({
title: '已经最后一首了',
icon: 'none',
duration: 2000,
});
return;
}
this.currentIndex ++;
audioManager.play(this.musicArr[this.currentIndex])
},
};
// 初始化音频管理器
audioManager.init();
// 导出音频管理对象,方便在其他页面引入使用
export default audioManager;
在需要使用播放器的页面,引入
import audioManager from '@/common/audioManager.js';
就可以使用播放器管理工具了