Expo's Audio API

In looking up ways to implement audio to a react native app I am making, I found that expo has an API that allows playback and recording of audio. I am using it for strictly playing sound effects during certain actions in a small game but There quite extensive recording options among others that this API offers. This API also has video features but that is for another blog.

Installation

expo install expo-av

In components:

import { Audio } from 'expo-av';

There are also configurations for iOS and Andriod which you can see here: https://github.com/expo/expo/tree/master/packages/expo-av

Usage for Playing Sounds

To play sounds you need to set an object to Audio.sound which represents a sound tied to an asset sound file or url.

const soundObject = new Audio.Sound();

There are also parameters:

• source (object / number / Asset): Source of the sound.
• initialStatus (PlaybackStatusToSet): The initial PlaybackStatusToSet of the sound
• onPlaybackStatusUpdate (function): A function taking a single parameter PlaybackStatus.
• downloadFirst (boolean): Default value true, and when true, the system will attempt to download the resource to the device before loading.

const soundObject = new Audio.Sound();
soundObject.setOnPlaybackStatusUpdate(onPlaybackStatusUpdate);
await soundObject.loadAsync(source, initialStatus, downloadFirst);

This example creates and loads a sound from source, with optional initialStatus, onPlaybackStatusUpdate, and downloadFirst.

Returns:

A Promise that is rejected if creation failed, or fulfilled with the following dictionary if creation succeeded:

• sound : the newly created and loaded Sound object.
• status : the PlaybackStatus of the Sound object.

try {
  const { sound: soundObject, status } = await Audio.Sound.createAsync(
    require('./assets/sounds/hello.mp3'),
    { shouldPlay: true }
  );

There are far more which you can see here: https://docs.expo.io/versions/latest/sdk/audio/

Usage for Recording Sounds

After creating an instance of this class, prepareToRecordAsync must be called in order to record audio. Once recording is finished, call stopAndUnloadAsync. Audio recording permissions must also given for recording. Set an object to Audio.Recording

const recording = new Audio.Recording();
try {
  await recording.prepareToRecordAsync(Audio.RECORDING_OPTIONS_PRESET_HIGH_QUALITY);
  await recording.startAsync();
  // You are now recording!

Returns:

A Promise that is resolved with the status of the Recording: a dictionary with the following key-value pairs.Before prepareToRecordAsync is called, the status will be as follows:

• canRecord : a boolean set to false.
• isDoneRecording : a boolean set to false.

After prepareToRecordAsync() is called, but before stopAndUnloadAsync() is called, the status will be as follows:

• canRecord : a boolean set to true.
• isRecording : a boolean describing if the Recording is currently recording.
• durationMillis : the current duration of the recorded audio.

After stopAndUnloadAsync() is called, the status will be as follows:

• canRecord : a boolean set to false.
• isDoneRecording : a boolean set to true. = durationMillis : the final duration of the recorded audio.

This is just a glimpse of the various features. With recording options, you can go much more in-depth and customize bit rate, quality etc.

References

• https://docs.expo.io/versions/latest/sdk/audio/
• https://docs.expo.io/versions/v39.0.0/sdk/av/
• https://github.com/expo/expo/tree/master/packages/expo-av