Cordova - 媒體

Cordova 媒體外掛用於在 Cordova 應用程式中錄製和播放音訊聲音。

步驟 1 - 安裝媒體外掛

可以透過在**命令提示符**視窗中執行以下程式碼來安裝媒體外掛。

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

步驟 2 - 新增按鈕

在本教程中，我們將建立一個簡單的音訊播放器。讓我們在**index.html**中建立所需的按鈕。

<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>

步驟 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);

步驟 4A - 播放函式

我們將要新增的第一個函式是**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();
}

我們可以點選**播放**按鈕從**src**路徑開始播放鋼琴音樂。

步驟 4B - 暫停和停止函式

我們需要新增的下一個函式是**pauseAudio**和**stopAudio**。

function pauseAudio() {
   if(myMedia) {
      myMedia.pause();
   }
}

function stopAudio() {
   if(myMedia) {
      myMedia.stop(); 
   }
   myMedia = null;
}

現在我們可以透過點選**暫停**或**停止**按鈕來暫停或停止鋼琴聲音。

步驟 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);
   }
}

按下**音量增大**或**音量減小**後，我們可以將音量值更改**0.1**。

下表顯示了此外掛提供的其他方法。