微信小程序官方文档-媒体组件audio

  • Coder.Bing 发布于 2016-09-24 03:04:47
  • 分类：编程语言
  • 评论(0)

付费节点推荐

免费节点

节点使用教程

audio

音频。

属性名 类型 默认值 说明
action Object 控制音频的播放、暂停，播放速率、播放进度的对象，有 method 和 data 两个参数
src String 要播放音频的资源地址
loop Boolean false 是否循环播放
controls Boolean true 是否显示默认控件
poster String 默认控件上的音频封面的图片资源地址，如果 controls 属性值为 false 则设置 poster 无效
name String 未知音频 默认控件上的音频名字，如果 controls 属性值为 false 则设置 name 无效
author String 未知作者 默认控件上的作者名字，如果 controls 属性值为 false 则设置 author 无效
binderror EventHandle 当发生错误时触发 error 事件，detail = {errMsg: MediaError.code}
bindplay EventHandle 当开始/继续播放时触发play事件
bindpause EventHandle 当暂停播放时触发 pause 事件
bindratechange EventHandle 当播放速率改变时触发 ratechange 事件
bindtimeupdate EventHandle 当播放进度改变时触发 timeupdate 事件，detail = {currentTime, duration}
bindended EventHandle 当播放到末尾时触发 ended 事件

MediaError.code

返回错误码 描述
MEDIA_ERR_ABORTED 获取资源被用户禁止
MEDIA_ERR_NETWORD 网络错误
MEDIA_ERR_DECODE 解码错误
MEDIA_ERR_SRC_NOT_SUPPOERTED 不合适资源

Action

method 描述 data
play 播放
pause 暂停
setPlaybackRate 调整速度 倍速
setCurrentTime 设置当前时间 播放时间

示例代码：

action的method属性只能是play、pause、setPlaybackRate、setCurrentTime，用法如下：

<!-- 循环播放 -->
<audio poster="{{poster}}" name="{{name}}" author="{{author}}" src="http://qqma.tingge123.com:823/mp3/2015-06-13/1434188181.mp3" action="{{action}}" controls loop></audio>

<button type="primary" bindtap="audioPlay">播放</button>
<button type="primary" bindtap="audioPause">暂停</button>
<button type="primary" bindtap="audioPlaybackRateSpeedUp">调为2倍速</button>
<button type="primary" bindtap="audioPlaybackRateNormal">调为1倍速</button>
<button type="primary" bindtap="audioPlaybackRateSlowDown">调为0.5倍速</button>
<button type="primary" bindtap="audio14">设置当前播放时间为14秒</button>
<button type="primary" bindtap="audioStart">回到开头</button>
// app-service
Page({
  data: {
    poster: 'http://pic.pimg.tw/pam86591/1408719752-3322564110_n.jpg',
    name: 'Sugar',
    author: 'Maroon 5'
  },
  audioPlay: function () {
    this.setData({
      action: {
        method: 'play'
      }
    })
  },
  audioPause: function () {
    this.setData({
      action: {
        method: 'pause'
      }
    })
  },
  audioPlaybackRateSpeedUp: function () {
    this.setData({
      action: {
        method: 'setPlaybackRate',
        data: 2
      }
    })
  },
  audioPlaybackRateNormal: function () {
    this.setData({
      action: {
        method: 'setPlaybackRate',
        data: 1
      }
    })
  },
  audioPlaybackRateSlowDown: function () {
    this.setData({
      action: {
        method: 'setPlaybackRate',
        data: 0.5
      }
    })
  },
  audio14: function () {
    this.setData({
      action: {
        method: 'setCurrentTime',
        data: 14
      }
    })
  },
  audioStart: function () {
    this.setData({
      action: {
        method: 'setCurrentTime',
        data: 0
      }
    })
  }
})

audio

未经允许不得转载：Bcoder资源网 » 微信小程序官方文档-媒体组件audio

相关推荐

赞 (0)
分享到：更多 ()

相关推荐

评论 0

评论前必须登录！

登陆 注册