Audio

Insert an audio file and add all kinds of actions related to audio: auto play in the background, create a custom player, trigger an action at a specific time, synchronize your audio to another component, etc.

Insert an audio file

To insert an audio file, import it in the Media window. Here is the list of accepted formats: .MP3; .WAV; .WMA; .AAC; .M4A.

To add it into your app, you can add it directly or insert an Audio component and choose this file as source.

Insert an Audio component and add an audio file in Source. You can also add an audio file directly in your screen: an Audio component is automatically created.

💡 To keep your audio file throughout the application (background audio), insert your Audio component at the Project level.

The Audio component is a non-graphical component. You can create a custom player using the synchronization and the Scrolling Area component. Learn more: Create audio player with progress bar

Properties of the Audio component

Here are the properties of the Audio component:

Auto play: when the screen/status is displayed, the audio file starts automatically
Loop mode: at the end of the track, the audio starts again
Auto stop on playback of new audio
Start/End: set the start and end of your audio to create a specific track. The unit is seconds.
Volume: choose the default volume (1 being the initial volume of the audio) and the volume range as part of a sync.
Speed: choose the default speed (1 being the initial speed of the audio) and the speed range within a sync.

💡 If you have a single audio file that you want to split into several tracks, instead of splitting it into several files via an external software, reuse your file several times and each time set the beginning and end of the track.

Actions of the Audio component

Select a trigger and choose the Interact with a component > Audio.

Here are the actions of the Audio component:

Play/Pause
Play
Pause
Stop
Forward
Rewind
Restart from beginning
Set volume
Increase volume
Decrease volume
Set rate
Increase rate
Decrease rate

Trigger an action related to audio

Select your audio and add an action. Here is the list of available triggers:

Starting play
Pause playing
Stopping play
Finish playing

Create markers of time

To trigger an action at a specific time, create markers to define times on your audio file for which you want to associate particular actions.

Enter the Audio component and create markers. Use the audio player to browse the audio and select the time to mark.

Once your markers are created, they become available in the list of triggers.

⚠️ Beware that many web browsers (Firefox, Chrome) block autoplay audio files when they start without user interaction. Learn more: Autoplay Blocking in Web Browser

Synchronize audio with another component

Synchronize your audio with any other component (Timer, Audio, Gallery...). You can synchronize :

Time
Volume
Speed
Markers

Define these parameters from the properties of the Synchronization component.