在我的华为快应用中,音乐播放过程中,当用户切换到应用中的另一个页面,并使用状态栏切换到播放另一首歌曲时,音乐播放会暂停。它是如何发生的?
问问题
23 次
1 回答
1
在应用主页上收听audio
事件,而不仅仅是在播放页面上。这样,当用户离开播放页面时,audio
仍然可以监听各个事件,从而控制播放逻辑。
注意:华为快应用引擎不支持audio
调用app.ux
. audio
因此,当用户退出应用时,即使音乐还在后台播放,快应用也无法接收到事件回调。
以下演示有两个页面:(Main
主页)和Audio
. 为避免重复代码并确保可维护性,请将页面的代码分开Audio
为每个页面调用的通用 JavaScript。
- 公开
utils.js
:
import audio from '@system.audio';
export default{
listenAudio() {
var that=this;
console.info("util.js listenAudio ");
audio.onplay = function () {
console.log('audio onplay')
}
audio.onpause = function () {
console.log('audio onpause')
}
audio.onended = function () {
console.log('audio onended')
}
audio.ondurationchange = function () {
console.log('util.js ondurationchange')
var total = audio.duration
console.log('util.js ondurationchange total=' + total)
}
audio.ontimeupdate = function () {
var time = audio.currentTime
// console.log('util.js ontimeupdate time=' + time)
}
audio.onprevious = function () {
audio.cover = 'https://xx.jpg'
audio.title = "Piano music"
audio.artist = "Mozart"
// Replace with the music resource link.
audio.src = 'https://xx.mp3'
console.log(' util.js on previout event from notification ')
}
audio.onnext = function () {
audio.cover = 'xx.jpg'
audio.title = 'Pop';
audio.artist = 'Michael Jackson'
// Replace with the music resource link.
audio.src = 'https://xx.mp3'
console.log(' util.js on next event from notification ')
}
},
getAudioPlayState() {
audio.getPlayState({
success: function (data) {
console.log(`getAudioPlayState success: state: ${data.state},src:${data.src},
currentTime:${data.currentTime},autoplay:${data.autoplay},loop:${data.loop},
volume: ${data.volume},muted:${data.muted},notificationVisible:${data.notificationVisible}`);
},
fail: function (data, code) {
console.log('getAudioPlayState fail, code=' + code);
}
});
},
startPlay() {
audio.play();
},
pausePlay() {
audio.pause();
},
stopPlay() {
audio.stop();
},
seekProress(len) {
audio.currentTime = len;
},
setVolume(value) {
audio.volume = value;
},
setMute(isMuted) {
audio.muted = isMuted
},
setLoop(isloop) {
audio.loop = isloop
},
setStreamType() {
if (audio.streamType === 'music') {
audio.streamType = 'voicecall'
} else {
audio.streamType = 'music'
}
console.error('audio.streamType =' + audio.streamType);
},
setTitle(title) {
console.info('setTitle=' + title);
audio.title = title;
},
setArtist(artist) {
console.info('setArtist artist=' + artist) ;
audio.artist = artist;
},
setCover(src) {
console.info('setCover src=' + src);
audio.cover = src;
}
}
- 在页面的
audio
生命周期方法onShow
中添加事件监听器Main
并调用listenAudio
.utils.js
示例代码:
<script>
import utils from '../Util/utils.js';
module.exports = {
onShow(options) {
utils.listenAudio();
},
}
</script>
- 在页面
audio
的生命周期方法中添加事件监听,并调用. 由于需要在播放页面显示播放进度,所以单独监听进度回调事件。示例代码:onShow
Audio
listenAudio
utils.js
onShow(options) {
var that = this;
utils.listenAudio();
audio.ondurationchange = function () {
console.log('audio ondurationchange')
that.total = audio.duration
console.log('audio ondurationchange total=' + that.total)
}
audio.ontimeupdate = function () {
that.time = audio.currentTime
console.log('ontimeupdate time=' + that.time)
}
},
有关更多详细信息,请查看以下指南:
于 2021-04-27T05:56:04.280 回答