文档章节

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

Mr韦淋
 Mr韦淋
发布于 2017/05/07 20:22
字数 160
阅读 31
收藏 0

这里写图片描述

音频播放已经封装的很好!只需配合属性设置即可! (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
    }
  })
}
})

本文转载自:http://blog.csdn.net/u014360817/article/details/52672816

共有 人打赏支持
Mr韦淋
粉丝 2
博文 80
码字总数 23114
作品 0
江门
高级程序员
私信 提问
微信小程序端 html2wxml 转换接口 - html2wxml4j

项目介绍 微信小程序端 html2wxml 转换接口 Java版 基于JFinal+Jsoup 实现功能 目前仅实现解析Html并转换成JSON,将生成的JSON通过接口访问返回给微信小程序端, 微信小程序端使用html2wxml...

山东-小木
2018/08/06
0
0
微信小程序 Html2Wxml4J 0.95 更新,支持 Video 和 Audio 解析

html2wxml4J是微信小程序前端html渲染组件html2wxml的后台接口Java版 本次更新内容: 【新增】Video视频标签解析 支持html5中Video标签大部分属性 支持自动播放 支持静音播放 【新增】Audio...

山东-小木
2018/08/07
1K
3
首个多端 UI 组件库 - Taro UI 发布

前言 Taro 是由凹凸实验室倾力打造的多端开发解决方案,旨在让一套代码在多端运行。Taro 1.0 版本发布后,也开始支持引用第三方的小程序组件库,如 iView、vant-weapp、echarts-for-weixin,...

阿集
2018/08/27
0
0
前端资源系列(3)-微信小程序开发资源汇总

微信(小程序or应用号)开发资源汇总-文档-工具-教程-代码-插件-组件 文档 从搭建一个微信小程序开始 小程序开发文档 小程序设计指南 工具 小程序开发者工具 - 官方 Egret Wing 3.2.x 支持微信...

xzavier
2018/08/27
0
0
微信小程序插件 - 开发教程

昨天(2018.3.13),微信小程序发布了重大功能更新,支持插件的使用和开发,个人预计,不超过2个月,优质服务的插件将会如雨后春笋般涌现。 这篇文章,我将会带大家,从0开始,学习如何开发和...

理工男海哥
2018/03/14
554
0

没有更多内容

加载失败,请刷新页面

加载更多

跟我学Spring Cloud(Finchley版)-15-Hystrix监控详解

Hystrix提供了监控Hystrix Command的能力,本节来详细探讨。 监控端点与数据 应用整合Hystrix,同时应用包含spring-boot-starter-actuator 依赖,就会存在一个/actuator/hystrix.stream 端点...

周立_ITMuch
4分钟前
0
0
Android Studio jni开发入门——看我就够了

一、环境配置 主要需要配置的就是NDK(Native Development Kit),现在Android studio很便利,可以一键下载: file → setting → 按截图找到如下路径 → 选择NDK → 确定应用下载 NDK安装 ...

天王盖地虎626
5分钟前
0
0
day26:shell题

1、 判断当前主机的CPU生产商,其信息在/proc/cpuinfo文件中vendor id一行中。 如果其生产商为AuthenticAMD,就显示其为AMD公司; 如果其生产商为GenuineIntel,就显示其为Intel公司; 否则,...

芬野de博客
14分钟前
0
0
iOS开发之CoreMotion框架的应用

iOS开发之CoreMotion框架的应用 我们知道,现在智能手机手机的功能已经越来越强大。小小的手机中集成了众多的传感器配件。通过这些传感器可以获取到手机甚至用户的状态信息。 在iOS5之前,加...

珲少
17分钟前
0
0
python里能不能用中文

现代计算机和编程的起源和推动力量主要源自美国,再加上26个字母很便于表示(算上大小写,6位bit就够了),因此英语一直是编程领域的不二之选。但这就给部分非英语国家的编程学习者带来一些困...

crossin
18分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部