用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

小程序社区 首页 教程 实战教程 查看内容

微信小程序播放音频

Rolan 2017-9-27 00:42

今天做微信小程序涉及到播放音频文件:使用audio标签来绑定音频路径audio id='audioid' src='{{vidioUrl}}' binderror="audioError" bindplay="audioPlay" bindeneded="playEnd" bindtimeupdate="timeUpdate" /audio ...

今天做微信小程序涉及到播放音频文件:

使用audio标签来绑定音频路径

  1. <audio id='audioid' src='{{vidioUrl}}' binderror="audioError" bindplay="audioPlay" bindeneded="playEnd" bindtimeupdate="timeUpdate"> </audio>

目前没有做到播放下一首的功能,只有暂停和播放。 
最上面的播放条是通过progress的percent来实现的,

  1. <progress percent="{{currtRate}}" stroke-width="2" activeColor="#ffd200" backgroundColor="#bcbcbc" />

通过currtRate来实现播放条的已播放长度

界面:

  1. <view class="ub-ver info-container" style="height:5em;">
  2. <!-- 音频播放 -->
  3. <view class='ub fonts12 align-items-center' >
  4. <view>{{currentTime}}</view>
  5. <view class="umw-6"></view>
  6. <view class='ub-f1'>
  7. <progress percent="{{currtRate}}" stroke-width="2" activeColor="#ffd200" backgroundColor="#bcbcbc"