Skip to main content

Audio Recording

This action allows users to record audio. Using this action, you can add functionalities like recording voice notes in a note-taking app or practicing pronunciation in a language app.

Types of audio recording action​

Following are the types of audio recording actions you can trigger:

  1. Start Audio Recording: This starts the recording. It also provides a name to the recording, which you can use later to stop the recording using the "Stop Audio Recording" action.
  2. Stop Audio Recording: This halts the ongoing recording using the name from the "Start Audio Recording" action. To capture and play the recorded audio, make sure to specify the Action Output Variable Name, which can be used with the audio player.

Start Audio Recording [Action]​

Follow the steps below to start the recording:

  1. Select the widget (e.g., Button, Page, etc.) on which you want to add the action.
  2. Select Actions from the Properties panel (the right menu), and click Open. This will open an Action Flow Editor in a new popup window.
  3. Click on the + Add Action.
  4. First, request permission for the microphone.
  5. Inside the TRUE section, add the Start Audio Recording (under Utilities) action.
  6. By default, the Name is set to any random string. However, you can change it to any friendly name.
  7. Optional: After starting recording, you might want to update the state variables to reflect changes on UI. For instance, you can enable/disable buttons or start recording animations to provide a visual cue of the ongoing process. This step allows you to enhance the user experience and provide real-time feedback during the recording.

Stop Audio Recording [Action]​

Follow the steps below to stop the recording:

  1. Select the widget (e.g., Button, Page, etc.) on which you want to add the action.
  2. Select Actions from the Properties panel (the right menu), and click Open. This will open an Action Flow Editor in a new popup window.
  3. Click on the + Add Action.
  4. Search and select the Stop Audio Recording (under Utilities) action.
  5. Choose the Recorder Name from the dropdown. This will be the name you provided in the "Start Audio Recording" action.
  6. Specify the Action Output Variable Name. This will store the actual audio recording, which you can use with any audio player. It stores recording in an Audio Path data type.
  7. To upload the audio recording to Firebase or Supabase, you can use the Upload file action. When you add this action:
    1. Set the Upload Type to the preferred one.
    2. Set File Type to Uploaded File because the Stop Audio Recording action internally stores recorded audio bytes (inside widget state).
    3. Set the File to Upload to Widget State > [action_output_variable_name]Bytes.
  8. For uploading via API, you don't need to add the Upload file action. Just directly add the API call and select the API that will upload the file to your server. Note that the request body for this API must be in Multipart format. You can pass the audio recording via Widget State > [action_output_variable_name]Bytes in the API variable. See how to configure an API for the multipart request body.
  9. Optional: After stopping the recording, you might want to update the state variables to reflect changes on the UI. For instance, you can enable/disable buttons or stop recording animations.
tip

It's always a good idea to have a fail-safe mechanism to ensure recordings are properly stopped, even if the user forgets to do so manually. For instance, you can trigger this action when the user closes the app without explicitly stopping it.

Playing audio recording​

After you have stopped the recording, you can simply provide the Action Output Variable Name to the Audio Player widget to start playing the recorded audio.

warning

Currently, recording audio isn't supported in Run or Test modes due to certain limitations. However, for Android and iOS platforms, you can test by downloading the code and following the instructions provided here.

Here's how you do it.