微信小程序 Audio API詳解及實(shí)例代碼

沒啥可值得太注意的地方
重要屬性:
1. wx.getBackgroundAudioPlayerState(object) 獲取播放狀態(tài)

2.wx.playBackgroundAudio(object)播放音樂

3.wx.pauseBackgroundAudio()暫停音樂
4.wx.seekBackgroundAudio(object) 設(shè)置播放進(jìn)度

5.wx.stopBackgroundAudio()停止播放音樂
三個(gè)監(jiān)聽器:

wxml
<button type="primary" bindtap="listenerButtonPlay">播放</button> <button type="primary" bindtap="listenerButtonPause">暫停</button> <button type="primary" bindtap="listenerButtonSeek">設(shè)置播放進(jìn)度</button> <button type="primary" bindtap="listenerButtonStop">停止播放</button> <button type="primary" bindtap="listenerButtonGetPlayState">獲取播放狀態(tài)</button>
js
Page({
data:{
// text:"這是一個(gè)頁面"
},
listenerButtonPlay: function() {
wx.playBackgroundAudio({
//播放地址
dataUrl: 'http://sc1.111ttt.com/2016/1/09/28/202280605509.mp3',
//title 音樂名字
title: '青云志',
//圖片地址
coverImgUrl: 'http://r1.ykimg.com/050E0000576B75F667BC3C136B06E4E7'
})
},
/**
* 播放狀態(tài)
*/
listenerButtonGetPlayState: function() {
wx.getBackgroundAudioPlayerState({
success: function(res) {
console.log(res)
//duration 總時(shí)長(zhǎng)
//currentPosition 當(dāng)前播放位置
//status 播放狀態(tài)
//downloadPercent 下載狀況 100 即為100%
//dataUrl 當(dāng)前播放音樂地址
}
})
},
/**
* 監(jiān)聽button暫停按鈕
*/
listenerButtonPause: function() {
wx.pauseBackgroundAudio();
},
/**
* 設(shè)置進(jìn)度
*/
listenerButtonSeek: function() {
wx.seekBackgroundAudio({
position: 30
})
},
/**
*停止播放
*/
listenerButtonStop: function() {
wx.stopBackgroundAudio()
},
onLoad:function(options){
// 頁面初始化 options為頁面跳轉(zhuǎn)所帶來的參數(shù)
/**
* 監(jiān)聽音樂播放
*/
wx.onBackgroundAudioPlay(function() {
console.log('onBackgroundAudioPlay')
})
/**
* 監(jiān)聽音樂暫停
*/
wx.onBackgroundAudioPause(function() {
console.log('onBackgroundAudioPause')
})
/**
* 監(jiān)聽音樂停止
*/
wx.onBackgroundAudioStop(function() {
console.log('onBackgroundAudioStop')
})
},
onReady:function(){
// 頁面渲染完成
},
onShow:function(){
// 頁面顯示
},
onHide:function(){
// 頁面隱藏
},
onUnload:function(){
// 頁面關(guān)閉
}
})
感謝閱讀本文,希望能幫助到大家,謝謝大家對(duì)本站的支持!
- 微信小程序 audio音頻播放詳解及實(shí)例
- 微信小程序 audio 組件實(shí)例詳解
- 微信小程序媒體組件詳解(視頻,音樂,圖片)
- 微信小程序-圖片、錄音、音頻播放、音樂播放、視頻、文件代碼實(shí)例
- 微信小程序使用video組件播放視頻功能示例【附源碼下載】
- 微信小程序開發(fā)之視頻播放器 Video 彈幕 彈幕顏色自定義實(shí)例
- 微信小程序開發(fā)之錄音機(jī) 音頻播放 動(dòng)畫實(shí)例 (真機(jī)可用)
- 微信小程序 vidao實(shí)現(xiàn)視頻播放和彈幕的功能
- 微信小程序page的生命周期和音頻播放及監(jiān)聽實(shí)例詳解
- 微信小程序使用audio組件播放音樂功能示例【附源碼下載】
相關(guān)文章
javascript數(shù)據(jù)類型之原始類型詳解
這篇文章主要為大家介紹了javascript數(shù)據(jù)類型之原始類型詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-06-06
async-await消滅異步回調(diào)實(shí)例詳解
這篇文章主要為大家介紹了async-await消滅異步回調(diào)實(shí)例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07
詳解lodash中的cloneDeep使用細(xì)節(jié)
這篇文章主要為大家介紹了詳解lodash中的cloneDeep使用細(xì)節(jié),有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-01-01
JavaScript中塊級(jí)作用域與函數(shù)作用域深入剖析
這篇文章主要為大家介紹了JavaScript中塊級(jí)作用域與函數(shù)作用域的實(shí)現(xiàn)原理深入剖析,2023-05-05
JSON字符串轉(zhuǎn)換JSONObject和JSONArray的方法
這篇文章主要介紹了JSON字符串轉(zhuǎn)換JSONObject和JSONArray的方法的相關(guān)資料,需要的朋友可以參考下2016-06-06

