Ionic-native-audio
提供:Dev Guides
イオン-Cordova Native Audio
このプラグインは、Ionicアプリにネイティブオーディオサウンドを追加するために使用されます。
ネイティブオーディオの使用
このプラグインを使用できるようにするには、まずインストールする必要があります。 コマンドプロンプトウィンドウを開き、Cordovaプラグインを追加します。
C:\Users\Username\Desktop\MyApp>cordova plugin add cordova-plugin-nativeaudio
このプラグインの使用を開始する前に、オーディオファイルが必要です。 簡単にするために、 click .mp3 ファイルを *js フォルダー内に保存しますが、好きな場所に配置できます。
次のステップは、オーディオファイルをプリロードすることです。 利用可能な2つのオプションがあります-
- preloadSimple -一度再生される単純なサウンドに使用されます。
- preloadComplex -ループサウンドまたはバックグラウンドオーディオとして再生されるサウンド用です。
次のコードをコントローラーに追加して、オーディオファイルをプリロードします。 オーディオファイルをプリロードする前に、Ionicプラットフォームがロードされていることを確認する必要があります。
コントローラコード
$ionicPlatform.ready(function() {
$cordovaNativeAudio
.preloadSimple('click', 'js/click.mp3')
.then(function (msg) {
console.log(msg);
}, function (error) {
console.log(error);
});
$cordovaNativeAudio.preloadComplex('click', 'js/click.mp3', 1, 1)
.then(function (msg) {
console.log(msg);
}, function (error) {
console.error(error);
});
});
同じコントローラーで、オーディオを再生するためのコードを追加します。 $ timeout 関数は、5秒後にループオーディオを停止およびアンロードします。
$scope.playAudio = function () {
$cordovaNativeAudio.play('click');
};
$scope.loopAudio = function () {
$cordovaNativeAudio.loop('click');
$timeout(function () {
$cordovaNativeAudio.stop('click');
$cordovaNativeAudio.unload('click');
}, 5000);
}
最後に必要なことは、オーディオを再生およびループするためのボタンを作成することです。
HTMLコード
<button class = "button" ng-click = "playAudio()">PLAY</button>
<button class = "button" ng-click = "loopAudio()">LOOP</button>
再生ボタンをタップすると、サウンドが1回聞こえ、ループボタンをタップすると、サウンドが5秒間ループして停止します。 このプラグインは、エミュレーターまたはモバイルデバイスでのみ機能します。