Ionic — Cordova Media

Этот плагин позволяет нам записывать и воспроизводить аудиофайлы на устройстве.

Использование СМИ

Как и во всех других плагинах Cordova, первое, что нам нужно сделать, это установить его из окна командной строки.

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

Теперь мы готовы использовать плагин. В следующем примере кода src является исходным mp3-файлом, который мы будем использовать для этого урока. Он находится в папке js , но нам нужно добавить / android_asset / www / перед ним, чтобы его можно было использовать на устройствах Android.

Полная функциональность заключена в функцию $ ionicPlatform.ready (), чтобы гарантировать, что все загружается перед использованием плагина. После этого мы создаем объект мультимедиа с помощью метода newMedia (src) . Медиа- объект используется для добавления функций воспроизведения, паузы, остановки и отпускания.

Код контроллера

.controller('MyCtrl', function($scope, $ionicPlatform, $cordovaMedia) {
   $ionicPlatform.ready(function() {
      var src = "/android_asset/www/js/song.mp3";
      var media = $cordovaMedia.newMedia(src);

      $scope.playMedia = function() {
         media.play();
      };

      $scope.pauseMedia = function() {
         media.pause();
      };

      $scope.stopMedia = function() {
         media.stop();
      };

      $scope.$on('destroy', function() {
         media.release();
      });
   });
}

Мы также создадим три кнопки для вызова функций воспроизведения, паузы и остановки.

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

<button class = "button" ng-click = "pauseMedia()">PAUSE</button>

<button class = "button" ng-click = "stopMedia()">STOP</button>

Нам нужно запустить его на эмуляторе или мобильном устройстве, чтобы этот плагин работал. Когда пользователь нажмет на кнопку воспроизведения, song.mp3 начнет играть.

В приведенном выше примере вы можете видеть, что мы используем src в качестве параметра option. Есть и другие необязательные параметры, которые можно использовать для метода newMedia .

Необязательные параметры

В следующей таблице будут показаны все дополнительные параметры.

Следующая таблица покажет все доступные методы.

Доступные методы

В следующей таблице будут показаны все доступные методы.