html5+ audio 模块
MUI播放音频 Audio模块用于提供音频的录制和播放功能,可调用系统的麦克风设备进行录音操作,也可调用系统的扬声器设备播放音频文件。通过plus.audio获取音频管理对象。
权限
"Audio": {
"description": "访问音频设备"
}
录音
// 扩展API加载完毕,现在可以正常调用扩展API
function onPlusReady() {
r = plus.audio.getRecorder();
}
function startRecord() {
if ( r == null ) {
alert( "Device not ready!" );
return;
}
r.record( {filename:"_doc/audio/xx.amr"}, function () {//真机测试文件在/sdcard/Android/data/io.dcloud.HBuilder/.HBuilder/apps/HBuilder/doc下面(.HBuilder是隐藏的,要查看隐藏的文件)
alert( "Audio record success!" );
}, function ( e ) {
alert( "Audio record failed: " + e.message );
} );
}
这样录音就被保存下来了
播放录音
function player(){//播放音乐
s = plus.audio.createPlayer( "_doc/audio/gg.mp3" );
var num = s.getDuration();//获取音频总长度number
setTimeout(function(){//延时获取,否则可能没有返回长度
var num = s.getDuration();
alert(num)
},100) s.play( function () {//播放完成回调
alert( "Audio play success!" );
}, function ( e ) {//失败回调
alert( "Audio play error: " + e.message );
} );
}
暂停播放:
function pause(){//暂停播放
s.pause();
}
恢复播放:
function resume() {//恢复播放
s.resume();
}
跳到指定位置播放(快进):
function seekTo(){
s.seekTo(100);
}
完整测试代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Audio Example</title>
<script type="text/javascript">
// 扩展API加载完毕后调用onPlusReady回调函数
document.addEventListener( "plusready", onPlusReady, false );
var r = null;
// 扩展API加载完毕,现在可以正常调用扩展API
function onPlusReady() {
r = plus.audio.getRecorder();
}
function startRecord() {
if ( r == null ) {
alert( "Device not ready!" );
return;
}
r.record( {filename:"_doc/audio/xx.amr"}, function () {//真机测试文件在/sdcard/Android/data/io.dcloud.HBuilder/.HBuilder/apps/HBuilder/doc下面(.HBuilder是隐藏的,要查看隐藏的文件)
alert( "Audio record success!" );
}, function ( e ) {
alert( "Audio record failed: " + e.message );
} );
}
function stopRecord() {
r.stop();
}
function player(){//播放音乐
s = plus.audio.createPlayer( "_doc/audio/gg.mp3" );
var num = s.getDuration();//获取音频总长度number
setTimeout(function(){//延时获取,否则可能没有返回长度
var num = s.getDuration();
alert(num)
},100) s.play( function () {
alert( "Audio play success!" );
}, function ( e ) {
alert( "Audio play error: " + e.message );
} );
}
function pause(){//暂停播放
s.pause();
}
function resume() {//恢复播放
s.resume();
}
function seekTo(){
s.seekTo(100);
}
</script>
</head>
<body>
<input type="button" value="Start Record" onclick="startRecord();"/>
<br/>
<input type="button" value="Stop Record" onclick="stopRecord();"/>
<br />
<input type="button" value="player" onclick="player();"/>
<br />
<input type="button" value="暂停" onclick="pause();"/>
<br />
<input type="button" value="恢复" onclick="resume();"/>
<br />
<input type="button" value="跳到指定位置" onclick="seekTo();"/> </body>
</html>
MUI音乐播放html5+audio模块的更多相关文章
-
在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
-
解决html5 audio iphone,ipd,safari不能自动播放问题
html audio 在iPhone,ipd,safari浏览器不能播放是有原因滴 (在safri on ios里面明确指出等待用户的交互动作后才能播放media,也就是说如果你没有得到用户的acti ...
-
关于html5 audio 标签在ios系统上不能正常自动播放的解决办法
由于 iOS Safari 限制不允许 audio autoplay, 必须用户主动交互(例如 click)后才能播放 audio, 因此我们通过一个用户交互事件来主动 play 一下 audio. ...
-
HTML5 Audio时代的MIDI音乐文件播放
大家都知道,HTML5 Audio标签能够支持wav, webm, mp3, ogg, acc等格式,但是有个很重要的音乐文件格式midi(扩展名mid)却在各大浏览器中都没有内置的支持,因为mid文 ...
-
HTML5项目笔记4:使用Audio API设计绚丽的HTML5音乐播放器
HTML5 有两个很炫的元素,就是Audio和 Video,可以用他们在页面上创建音频播放器和视频播放器,制作一些效果很不错的应用. 无论是视屏还是音频,都是一个容器文件,包含了一些音频轨道,视频轨道 ...
-
使用Audio API设计绚丽的HTML5音乐播放器
HTML5 有两个很炫的元素,就是Audio和 Video,可以用他们在页面上创建音频播放器和视频播放器,制作一些效果很不错的应用. 无论是视屏还是音频,都是一个容器文件,包含了一些音频轨道,视频轨道 ...
-
html5,audio音乐播放器
最终,做了自己原来一直想要实现的事儿.得出的结果是,有些事儿一旦開始做了,那么它就并非非常难. 如今的我,正听着自己的播放器放出的<光辉岁月>写这篇周六清晨的博文.写的不是非常好.但也请各 ...
-
html5 audio标签微信部分苹果手机不能自动播放音乐终极解决方案
html5 audio标签微信部分苹果手机不能自动播放音乐终极解决方案 大家都知道需要在点击时候后 播放 ps:如果点击ajax 回来播放也不行,必须点击立即播放 要背景自动播放只能采取下面方案< ...
-
html5 audio标签切换播放音乐的方法
html5 audio标签切换播放音乐的方法<pre><audio id="music1" preload loop="loop">&l ...
随机推荐
-
『给它加个壳』纯MarkDown博客阅读体验优化
今天鼓捣了一天纯MarkDown书写的博客样式的美化,事实证明图表较多的MarkDown撰写的博文一样可以展现出非常漂亮的效果.为了让纯MarkDown书写的博客有一个干净舒服的阅读体验,我主要针对博 ...
-
指针与const
指向常量的指针,不能用于改变其所指对象的值. 指针的类型必须与所指对象的类型一致,但是有两个例外,第一种是允许令一个指向常量的指针指向一个非常量对象: double dra1 = 3.14; cons ...
-
chrome比较好用的网站整页(超长网页)截图插件
chrome比较好用的网站整页(超长网页)截图插件:fireshot capture 试用过比较好用
-
android studio 报ambiguous method call
如题,在android studio中调用this.toString时,提示的错误信息是ambiguous method call. both get class () in object and g ...
-
从Html5直播到互动直播,看直播协议的选择
目前,国内主流的直播协议有HLS.RTMP.HTTP FLV,适用于不同的直播场景. 一.HLS.RTMP与HTTP FLV 1.HLS HLS 全称是 HTTP Live Streaming, 是一 ...
-
python的argpare和click模块详解
一.argparse模块 1.模块说明 # argparse是python的标准库中用来解析命令行参数的模块,用来替代已经过时的optparse模块,argparse能够根据程序中的定义的sys.ar ...
-
HTML(五)选择器--伪类选择器
HTML代码 <body> <a href="www.baidu.com">www.baidu.com</a> </body> CS ...
-
kernel build command
Uboot: make ARCH=arm CROSS_COMPILE=${CC} distclean make ARCH=arm CROSS_COMPILE=${CC} am335x_evm_defc ...
-
[T-ARA][Falling U]
歌词来源:http://music.163.com/#/song?id=27506041 作词:韩尚元 [作词:韩尚元] 作曲:韩尚元 [作曲:韩尚元] Love is pain Love is pa ...
-
Win32 配置文件用法
#include "stdafx.h"#include <Shlobj.h>#include <Shlwapi.h> #pragma comment(lib ...