Ionic Native Audio
此插件用于向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 函数将在五秒后停止并卸载循环音频。
$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>
当我们点击播放按钮时,我们将听到一次声音,当我们点击循环按钮时,声音将循环五秒然后停止。此插件仅适用于模拟器或移动设备。