Ionic - Âm thanh gốc Cordova

Plugin này được sử dụng để thêm âm thanh gốc vào ứng dụng Ionic.

Sử dụng âm thanh gốc

Để có thể sử dụng plugin này, trước tiên chúng ta cần cài đặt nó. Mở cửa sổ nhắc lệnh và thêm plugin Cordova.

C:\Users\Username\Desktop\MyApp>cordova plugin add cordova-plugin-nativeaudio

Trước khi bắt đầu sử dụng plugin này, chúng tôi sẽ cần tệp âm thanh. Để đơn giản, chúng tôi sẽ tiết kiệmclick.mp3 tập tin bên trong js nhưng bạn có thể đặt nó ở bất cứ đâu bạn muốn.

Bước tiếp theo là tải trước tệp âm thanh. Có hai tùy chọn có sẵn, đó là -

• preloadSimple - Nó được sử dụng cho các âm thanh đơn giản sẽ được phát một lần.

• preloadComplex - Nó dành cho các âm thanh sẽ được phát dưới dạng âm thanh lặp lại hoặc âm thanh nền.

Thêm mã sau vào bộ điều khiển của bạn để tải trước tệp âm thanh. Chúng tôi cần đảm bảo rằng nền tảng Ionic đã được tải trước khi chúng tôi có thể tải trước tệp âm thanh.

Mã điều khiển

$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);
   });
});

Trong cùng một bộ điều khiển, chúng tôi sẽ thêm mã để phát âm thanh. Của chúng tôi$timeout chức năng sẽ dừng và không tải âm thanh lặp lại sau năm giây.

$scope.playAudio = function () {
   $cordovaNativeAudio.play('click');
};

$scope.loopAudio = function () {
   $cordovaNativeAudio.loop('click');

   $timeout(function () {
      $cordovaNativeAudio.stop('click');
      $cordovaNativeAudio.unload('click');
   }, 5000);
}

Điều cuối cùng chúng ta cần là tạo các nút để phát và lặp lại âm thanh.

Mã HTML

<button class = "button" ng-click = "playAudio()">PLAY</button>

<button class = "button" ng-click = "loopAudio()">LOOP</button>

Khi chúng ta nhấn vào nút phát, chúng ta sẽ nghe thấy âm thanh một lần và khi chúng ta nhấn vào nút lặp, âm thanh sẽ lặp lại trong năm giây và sau đó dừng lại. Plugin này chỉ hoạt động trên trình giả lập hoặc thiết bị di động.