Flash Mx 2004

Niveau I

tutorial 15/22

Jouer / arrêter du son

Fichier source jouer_musique.fla

Pour configurer votre interface de travail vous devez ouvrir ces panneaux: "menu du haut > Fenêtres"

Les outils à utiliser

Outil	Symbole	Descriptif	Raccourci
Le cercle		Trace un cercle seul ou un contour seul ou les deux à la fois selon que les options de couleur ou de contour sont activées. On peut remplir un ton uni ou dégradé. L'options "Alt" : le tracé s'effectue à partir du centre L'option "Maj/Shift" : le tracé est contraint à un cercle parfait ou un carré parfait	O

Créer un nouveau fichier depuis "Flash" "menu du haut > fichier > nouveau" A.S.2

Un nouveau document se crée en allant dans le "menu du haut > fichier > nouveau" ou "Ctrl+N"

Choisir le format de document ici "Flash" A.S. 2.0" qui signifie Action Script 2.0, le langage de programmation de "Flash", ainsi que A.S. 3.0 dernière génération.

Paramétrage du document

Au bas de l'interface par défaut nous avons un onglet propriétés (que l'on ouvre par le "menu du haut > fenêtre" s'il n'est pas ouvert).

Cet onglet "propriété" configure notre document de travail, taille en largeur, en hauteur, couleur de fond, vitesse de lecture des images. Nous allons régler notre document en 800 x 600 pixels, fond blanc, cadence de 25 images (frames) secondes. Nous allons enregistrer ces paramètres comme les paramètres par défaut à l'ouverture de "Flash".

Nous avons donc ici un document de 800 X 600 pixels, fond banc, débit de 25 images (frames) par secondes.

Créez un nouveau document dans flash.

I) Importer du son

Le fichier à importer "jouer_musique.mp3"

Flash est un logiciel d'animation et d'interactivité multimédia qui gère une multitude de formats: fichiers images, fichiers vidéo, fichiers sons...

Pour cet exercice nous allons importer un fichier de musique dans flash et créer deux boutons "play" et "stop" pour jouer ou stopper le son.

Dans un premier temps, il faut importer le fichier son dans flash : "menu du haut > Fichier > importer > importer dans la scène"

Le fichier à importer "jouer_musique.mp3"

Le fichier son n'apparaît pas dans notre scène. Cependant il est automatiquement placé dans la bibliothèque.

Pour déclarer le son dans la piste timeline, il faut d'abord choisir l'image clé à partir de laquelle on lance le son.

Pour notre exercice stop / play sound

1) nommer notre piste "calque1" par "son".

2) créer deux images clés à l'étape 1 et 2 de la timeline ou "menu du haut > insertion > scénario > image clé vide" ou encore "clic droit" sur l'étape 2 de la timeline puis "insérer une image clé vide", pour aller plus vite "F6" ajoute automatiquement une image clé.

3) cliquons sur l'image clé de l'étape 2 puis en bas de l'interface dans l'onglet "propriétés" apparaît un menu déroulant "son" où l'on retrouve tous les sons présents dans la bibliothèque.

II) Les boutons play / stop

Nous avons donc dans notre scène deux images clés dont la deuxième contient le son importé.

Nous savons que flash lance et lit automatiquement toutes les clé présentes dans une animation, ici pour notre exercice, si on lance l'animation la musique va se jouer toute seule hors le but de l'exercice est de lancer ou de couper la musique comme bon nous semble.

Si nous plaçons une action d'image (c'est à dire un code) dans la première image et que cette action indique de stopper, la lecture s'arrêtera à l'image clé 1 et le son ne se lancera pas puisqu'il est à l'image clé 2.

Répéter la même action d'image "stop" pour la clé 2, ainsi nous avons deux clé dans notre piste, la clé 1 vide qui contient l'action "stop" et la clé 2 qui contient le son et l'action "stop"

Le principe sera simple, à l'aide de boutons que nous allons créer, nous naviguerons de la clé 1 à la clé 2, l'une joue le son, l'autre ne joue pas le son ce qui revient à "play" et "stop" le son.

Créons donc un nouveau calque nommé "boutons" et créons une clé vide à l'étape deux.

Dessinons deux boutons, triangle pour le "play" dans l'image clé 1 et un carré pour le "stop" dans l'image clé 2.

Le bouton play (triangle) est placé dans l'image clé 1 du calque "boutons", le bouton stop (carré) est placé dans l'image clé 2 du calque "boutons".

Convertissons chacun de nos boutons en "symbole bouton" et nommons-les correctement.

Laissons nos boutons de côté pour le moment et occupons-nous des actions sur images clés.

III) Actions d'images

Nous voici donc avec nos deux pistes de deux images clés chacunes.

Piste "son"

Piste "son" image clé 1 vide; action d'image stop(); et stopAllSounds();

Piste "son" image clé 2 > jouer-musique.mp3 > action d'image stop();

Piste "boutons" image clé 1 > bouton play

Piste "boutons" image clé 2 > bouton stop

Le bouton "play" aura comme fonction "goto 2 and play"

Le bouton "stop" aura comme fonction "goto 1 and play"

Je vais à l'image 2 la musique se joue, je vais à l'image 1 la musique s'arrête. C'est cet aller et retour que nous allons commander avec les boutons.

Cette fois il ne s'agit plus de code que l'on place dans le panneau action d'une image clé mais bien dans le panneau action du bouton sélectionné.

Il y a ici deux types d'actions: les actions sur boutons et les actions sur images clés

III) Actions de boutons

C'est à présent sur les boutons cliqués que nous allons mettre nos actions

1) Sélectionner le bouton "play" de l'image clé 1 de la piste bouton puis panneau d'actions "F9"

Etape 1

Action sur Bouton "play"

on (release) { (quand la souris est relâchée)
gotoAndPlay(2); (va et joue l'image 2)
}

Action d'image

(stop); (arrête l'animation)
stopAllSounds(); (arrête le son)

L'animation se lance et s'arrête à l'étape 1 de la timeline (Action d'image (stop);) rien ne se joue (Action d'image stopAllSounds();), le bouton "play" est visible.

Je clique sur "play"

Etape 2

Action sur Bouton "stop"

on (release) { (quand la souris est relâchée)
gotoAndPlay(1); (va et joue l'image 1)
}

Action d'image

(stop); (arrête l'animation)

Le lecteur se déplace à l'étape 2 et s'arrête (Action d'image (stop);) lit le fichier jouer_musique.mp3 (présent dans l'image clé 2 de la piste "son") et le bouton stop a remplacé le bouton "play", le bouton "stop" visible peut arrêter la musique puisque son action est de retourner à l'étape 1 qui contient stopAllSounds();.

Plus d'infos sur les boutons, voir le tutorial "controler_temps.html".

"Ctrl + Alt + Entrée" pour une pré visualisation rapide.

Exporter l'animation

Menu du haut > Fichier > Exporter > Exporter l'animation ou "Ctrl + Maj/Shift + Alt + S