Lundi 20 octobre 2008Séance Flash 21 Séance Flash 2 ActionScript Cheikh DIEDHIOU Germain LEDRUT.

Présentation au sujet: "Lundi 20 octobre 2008Séance Flash 21 Séance Flash 2 ActionScript Cheikh DIEDHIOU Germain LEDRUT."— Transcription de la présentation:

1 Lundi 20 octobre 2008Séance Flash 21 Séance Flash 2 ActionScript Cheikh DIEDHIOU Germain LEDRUT

2 Lundi 20 octobre 2008Séance Flash 22 Interactivité, ActionScript  Flash permet, à terme, de créer une interface (web, par exemple) « évoluée » mais également des jeux ! Il nous donne ainsi l’occasion d’apporter de l’interactivité.  Qu’est-ce que l’ActionScript ? C’est est un langage de programmation qui joue un rôle essentiel pour la dynamique de l’animation.  A quoi sert l’ActionScript ? Gérer des actions, des animations des objets (clips) et de la scène Contrôler la tête de lecture (timeline) Lire des sons ou des vidéos Gérer les événements souris et clavier.

3 Lundi 20 octobre 2008Séance Flash 23 Où placer le code ActionScript ?

4 Lundi 20 octobre 2008Séance Flash 24 Où placer le code ActionScript ?  Sur l’occurrence d’un clip : onEnterFrame { ligne(s) d'instruction(s); }  Sur l’occurrence d’un bouton : on(press) (on(release)) { ligne(s) d'instruction(s); }  Exemple : bouton vers lien URL on(release){ getURL("http://www.google.fr",blank); }

5 Lundi 20 octobre 2008Séance Flash 25 Nommer ses occurrences ! On peut, après cela, appeler nos occurrences dans un script que l’on placera dans un calque à part : gauche.onPress=function(){ ligne(s) d’instruction(s); };

6 Lundi 20 octobre 2008Séance Flash 26 Exemple1 : Manipulation d’un clip  « Drag and Drop » Créer 2 calques (1 pour le clip et 1 pour le code) Créer un clip « disque » par exemple dans le calque clip Saisir le script suivant dans le calque code : disque.onPress=function(){ disque.startDrag(); } disque.onRelease=function(){ stopDrag(); }  Scripts équivalents : disque.onPress=function(){ this.startDrag(); } disque.onRelease=function(){ stopDrag(); } disque.onPress=function(){ startDrag("disque"); } disque.onRelease=function(){ stopDrag(); }

7 Lundi 20 octobre 2008Séance Flash 27 Le code - 1  Les variables : il en existe deux types ○ Les variables locales Elles ne sont connues qu'au niveau de l'animation var MaVarLocale = 3; ○ Les variables globales Elles sont connues à tous les niveaux de l'application _global.MaVarGlobale; MaVarGlobale=9;

8 Lundi 20 octobre 2008Séance Flash 28  Les structures conditionnelles ○ if : if ( ) [ else ] ○ Exemple : if (var == 1) play(); else stop(); Différents opérateurs disponibles : = = égalité != inégalité && ET logique || OU logique < inférieur à <= inférieur ou égal à Le code - 2

9 Lundi 20 octobre 2008Séance Flash 29  Les structures conditionnelles ○ switch : il est à utiliser pour remplacer plusieurs if switch(nombre){ case 1 : break; case 2 : break; … default : Le code - 3

10 Lundi 20 octobre 2008Séance Flash 210  Les boucles itératives ○ For : for(i=0;i<10;i++){ } Répète les instructions 10 fois ○ While : i=0; While(i<10){ i++; } Idem que pour le for mais avec la possibilité d'arrêter la boucle à tout moment en agissant sur le i. Le code - 4

11 Lundi 20 octobre 2008Séance Flash 211  Les fonctions : ○ Elles exécutent des instructions et son appelables à tout moment. Elles gèrent les paramètres. nom_fonction= function(param1,param2…) { return ; } ○ A la fin de son exécution, la fonction va renvoyer la valeur de l'expression1. Le code - 5

12 Lundi 20 octobre 2008Séance Flash 212 Principaux opérateurs a ++ Incrémentation a -- Décrémentation a && bAND logique a || bOR logique 2 * 4Multiplication 6 / 2Division 2 < 3Inférieur à 3 <= 3Inférieur ou égal à a = 4 Affectation (pour une variable ou dans une instruction) a == 4Égalité ( teste l’égalité. On l’utilise pour if par exemple) 3 != AInégalité Autres opérateurs : http://wiki.media-box.net/documentation/flash/operateurs

13 Lundi 20 octobre 2008Séance Flash 213 Hiérarchie des objets _root obj1obj3obj2 objA ( _root est la racine du document) obj1._parent  _root objA._parent  obj3

14 Lundi 20 octobre 2008Séance Flash 214 Référence relative/absolue  Référence relative : ○ Le chemin dépend du point de vue de l’objet obj3 : this  obj3 this._parent  _root objA : this  objA this._parent  obj3 _root obj1obj3obj2 objA

15 Lundi 20 octobre 2008Séance Flash 215 Référence relative/absolue  Référence absolue : ○ Le chemin est défini dans son intégralité Pour désigner obj3 : _root.obj3 Pour désigner objA : _root.obj3.objA  objA _root obj1obj3obj2 objA

16 Lundi 20 octobre 2008Séance Flash 216 Navigation  Se déplacer dans la timeline (au sein d’une séquence) play(); jouer la séquence stop(); stopper la séquence gotoAndPlay (x); aller à l’image x et jouer la suite gotoAndStop (x); aller à l’image x et stopper la séquence  Se déplacer entre les séquences gotoAndPlay (« s »,x); Aller à la frame x de la séquence s et jouer la suite.

17 Lundi 20 octobre 2008Séance Flash 217 Exemple 2 – Navigation (1/2)  Créer un calque avec une interpolation de mouvement  Créer un autre calque « code »  Créer un troisième calque « boutons » Insérer un bouton play, pause, stop, back, et forward (Bibliothèque – Composants – FLV Playback Custom UI) Les nommer (S’ils ne viennent pas de la bibliothèque, pensez à les convertir en symbole bouton)

18 Lundi 20 octobre 2008Séance Flash 218 Exemple 2 – Navigation (2/2) Dans « action », cliquez sur le calque « code » de la séquence  Tapez : onEnterFrame = function () { lecture.onPress = function() { play(); }; arret.onPress = function() { gotoAndStop(1); }; pause.onPress = function() { stop(); }; forward.onPress = function() { nextFrame(); }; back.onPress = function() { prevFrame(); }; Démonstration : Navigation entre séquences et vers un autre fichier swf

19 Lundi 20 octobre 2008Séance Flash 219 Paramètres d’un clip  Quelques paramètres : MonClip._x; Permet de gérer la coordonnée x d'une occurrence de clip (en pixels) MonClip._y; Permet de gérer la coordonnée y d'une occurrence de clip (en pixels) MonClip._width; Renvoie la largeur d'une occurrence de clip (en pixels) MonClip._height; Renvoie la hauteur d'une occurrence de clip (en pixels) MonClip._xscale; Permet d’élargir l’occurrence d’un clip suivant la coordonnée x (en %) MonClip._alpha; Permet de gérer l’opacité de l’occurrence d’un clip (en %) MonClip._visible; Détermine si l'occurrence du clip est masquée ou visible (valeur booléenne : 0 ou 1) MonClip._rotation; Permet de gérer le degré de rotation d'une occurrence de clip (-180° à +180°).

20 Lundi 20 octobre 2008Séance Flash 220 Exemple 3 - Input au clavier var vitesse:Number = 10; onEnterFrame = function () { if (Key.isDown(Key.LEFT)) { MonClip._x -= vitesse; } else if (Key.isDown(Key.RIGHT)) { MonClip._x += vitesse; } else if (Key.isDown(Key.UP)) { MonClip._y -= vitesse; } else if (Key.isDown(Key.DOWN)) { MonClip._y += vitesse; } };

21 Lundi 20 octobre 2008Séance Flash 221 Exemple 4 – Test de collision Créer deux symboles de noms différents dans un calque et un autre calque “code” Tapez : var departx:Number = nom1._x; var departy:Number = nom1._y; onEnterFrame = function () { nom1.onPress = function() { startDrag(nom1,false); }; nom1.onRelease = function() { if (nom1.hitTest(nom2)) { stopDrag(); } else{ stopDrag(); nom1._x=departx; nom1._y=departy; } };

22 Lundi 20 octobre 2008Séance Flash 222 Les sons Pour exploiter un son, il faut tout d’abord créer une variable de type Sound: myson = new Sound(); Il faut ensuite associer notre nouveau son à un symbole de type son stocké dans la bibliothèque: myson.attachSound("son_de_la_bibliothèque"); (sans oublier de lier le son dans la bibliotheque a l’actionscript!!) Ou associer notre son à un fichier externe en spécifiant un chemin absolu (sur internet par exemple avec une URL): myson.loadSound(http://www.monsite.com/son.mp3); On peut enfin démarrer la lecture: myson.start(); >peut être utilisé avec un nombre différent de paramètres … Pour stopper la lecture: myson.stop();

23 Lundi 20 octobre 2008Séance Flash 223 Exemple 5  Gérer le son Reprenez l’exemple précédent Importer le son “applause” dans la bibliothèque. Cliquez droit sur le son, « liaison », cocher « exporter pour actionscript » et lui donner « JT » comme indicateur. Insérer le code actionscript du prochain slide dans le calque « script ».

24 Lundi 20 octobre 2008Séance Flash 224 Exemple 5 (2/2) var son = new Sound(); son.attachSound("applause.mp3", false); Insérer dans la condition If du test de colision : son.start(); Copiez le code actionscript suivant dans le calque « script » :

25 Lundi 20 octobre 2008Séance Flash 225 Fin de la Séance Flash 2 ActionScript Merci de votre attention…