uni.createInnerAudioContext()实现在app 小程序 h5有声书的倍速功能
官网提供的api进行的开发,自我感觉没啥问题,但是在不同的端上好像有的好使有的不好使,暂时不知道啥问题
data中的变量:showPlaybackRate: false,
<!-- 倍速弹出层 --><u-popup :show="showPlaybackRate" @close="closePlaybackRate" @open="openPlaybackRate" :round="10"><scroll-view scroll-y style="height: 100%;"><view class="content" :style="'transform:translateY(' + translateY + 'px);'" :animation="animate"><view class="header"><view class="title">倍速选择</view><view class="right" @click="closePlaybackRate"><u-icon name="close" color="#000000" size="20"></u-icon></view></view><view class="rate-listBox"><view class="rate-list" @click="handleRate(0.5)">0.5倍速</view><view class="rate-list" @click="handleRate(1)">1.0倍速</view><view class="rate-list" @click="handleRate(1.5)">1.5倍速</view><view class="rate-list" @click="handleRate(2.0)">2.0倍速</view></view></view></scroll-view></u-popup>
点击弹出层倍速切换的方法:
// 倍速播放
//this.bgAudioMannager可以通过两种方法获取,一个支持后台播放,具体可以参考官网,我是用的uni.createInnerAudioContext()
handleRate(type) {let that = this// // #ifdef H5// this.bgAudioMannager = uni.createInnerAudioContext()// // #endif// // #ifndef H5// this.bgAudioMannager = uni.getBackgroundAudioManager()// // #endif// 0.5倍速that.bgAudioMannager.pause()if (type == 0.5) {that.bgAudioMannager.playbackRate = 0.5that.rateText = '0.5X'} else if (type == 1.0) {that.bgAudioMannager.playbackRate = 1.0that.rateText = '1.0X'} else if (type == 1.5) {that.bgAudioMannager.playbackRate = 1.5that.rateText = '1.5X'} else {that.bgAudioMannager.playbackRate = 2.0that.rateText = '2.0X'}//查资料有的说的是播放和设置倍速不能同时,要不很大可能就没效果,所以用了个定时器,但有的还是没效果,不知道为啥,官网没查到具体问题setTimeout(res => {that.bgAudioMannager.play()}, 2000)// #endifthat.playStatus = truethat.showPlaybackRate = false
},