Gaëtan MARANZANA SI28-A04 Flash MX DEUXIEME EXPOSE.

Présentation au sujet: "Gaëtan MARANZANA SI28-A04 Flash MX DEUXIEME EXPOSE."— Transcription de la présentation:

1 Gaëtan MARANZANA SI28-A04 Flash MX DEUXIEME EXPOSE

2 Gaëtan MARANZANA SI28-A042 ActionScript Pourquoi du code? ActionScript permet d’ajouter de l’interactivité aux animations. Il est possible d’utiliser Flash sans ActionScript, mais l’interactivité des animations sera très limitée.

3 Gaëtan MARANZANA SI28-A043 Réalisation d’un exemple

4 Gaëtan MARANZANA SI28-A044 Ou Placer le code ? Dans les Frames du scénario. –Il est conseillé d’utiliser un calque ‘actions’ dans lequel seront placées toute les actions du scénario. Dans un clip ou dans un bouton –Grâce à un gestionnaire d’événement.

5 Gaëtan MARANZANA SI28-A045 Écriture du code Panneau Actions Attention à respecter la syntaxe et à ne pas utiliser les mots réservés Exemple : var play=0; // l’initialisation de cette variable est incorrecte : le mot « play » est réservé par flash. Boite à outils ActionsNavigateur de scriptFenêtre de script

6 Gaëtan MARANZANA SI28-A046 Éléments de syntaxe --(décrémentation) ++ (incrémentation) != (inégalité) && (AND logique) || (OR logique) * (multiplication) / (division) : (type) // (délimiteur de commentaires) /*(délimiteur de commentaires) {} (initialisateur d'objet) < (inférieur à) <= (inférieur ou égal à) = (affectation) == (égalité) Exemple : If((a==0 || b!=1)&& c<=4){ /*Script à exécuter si les conditions sont validées*/ a=1; b++; d=this._parent._parent._x; gotoAndPlay(nextFrame); } else …

7 Gaëtan MARANZANA SI28-A047 Les Variables Une variable permet de stocker des informations de différents types : –Expressions math = 2 + 2;  math = 4; Flash créé une variable appelée 'math' et lui assigne la valeur 4. –Chaînes math = "2 + 2"; Flash créé une variable appelée 'math' et lui assigne la chaîne de caractères '2+2‘. –Variables Booléennes testA = true; testB = false;

8 Gaëtan MARANZANA SI28-A048 Variables : suite Il existe deux types de variables, les variables globales qui sont accessibles à tous les niveaux et les variables locales qui ne sont accessibles directement que dans le même niveau. Variables globale : _global.mavariable1= 28; Variables locales : var mavariable2=30; Récupérer une variable locale : insérer le chemin relatif devant la variable à récupérer : mavariable3=this._parent.mavariable2;

9 Gaëtan MARANZANA SI28-A049 Création des yeux Il s’agit de faire subir un mouvement de rotation à la pupille. –Utilisation d’un gestionnaire d’événement –Position du pointeur –Fonctions Mathématiques Création d’un clip ‘œil’ contenant : –Un clip ‘paupière’ –Un clip ‘pupille’ –Un élément graphique ‘blanc’ Télécharger le fichier de travail

10 Gaëtan MARANZANA SI28-A0410 Utilisation de gestionnaires d'événement de bouton et de clip Vous pouvez associer des gestionnaires d'événement directement à une occurrence de bouton ou de clip au moyen des gestionnaires onClipEvent() et on(). –onClipEvent() traite les événements de clips –on () traite les événements de boutons

11 Gaëtan MARANZANA SI28-A0411 onClipEvent() Différentes options : –onClipEvent (Load){ //actions qui seront réalisées au chargement du clip //Par exemple : Initiation des variables } –onClipEvent (enterFrame){ //actions qui seront réalisées à chaque image du clip }

12 Gaëtan MARANZANA SI28-A0412 on () Différentes options : –on (press){ //actions qui seront réalisées si le bouton est appuyé } –on (release){ // actions qui seront réalisées si le bouton est relâché } –on (rollOver){ // actions qui seront réalisées si le pointeur passe au dessus du bouton }

13 Gaëtan MARANZANA SI28-A0413 Fonctions Mathématiques Math.abs()Calcule une valeur absolue. Math.asin() Calcule le sinus d'un arc. Math.acos() Math.atan() Math.cosCalcule un cosinus. Math.sin() Math.tan() Math.ceil()Arrondit un nombre à l'entier supérieur le plus proche. Math.floorArrondit un nombre à l'entier inférieur le plus proche. Math.round()Arrondit à l'entier le plus proche Math.log()Calcule un logarithme naturel. Math.expCalcule une valeur exponentielle. Math.sqrt()Calcule une racine carrée. Math.max()Renvoie le plus grand des deux entiers. Math.min() Math.pow()Calcule de puissance. Math.random()Renvoie un nombre pseudo-aléatoire entre 0,0 et 1,0.

14 Gaëtan MARANZANA SI28-A0414 Script à ajouter à la pupille onClipEvent(enterFrame){ Xpos = this._parent._xmouse; Ypos = this._parent._ymouse; cercleXpos = this._x; cercleYpos = this._y; x = Xpos-cercleXpos; y = Ypos-cercleYpos; r = Math.sqrt((x*x)+(y*y)); sinTheta = y/r; theta = Math.asin(sinTheta); Rotation = this._rotation; if (Xpos<cercleXpos) { this._rotation = 180-(theta/0.0175); } else if (Xpos>cercleXpos) { this._rotation = theta/0.0175; }

15 Gaëtan MARANZANA SI28-A0415 La paupière Le mouvement de la paupière est réalisé par une animation image par image if (_global.battement == 1) { gotoAndPlay(nextFrame); } else { gotoAndPlay(1); }

16 Gaëtan MARANZANA SI28-A0416 Le donut La programmation de ce clip est situé sur un script externe Drag and Drop Modification interactive des propriétés d’un clip Déplacement de clip à l’aide du clavier Détection des collisions

17 Gaëtan MARANZANA SI28-A0417 Programmation externe Le fichier externe contenant le code ActionScript a une extension ".as" Insertion du script : #include "chemin/monfichier.as" Chemin : le chemin doit être écrit par rapport à l'endroit où se trouve le ".fla"

18 Gaëtan MARANZANA SI28-A0418 Drag and Drop La fonction permet le glisser déposer d’un clip à l’aide de la souris: startDrag(cible,[verrouiller,gauche, haut, droite, bas]) Code du fichier ‘.as’ on(press){ startDrag(this,true); } on(release){ stopDrag(); }

19 Gaëtan MARANZANA SI28-A0419 Différents types de texte Texte statique : Écrit à la programmation Texte dynamique : Affiche le contenu d’une variable Texte de saisie : Affiche le contenu d’une variable et modification

20 Gaëtan MARANZANA SI28-A0420 getProperty() renvoie la valeur de la propriété spécifiée pour le clip cible. –getProperty ( cible, _x );La position X (en pixels) du clip cible –getProperty ( cible, _y );La position Y (en pixels) du clip cible –getProperty ( cible, _width );La largeur (en pixels) du clip cible –getProperty ( cible, _height );La hauteur (en pixels) du clip cible –getProperty ( cible, _rotation ); L'angle de rotation (en degrés) du clip cible –getProperty ( cible, _target);Le chemin complet (à partir de _root) vers le clip cible –getProperty ( cible,_xscale );La mise à l'échelle de X par rapport à la taille originale du clip, (%) du clip cible. –getProperty ( cible, _yscale );Idem ci-dessus –getProperty ( cible,_alpha );le niveau alpha (en %) du clip cible. –getProperty ( cible, _currentframe );L'image où se trouve actuellement la tête de lecture du clip cible.

21 Gaëtan MARANZANA SI28-A0421 Déplacement d’un clip à l’aide du clavier La classe Key La classe Key est une classe de premier niveau dont les méthodes et les propriétés sont utilisables sans instructeur. Exemples : if( Key.isDown(Key.LEFT) ){ //script; } //Si la touche gauche est appuyée la condition est validée

22 Gaëtan MARANZANA SI28-A0422 Détection des collisions Fonction HitTest(). La méthode hitTest() de la classe MovieClip détecte les collisions. Elle vérifie si un objet est entré en collision avec un clip et renvoie une valeur booléenne ( true ou false ) if(this._parent.donut.hitTest(this._parent.oeil)){ gotoAndPlay(2); }

23 Gaëtan MARANZANA SI28-A0423 Programmation du Donut Code : onClipEvent(load){ //Taille du donut au démarrage echelle=50;} onClipEvent(enterFrame){ if(this._parent.donut.hitTest(this._parent.oeil)){gotoAndPlay(2);} //taille donut this._parent.donut._xscale=echelle; this._parent.donut._yscale=echelle; //fréquence battement paupière _global.battement=random(30); //déplacement clavier if(Key.isDown(Key.LEFT)){this._parent.donut._x=this._parent.donut._x-10;} if(Key.isDown(Key.RIGHT)){this._parent.donut._x=this._parent.donut._x+10;} if(Key.isDown(Key.UP)){this._parent.donut._y=this._parent.donut._y-10;} if(Key.isDown(Key.DOWN)){this._parent.donut._y=this._parent.donut._y+10;} }

24 Gaëtan MARANZANA SI28-A0424 Contrôle de sons Ajout de musique Contrôle à l’aide de boutons –Lecture et Arrêt –Pause et Reprise

25 Gaëtan MARANZANA SI28-A0425 La classe Sound La classe Sound permet de contrôler le son dans une animation. Vous pouvez ajouter des sons à un clip à partir de la bibliothèque pendant la lecture de l'animation et contrôler ces sons. Si vous ne spécifiez pas de cible (cible) lorsque vous créez un nouvel objet Sound, vous pouvez utiliser les méthodes pour contrôler le son de toute l'animation. Vous devez utiliser le constructeur new Sound pour créer un objet Sound avant d'appeler les méthodes de la classe Sound.

26 Gaëtan MARANZANA SI28-A0426 La classe Sound : Les méthodes monSon.start([décalageSecondes, boucle]) monSon.stop(["nomIdentifiant"]) stopAllSounds(); monSon.attachSound("nomIdentifiant ") nomIdentifiant L'identifiant d'un son exporté dans la bibliothèque. L'identifiant est situé dans la boîte de dialogue Propriétés de liaison.(Clic droit sur le son dans la bibliothèque) monSon.position renvoie le nombre de millisecondes écoulées depuis le début de la lecture d'un son. Si le son est lu en boucle, la position est remise à 0 au début de chaque boucle.

27 Gaëtan MARANZANA SI28-A0427 Programmation des boutons Code Bouton Play/Stop on (release) { if(a!=1){ a=1; this.Playstop="Stop";} else {if(a==1){ a=0; this.Playstop="Play";} } if(a==1){ mySound = new Sound(); mySound.attachSound("son1.mp3"); mySound.setVolume(100); mySound.start(0,1000); } if(a==0){stopAllSounds();} } Code Bouton Pause on (release) { if(a!=1){a=1;} else {if(a==1){a=0;} } if(a==1){ mySound = new Sound(); mySound.attachSound("son1.mp3"); mySound.setVolume(100); mySound.start(possound,1000); } if(a==0){ possound=mySound.position/1000; trace(possound); stopAllSounds();} }

28 Gaëtan MARANZANA SI28-A0428 Modification de la couleur Le bouton Play est le même que le bouton Stop. Cependant la couleur de celui-ci est différente lorsqu’il démarre ou arrête le son. On utilise la Classe Color La classe Color permet de définir la valeur de la couleur RVB et de récupérer les valeurs une fois qu'elles ont été définies. La méthode setTransform() définit les informations de transformation de couleur pour un objet Color.

29 Gaëtan MARANZANA SI28-A0429 Changement de la couleur d’un bouton Code : changementCouleur = new Color(this.colorcircle); TransformationDeCouleur = { ra: '0', rb: '0', ga: '100', gb: '255', ba: '0',bb: '0', aa: '0', ab: '255'}; changementCouleur.setTransform(TransformationDeCouleur);

30 Gaëtan MARANZANA SI28-A0430 Modification de la couleur Les paramètres pour un objet de transformation de couleur correspondent aux paramètres définis dans la boîte de dialogue Effet avancé et sont définis comme suit : –ra est le pourcentage de la composante rouge (-100 à 100). –rb est le décalage de la composante rouge (-255 à 255). –ga est le pourcentage de la composante verte (-100 à 100). –gb est le décalage de la composante verte (-255 à 255). –ba est le pourcentage de la composante bleue (-100 à 100). –bb est le décalage de la composante bleue (-255 à 255). –aa est le pourcentage pour alpha (-100 à 100). –ab est le décalage pour alpha (-255 à 255).

31 Gaëtan MARANZANA SI28-A0431 Telechargement Télécharger le résultat final