微信小程序之音乐控制播放（audio的API）

来源：互联网发布：淘宝开店货源免费代理编辑：程序博客网时间：2024/06/06 04:23

一.小知识

1.wx.getBackgroundAudioPlayerState(OBJECT)：获取后台音乐播放状态。

wx.getBackgroundAudioPlayerState({    success: function(res) {        var status = res.status        var dataUrl = res.dataUrl        var currentPosition = res.currentPosition        var duration = res.duration        var downloadPercent = res.downloadPercent    }})

2.wx.playBackgroundAudio(OBJECT)

wx.playBackgroundAudio({    dataUrl: '',    title: '',    coverImgUrl: ''})

3.wx.pauseBackgroundAudio()暂停播放音乐。

4.wx.seekBackgroundAudio(OBJECT)控制音乐播放进度。

wx.seekBackgroundAudio({    position: 30})

5.wx.stopBackgroundAudio()停止播放音乐。

6.wx.onBackgroundAudioPlay(CALLBACK)监听音乐播放。

7.wx.onBackgroundAudioPause(CALLBACK)监听音乐暂停。

8.wx.onBackgroundAudioStop(CALLBACK)监听音乐停止。

二.案例

<view class="zn-uploadimg"><button type="primary" bindtap="listenerButtonPlay">播放</button><button type="primary" bindtap="listenerButtonPause">暂停</button><button type="primary" bindtap="listenerButtonSeek">设置播放进度</button><button type="primary" bindtap="listenerButtonStop">停止播放</button><button type="primary" bindtap="listenerButtonGetPlayState">获取播放状态</button></view>

.zn-uploadimg{    padding:1rem;}.zn-uploadimg button{    margin:10px;}

//record.js //获取应用实例  Page({data:{// text:"这是一个页面"},onLoad:function(options){// 页面初始化 options为页面跳转所带来的参数/** * 监听音乐播放 */wx.onBackgroundAudioPlay(function() {    console.log('onBackgroundAudioPlay')})/** * 监听音乐暂停 */wx.onBackgroundAudioPause(function() {    console.log('onBackgroundAudioPause')})/** * 监听音乐停止 */wx.onBackgroundAudioStop(function() {    console.log('onBackgroundAudioStop')})},//播放音乐listenerButtonPlay: function() {  wx.playBackgroundAudio({//播放地址dataUrl: 'http://sc1.111ttt.com/2016/1/09/28/202280605509.mp3',title: '青云志',//图片地址coverImgUrl: 'http://r1.ykimg.com/050E0000576B75F667BC3C136B06E4E7'  })},/*** 播放状态*/listenerButtonGetPlayState: function() {    wx.getBackgroundAudioPlayerState({        success: function(res) {          console.log(res)          //duration 总时长          //currentPosition 当前播放位置          //status 播放状态          //downloadPercent 下载状况 100 即为100%          //dataUrl 当前播放音乐地址        }    }) },/*** 监听button暂停按钮*/listenerButtonPause: function() {   wx.pauseBackgroundAudio();},/*** 设置进度*/listenerButtonSeek: function() {    wx.seekBackgroundAudio({        position: 30    })},/***停止播放 */listenerButtonStop: function() {    wx.stopBackgroundAudio()}})

阅读全文

0 0