微信小程序-音频createInnerAudioContext

花儿开富贵花

已于 2023-06-07 17:52:15 修改

阅读量1.2k

点赞数

文章标签：微信小程序小程序微信

于 2022-08-01 17:40:02 首次发布

本文链接：https://blog.csdn.net/weixin_43843679/article/details/125372394

版权

1、在wxml文件中

  <view class="btn-content">
    <view wx:if="{{ !isPlaying }}" class="bgc-content {{ selectFeelingInfo.curDemoSentence === '' ? 'nobgc-color' : 'bgc-color' }}" bindtap="composeCommit">立即合成</view>
    <view wx:if="{{ isPlaying }}" class="bgc-content bgc-color" bindtap="stopPlay">停止播放</view>
  </view>

2、在.js文件中

// 1.创建
const innerAudioContext = wx.createInnerAudioContext()
composeCommit() {
    this.setData({
      isPlaying: true
    })
    wx.downloadFile({
    	url: '',  // 语音src接口查询
    	success(res) {
    		//res如 http://tmp/5IuvWD3KcmYS5d69fd3ae38b216595b2b429d4dce7d7.mpga
    	  innerAudioContext.src = res.tempFilePath
          innerAudioContext.play()

          innerAudioContext.onEnded(() => {  // 取消监听音频停止事件
            _this.setData({
              isPlaying: false
            })
          })
          innerAudioContext.onStop(() => {
            _this.setData({
              isPlaying: false
            })
          })
          innerAudioContext.onPlay(() => {
            _this.setData({
              isPlaying: true
            })
          })
    	}
    })
},

  /**
   * 停止播放
   */
  stopPlay() {
    innerAudioContext.stop();
    innerAudioContext.src = ''
  },