Ionic-Cordova 네이티브 오디오

이 플러그인은 Ionic 앱에 네이티브 오디오 사운드를 추가하는 데 사용됩니다.

네이티브 오디오 사용

이 플러그인을 사용하려면 먼저 설치해야합니다. 명령 프롬프트 창을 열고 Cordova 플러그인을 추가하십시오.

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

이 플러그인을 사용하기 전에 오디오 파일이 필요합니다. 단순성을 위해 우리는click.mp3 내부 파일 js 폴더에 있지만 원하는 곳에 둘 수 있습니다.

다음 단계는 오디오 파일을 미리로드하는 것입니다. 사용 가능한 두 가지 옵션이 있습니다.

  • 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>

재생 버튼을 탭하면 소리가 한 번 들리고 루프 버튼을 탭하면 소리가 5 초 동안 반복 된 다음 중지됩니다. 이 플러그인은 에뮬레이터 또는 모바일 장치에서만 작동합니다.