cordova - Cordova多媒体 - cordova教程 , 学习cordova , cordova android , cordova ios



  • Cordova 媒体插件用来录制和 Cordova 应用程序播放音频声音。
cordova教程 - cordova - 
学习cordova - Cordova Architecture plugins -  apache cordova代码- apache cordova的例子
Wikitechy cordova tutorial tags - apache cordova , cordova教程 , 学习cordova , cordova android , cordova ios , cordova plugin add , cordova android studio , phonegap android , phonegap ios , cordova下载 , apache cordova是什么 , cordova plugin开发 , apache cordova教程 , cordova 教程 , cordova插件开发 , cordova菜鸟教程 , 菲律宾cordova岛 , cordova 持续定位

第1步 - 安装插件媒体

  • 媒体插件可以通过在命令提示符窗口中执行下面的代码安装。

C:\Users\username\Desktop\CordovaProject>cordova plugin add cordova-plugin-media

第2步 - 添加按钮

  • 本教程中,我们将创建一个简单的音频播放。我们创建一个按钮在 index.html 文件中。
cordova教程 - cordova - 
Cordova媒体 - 
cordova plugin -Cordova文件系统 - Cordova plugin 生成 -  
- Cordova文件传输 - apache cordova的例子
<button id = "playAudio">PLAY</button>
<button id = "pauseAudio">PAUSE</button>
<button id = "stopAudio">STOP</button>
<button id = "volumeUp">VOLUME UP</button>
<button id = "volumeDown">VOLUME DOWN</button>
Clicking "Copy Code" button will copy the code into the clipboard - memory. Please paste(Ctrl+V) it in your destination. The code will get pasted. Happy coding from Wikitechy cordova tutorial team

第3步 - 添加事件监听器

  • 现在,我们需要为按钮添加事件侦听器在文件 index.js 中的 onDeviceReady 函数内。
document.getElementById("playAudio").addEventListener("click", playAudio);
document.getElementById("pauseAudio").addEventListener("click", pauseAudio);
document.getElementById("stopAudio").addEventListener("click", stopAudio);
document.getElementById("volumeUp").addEventListener("click", volumeUp);
document.getElementById("volumeDown").addEventListener("click", volumeDown);
Clicking "Copy Code" button will copy the code into the clipboard - memory. Please paste(Ctrl+V) it in your destination. The code will get pasted. Happy coding from Wikitechy cordova tutorial team

步骤4A - 播放功能

cordova教程 - cordova - 
学习cordova - 
cordova plugin - apache cordova
媒体 - Cordova plugin 生成 -  
- apache cordova代码- apache cordova的例子

cordova教程 - cordova - 学习cordova - cordova plugin - apache cordova 媒体 - apache cordova网址访问 - Cordova plugin 生成 - - apache cordova代码- apache cordova的例子

  • 我们要添加的第一个函数是 playAudio。我们定义myMedia 在函数之外是因为我们希望在将要在以后添加的函数可以使用它(暂停,停止,音量增加和音量减小)。此代码放置在 index.js 文件中。
var myMedia = null;

function playAudio() {
   var src = "/android_asset/www/audio/piano.mp3";

   if(myMedia === null) {
      myMedia = new Media(src, onSuccess, onError);

      function onSuccess() {
         console.log("playAudio Success");
      }

      function onError(error) {
         console.log("playAudio Error: " + error.code);
      }

   }

   myMedia.play();
}
Clicking "Copy Code" button will copy the code into the clipboard - memory. Please paste(Ctrl+V) it in your destination. The code will get pasted. Happy coding from Wikitechy cordova tutorial team
  • 我们点击 PLAY 按钮,开始由在 src 指定的路径播放钢琴音乐。
Wikitechy cordova tutorial tags - apache cordova , cordova教程 , 学习cordova , cordova android , cordova ios , cordova plugin add , cordova android studio , phonegap android , phonegap ios , cordova下载 , apache cordova是什么 , cordova plugin开发 , apache cordova教程 , cordova 教程 , cordova插件开发 , cordova菜鸟教程 , 菲律宾cordova岛 , cordova 持续定位

步骤4B - 暂停和停止函数功能

  • 我们所需要的下一个函数是pauseAudio 和 stopAudio
function pauseAudio() {
   if(myMedia) {
      myMedia.pause();
   }
}

function stopAudio() {
   if(myMedia) {
      myMedia.stop(); 
   }
	
   myMedia = null;
}
Clicking "Copy Code" button will copy the code into the clipboard - memory. Please paste(Ctrl+V) it in your destination. The code will get pasted. Happy coding from Wikitechy cordova tutorial team
cordova教程 - cordova - 
学习cordova - 
cordova plugin - apache cordova
媒体 - Cordova plugin 生成 -  
- apache cordova代码- apache cordova的例子

cordova教程 - cordova - 学习cordova - cordova plugin - apache cordova 媒体 - apache cordova网址访问 - Cordova plugin 生成 - - apache cordova代码- apache cordova的例子

  • 现在,我们可以暂停或通过单击暂停或停止按钮来停止钢琴的声音。
Wikitechy cordova tutorial tags - apache cordova , cordova教程 , 学习cordova , cordova android , cordova ios , cordova plugin add , cordova android studio , phonegap android , phonegap ios , cordova下载 , apache cordova是什么 , cordova plugin开发 , apache cordova教程 , cordova 教程 , cordova插件开发 , cordova菜鸟教程 , 菲律宾cordova岛 , cordova 持续定位

步骤4C - 音量函数功能

  • 要设置音量,我们可以使用 setVolume 方法。此方法需要使用参数值是从0到1。设置初值为0.5。
var volumeValue = 0.5;

function volumeUp() {
   if(myMedia && volumeValue < 1) {
      myMedia.setVolume(volumeValue += 0.1);
   }
}

function volumeDown() {
   if(myMedia && volumeValue > 0) {
      myMedia.setVolume(volumeValue -= 0.1);
   }
} 
Clicking "Copy Code" button will copy the code into the clipboard - memory. Please paste(Ctrl+V) it in your destination. The code will get pasted. Happy coding from Wikitechy cordova tutorial team
  • 当按 VOLUME UP 或 VOLUME DOWN 就可以通过改变音量0.1的值。
  • 该插件提供如下表显示的其它方法。
方法 详细
getCurrentPosition
返回音频的当前位置
getDuration
返回一个音频的持续时间
play
用于开始或恢复音频
pause
用于暂停音频
release
发布底层操作系统的音频资源
seekTo
用于改变音频的位置
setVolume
用于音频设置音量
startRecord
开始录制音频文件
stopRecord
停止录制音频文件
stop
停止播放音频文件

wikitechy provides you the following points such as cordova , cordova教程 , 学习cordova , cordova android , cordova ios , cordova plugin add , cordova android studio , phonegap android , phonegap ios , cordova api , cordova-android , phonegap cordova , cordova plugin , cordova下载 , apache cordova是什么 , cordova cli , cordova plugin开发 , apache cordova教程 , cordova 教程 , vue cordova , ngcordova , ionic cordova , cordova plugin file , cordova 安装 , ionic 会取代cordova么 , cordova怎么样 , cordova插件开发 ,cordova菜鸟教程 , cordova react , cordova ionic vuejs , 菲律宾cordova岛 , cordova 持续定位 , phonegap , cordoba , cordova plugins , cardova , apache cordova , cordova phonegap , ionic cordova phonegap , apache cordova alternatives , cordova for visual studio , best ide for cordova development , create cordova plugin android , cordova ios 4 , apache cordova download , cordova build command , cordova web support , cordova webview android , how to install cordova , phonegap developer , apache cordova ionic , cordova command

Related Searches to Cordova多媒体