Aller au contenu

Audio

Découvrez comment insérer un fichier audio et créer de nombreuses actions : lancez la lecture automatique en arrière-plan, créez un lecteur sur-mesure, déclenchez une action à un temps précis, synchronisez votre son à un autre composant etc…

audio file component image

Insérer un fichier audio

Pour insérer un fichier audio, cliquez sur Media et importez votre fichier. Voici la liste des formats acceptés : .MP3 ; .WAV ; .WMA ; .AAC ; .M4A.

Pour l’ajouter dans votre application, vous pouvez l’insérer directement depuis vos medias ou insérer un composant Audio dans lequel vous changez la source.

Si vous souhaitez que votre audio soit accessible tout au long de l’application, insérez votre composant Audio au niveau du Projet.

Le composant Audio est un composant non graphique : il n’existe pas de lecteur audio par défaut. Vous pouvez simplement créer votre lecteur sur-mesure à l’aide de la synchronisation et du composant Zone de défilement. En savoir plus : Lecteur audio avec barre de progression.

Caractéristiques du composant

Propriétés

  • Lecture automatique : le fichier audio se lance automatiquement
  • En boucle : à la fin de la piste, l’audio recommence au début
  • Arrêt auto. à la lecture d’un nouvel audio
  • Début : définissez le début de votre son pour créer une piste spécifique. L’unité est la seconde.
  • Fin : définissez la fin de votre son pour créer une piste spécifique. L’unité est la seconde.
  • Volume : choisissez le volume par défaut (1 étant le volume initial de l’audio) et la plage de volume dans le cadre d’une synchronisation.
  • Vitesse : choisissez la vitesse par défaut (1 étant la vitesse initiale de l’audio) et la plage de vitesse dans le cadre d’une synchronisation.

Si vous avez un seul fichier audio que vous voulez décomposer en plusieurs pistes, au lieu de le découper en plusieurs fichiers via un logiciel externe, réutilisez plusieurs fois votre fichier et à chaque fois paramétrez le début et la fin de la piste

Liaison de données

Vous pouvez lier la propriété Source à une source de données pour changer dynamiquement le fichier audio lu. Cela vous permet de mettre à jour le contenu audio en fonction des données provenant de bases de données, d’API ou d’interactions utilisateur sans sélectionner manuellement un nouveau fichier.

Pour lier la source audio :

  1. Sélectionnez le composant Audio
  2. Dans le panneau Propriétés, localisez la propriété Source
  3. Cliquez sur l’icône de liaison à côté de Source
  4. Choisissez votre source de données et mappez-la à un champ audio

Les données liées doivent pointer vers une URL de fichier audio valide ou un identifiant de ressource.

Propriétés exposées

Le composant Audio expose les données suivantes qui peuvent être liées à d’autres composants :

  • Valeur courante : Le temps de lecture actuel en secondes (par ex. 15,5 pour 15,5 secondes écoulées)
  • Durée : La durée totale du fichier audio en secondes
  • En cours de lecture : Booléen indiquant si l’audio est en cours de lecture (true) ou non (false)

Ces propriétés sont utiles pour créer des lecteurs audio personnalisés avec des barres de progression, des affichages de temps ou des boutons lecture/pause qui reflètent l’état de lecture réel.

Déclencheurs

Sélectionnez votre audio et ajoutez une action. Voici la liste des événements déclencheurs disponibles :

  • Commence lecture
  • Mise en pause
  • Arrêt lecture
  • Fin lecture

Actions

Sélectionnez un événement déclencheur et choisissez l’action Agir sur un composant > Audio.

audio component actions

Choisissez parmi les actions suivantes :

  • Lecture/Pause
  • Commencer la lecture
  • Mettre en pause
  • Arrêter la lecture
  • Avancer
  • Reculer
  • Redémarrer au début
  • Mettre le volume
  • Augmenter le volume
  • Diminuer le volume
  • Mettre la vitesse
  • Augmenter la vitesse
  • Diminuer la vitesse

Attention de nombreux navigateurs web (Firefox, Chrome) bloquent les fichiers audio en lecture automatique quand ils se lancent sans interaction utilisateur. Pour en savoir plus : Lecture automatique et navigateurs web

Créer des marqueurs de temps

Pour déclencher une action à un temps précis, créez des marqueurs pour définir des temps sur votre fichier audio pour lesquels vous souhaitez associer des actions particulières.

Entrez dans le composant Audio et créez des marqueurs. Utilisez le lecteur audio pour parcourir l’audio et sélectionner le temps à marqueur.

creating markers for audio component

Une fois que vos marqueurs sont créés, ils deviennent disponibles dans la liste des déclencheurs.

audio trigger list

Synchroniser un audio avec un autre composant

Synchronisez votre audio avec n’importe quel autre composant (Minuteur, Audio, Galerie…). Vous pouvez synchroniser :

  • Temps
  • Volume
  • Vitesse
  • Marqueurs

Définissez ces paramètres depuis les propriétés du composant Synchronisation.

Mode silencieux sur iOS

Sur les appareils iOS (iPhone/iPad), le bouton physique de mode silencieux (situé sur le côté de l’appareil) peut empêcher la lecture du son, sauf si vous avez activé l’option Audio en arrière-plan.

Audio en arrière-plan

Dans les Propriétés du projet, vous pouvez activer l’option Audio en arrière-plan pour permettre à l’audio de continuer à jouer même lorsque l’utilisateur quitte temporairement l’application (sur mobile) ou navigue entre différentes scènes.

Ceci est utile pour maintenir une musique de fond ou un audio continu dans une application musicale, un guide audio ou un podcast.