原文:微信小程序把玩(二十七)audio组件

音频播放已经封装的很好!只需配合属性设置即可! (method和data配合使用)

主要属性:



wxml

<audio
action="{{action}}"
src='http://sc1.111ttt.com/2016/1/09/26/202261732256.mp3'
poster= 'http://avatar.csdn.net/E/3/9/1_u014360817.jpg'
controls="true"
name="钢琴曲"
author="不详"/> <button type="primary" bindtap="audioPlay">播放</button>
<button type="primary" bindtap="audioPause">暂停</button>
<!--正常速度-->
<button type="primary" bindtap="audioPlaybackRateNormal">调为1倍速</button>
<!--慢放-->
<button type="primary" bindtap="audioPlaybackRateSlowDown">调为0.5倍速</button>

js

Page({
data:{
// text:"这是一个页面"
action: {
method: ''
}
}, audioPlay:function() {
this.setData({
action: {
method: 'play'
}
})
},
audioPause:function(){
this.setData({
action: {
method: 'pause'
}
})
},
audioPlaybackRateNormal:function() {
this.setData({
action:{
method: 'setPlaybackRate',
data: 1
}
})
},
audioPlaybackRateSlowDown:function() {
this.setData({
action: {
method: 'setPlaybackRate',
data: 0.5
}
})
}
})

微信小程序把玩(二十七)audio组件的更多相关文章

  1. 微信小程序把玩(十七)input组件

    原文:微信小程序把玩(十七)input组件 input输入框使用的频率也是比较高的...样式的话自己外面包裹个view自己定义.input属性也不是很多,有需要自己慢慢测,尝试 主要属性: wxml ...

  2. 微信小程序把玩(二十八)image组件

    原文:微信小程序把玩(二十八)image组件 image组件也是一个程序不可缺少的,可以这样说一个app中image组件随处可以看到,一般 image有两种加载方式第一种是网络图片第二种是本地图片资源 ...

  3. 微信小程序把玩(二十九)video组件

    原文:微信小程序把玩(二十九)video组件 视频播放组件与图片加载组件也没啥差别,使用起来也没啥注意的 重要属性: wxml <!--监听button点击事件--> <button ...

  4. 微信小程序把玩(二十四)toast组件

    原文:微信小程序把玩(二十四)toast组件 toast消息提示框,可用在提示一些信息,比如清楚缓存给用户一个友好的提示!或操作一些请求不想让用户有什么操作,toast也可以做到因为toast显示时其 ...

  5. 微信小程序把玩(二十五)loading组件

    原文:微信小程序把玩(二十五)loading组件 loading通常使用在请求网络数据时的一种方式,通过hidden属性设置显示与否 主要属性: wxml <!----> <butt ...

  6. 微信小程序把玩(二十六)navigator组件

    原文:微信小程序把玩(二十六)navigator组件 navigator跳转分为两个状态一种是关闭当前页面一种是不关闭当前页面.用redirect属性指定. 主要属性: wxml <naviga ...

  7. 微信小程序把玩(二十二)action-sheet组件

    原文:微信小程序把玩(二十二)action-sheet组件 action-sheet组件是从底部弹出可选菜单项,估计也是借鉴IOS的设计添加的,action-sheet有两个子组件, action-s ...

  8. 微信小程序把玩(二十三)modal组件

    原文:微信小程序把玩(二十三)modal组件 modal弹出框常用在提示一些信息比如:退出应用,清楚缓存,修改资料提交时一些提示等等. 常用属性: wxml <!--监听button点击事件-- ...

  9. 微信小程序把玩(二十)slider组件

    原文:微信小程序把玩(二十)slider组件 slider滑动组件用的不太多,在其他平台反正我是用的不多 主要属性: wxml <slider max="100" step= ...

随机推荐

  1. JFinal redis cluster集群插件

    JFinal redis cluster集群插件 JFinal 框架到了2.1版本号,可是依旧仅仅支持redis的主从集群,没有看到Cluster集群的插件.笔者照着主从的插件方式,改了改,实现了个简 ...

  2. 小强的HTML5移动开发之路(26)—— JavaScript回顾1

    很久没有怎么用过JavaScript了,感觉有点生疏,最近在看关于HTML5移动开发方面的资料,有一种直觉告诉我,JavaScript昨天.今天很重要,明天会更重要.现在好多基于JavaScript的 ...

  3. tombstone问题分析

    tombstone文件包含了发生问题的进程ID信息 I/DEBUG ( 241): pid: 244, tid: 244, name: mediaserver >>> /system ...

  4. 【13.77%】【codeforces 734C】Anton and Making Potions

    time limit per test4 seconds memory limit per test256 megabytes inputstandard input outputstandard o ...

  5. cxf maven 依赖 No message body writer foud.. contenttype:application/json

    最近使用cxf发布rest服务时遇到了如题的异常,最后发现是缺少依赖的问题.ps:我并没有使用spring cxf基本运行需要如下依赖 1 <dependency> <groupId ...

  6. Massive Collection Of Design Patterns, Frameworks, Components, And Language Features For Delphi

    Developer beNative over on GitHub has a project called Concepts which is a massive collection of Del ...

  7. 数据结构 - 只需选择排序(simple selection sort) 详细说明 和 代码(C++)

    数据结构 - 只需选择排序(simple selection sort) 本文地址: http://blog.csdn.net/caroline_wendy/article/details/28601 ...

  8. Leetcode 318 Maximum Product of Word Lengths 字符串处理+位运算

    先介绍下本题的题意: 在一个字符串组成的数组words中,找出max{Length(words[i]) * Length(words[j]) },其中words[i]和words[j]中没有相同的字母 ...

  9. WPF 关于圆角的制作

    原文:WPF 关于圆角的制作 1.使用Boder(一般情况): 设置CornerRadius属性 <Border x:Name="border" CornerRadius=& ...

  10. 可视化利器 —— t-SNE(matlab toolbox 的使用与解释)

    t-SNE – Laurens van der Maaten(感谢学术男神们的无私开源) User_guide.pdf(用户指南) 1. tsne 函数 mappedX = tsne(X, label ...