Ionic - Cordova Native Audio
Ta wtyczka służy do dodawania natywnych dźwięków do aplikacji Ionic.
Korzystanie z natywnego dźwięku
Aby móc korzystać z tej wtyczki, musimy ją najpierw zainstalować. Otwórz okno wiersza polecenia i dodaj wtyczkę Cordova.
C:\Users\Username\Desktop\MyApp>cordova plugin add cordova-plugin-nativeaudio
Zanim zaczniemy korzystać z tej wtyczki, będziemy potrzebować pliku audio. Dla uproszczenia uratujemy naszeclick.mp3 plik wewnątrz js folder, ale możesz go umieścić w dowolnym miejscu.
Następnym krokiem jest wstępne załadowanie pliku audio. Dostępne są dwie opcje:
preloadSimple - Służy do prostych dźwięków, które zostaną odtworzone raz.
preloadComplex - To jest dla dźwięków, które będą odtwarzane jako dźwięki zapętlone lub dźwięk w tle.
Dodaj następujący kod do kontrolera, aby wstępnie załadować plik audio. Musimy się upewnić, że platforma Ionic jest załadowana, zanim będziemy mogli wstępnie załadować plik audio.
Kod kontrolera
$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);
});
});
W tym samym kontrolerze dodamy kod do odtwarzania dźwięku. Nasz$timeout funkcja zatrzyma zapętlony dźwięk po pięciu sekundach.
$scope.playAudio = function () {
$cordovaNativeAudio.play('click');
};
$scope.loopAudio = function () {
$cordovaNativeAudio.loop('click');
$timeout(function () {
$cordovaNativeAudio.stop('click');
$cordovaNativeAudio.unload('click');
}, 5000);
}
Ostatnią rzeczą, której potrzebujemy, jest utworzenie przycisków do odtwarzania i zapętlania dźwięku.
Kod HTML
<button class = "button" ng-click = "playAudio()">PLAY</button>
<button class = "button" ng-click = "loopAudio()">LOOP</button>
Kiedy stukniemy w przycisk odtwarzania, usłyszymy dźwięk raz, a kiedy dotkniemy przycisku pętli, dźwięk będzie się powtarzał przez pięć sekund, a następnie zatrzyma się. Ta wtyczka działa tylko na emulatorze lub urządzeniu mobilnym.