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) 方法创建 media 对象。media 对象用于添加播放、暂停、停止和释放功能。

控制器代码

.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 作为选项参数。 newMedia 方法还有其他可选参数可用。

可选参数

下表将显示所有可用的可选参数。

参数 类型 详细信息
mediaSuccess function 在当前播放/录制或停止操作完成后调用。
mediaError function 当出现错误。
mediaStatus function 调用以显示状态更改。

下表将显示所有可用的方法。

可用的方法

下表将显示所有可用的方法。

方法 参数 详细信息
newMedia(parameter1) src 返回将用于未来方法的媒体对象。 src 是音频内容的 URI。
getCurrentPosition / 返回音频文件中的当前位置。
getDuration / 返回音频文件的持续时间。
play / 用于开始或恢复播放。
pause / 用于暂停播放。
stop / 用于停止播放。
release / 用于释放音频资源。
seekTo(parameter1) milliseconds 用于设置播放位置(以毫秒为单位)。
setVolume(parameter1) volume 用于更改音量。范围从 0 到 1
startRecord() / 用于开始录制。
stopRecord / 用于停止录制。