Awesome

Capacitor Native Audio Plugin

Capacitor plugin for native audio engine. Capacitor v6 - ✅ Support!

Click on video to see example 💥

Maintainers

Preparation

All audio place in specific platform folder

Andoid: android/app/src/assets

iOS: ios/App/App/sounds

Web: assets/sounds

Installation

To use npm

npm install @capacitor-community/native-audio

To use yarn

yarn add @capacitor-community/native-audio

Sync native files

npx cap sync

On iOS, Android and Web, no further steps are needed.

Configuration

No configuration required for this plugin. <docgen-config>

Supported methods

Usage

Example repository

import {NativeAudio} from '@capacitor-community/native-audio'


/**
 * This method will load more optimized audio files for background into memory.
 * @param assetPath - relative path of the file or absolute url (file://)
 *        assetId - unique identifier of the file
 *        audioChannelNum - number of audio channels
 *        isUrl - pass true if assetPath is a `file://` url
 * @returns void
 */
NativeAudio.preload({
    assetId: "fire",
    assetPath: "fire.mp3",
    audioChannelNum: 1,
    isUrl: false
});

/**
 * This method will play the loaded audio file if present in the memory.
 * @param assetId - identifier of the asset
 * @param time - (optional) play with seek. example: 6.0 - start playing track from 6 sec
 * @returns void
 */
NativeAudio.play({
    assetId: 'fire',
    // time: 6.0 - seek time
});

/**
 * This method will loop the audio file for playback.
 * @param assetId - identifier of the asset
 * @returns void
 */
NativeAudio.loop({
  assetId: 'fire',
});


/**
 * This method will stop the audio file if it's currently playing.
 * @param assetId - identifier of the asset
 * @returns void
 */
NativeAudio.stop({
  assetId: 'fire',
});

/**
 * This method will unload the audio file from the memory.
 * @param assetId - identifier of the asset
 * @returns void
 */
NativeAudio.unload({
  assetId: 'fire',
});

/**
 * This method will set the new volume for a audio file.
 * @param assetId - identifier of the asset
 *        volume - numerical value of the volume between 0.1 - 1.0
 * @returns void
 */
NativeAudio.setVolume({
  assetId: 'fire',
  volume: 0.4,
});

/**
 * this method will get the duration of an audio file.
 * only works if channels == 1
 */
NativeAudio.getDuration({
  assetId: 'fire'
})
.then(result => {
  console.log(result.duration);
})

/**
 * this method will get the current time of a playing audio file.
 * only works if channels == 1
 */
NativeAudio.getCurrentTime({
  assetId: 'fire'
});
.then(result => {
  console.log(result.currentTime);
})

/**
 * This method will return false if audio is paused or not loaded.
 * @param assetId - identifier of the asset
 * @returns {isPlaying: boolean}
 */
NativeAudio.isPlaying({
  assetId: 'fire'
})
.then(result => {
  console.log(result.isPlaying);
})

API

configure(...)

configure(options: ConfigureOptions) => Promise<void>

preload(...)

preload(options: PreloadOptions) => Promise<void>

play(...)

play(options: { assetId: string; time?: number; }) => Promise<void>

pause(...)

pause(options: { assetId: string; }) => Promise<void>

resume(...)

resume(options: { assetId: string; }) => Promise<void>

loop(...)

loop(options: { assetId: string; }) => Promise<void>

stop(...)

stop(options: { assetId: string; }) => Promise<void>

unload(...)

unload(options: { assetId: string; }) => Promise<void>

setVolume(...)

setVolume(options: { assetId: string; volume: number; }) => Promise<void>

getCurrentTime(...)

getCurrentTime(options: { assetId: string; }) => Promise<{ currentTime: number; }>

Returns: <code>Promise<{ currentTime: number; }></code>

getDuration(...)

getDuration(options: { assetId: string; }) => Promise<{ duration: number; }>

Returns: <code>Promise<{ duration: number; }></code>

isPlaying(...)

isPlaying(options: { assetId: string; }) => Promise<{ isPlaying: boolean; }>

Returns: <code>Promise<{ isPlaying: boolean; }></code>

addListener('complete', ...)

addListener(eventName: 'complete', listenerFunc: (event: { assetId: string; }) => void) => Promise<PluginListenerHandle>

Listen for asset completed playing event

Returns: <code>Promise<<a href="#pluginlistenerhandle">PluginListenerHandle</a>></code>

Since: 5.0.1

Interfaces

ConfigureOptions

PreloadOptions

PluginListenerHandle