L’interactivité avec ActionScript. ActionScript Langage de programmation de Flash qui permet de : Gérer des actions et des animations sur la scène Contrôler.

Slides:



Advertisements
Présentations similaires
Interactivé: L'Action Script.
Advertisements

SI28 FLASH MX Partie 1 Jérémy Dufetre - Ludovic Pilache.
Interactions avec ActionScript
Les sous-programmes Chapitre n° 5: Objectifs : Activité:
12 novembre 2012 Grégory Petit
CPI/BTS 2 Programmation Web Introduction au PHP
Les structure d’un programme :
FICHIERS : Définition : Algorithme général:
Interaction 1 COM3562 Communication Multimédia Février 2012.
Animateur : Med HAIJOUBI
TP n°3 Javascript Contrôle de formulaire
Javascript 2° PARTIE : EVENEMENTS ET OBJETS
JavaScript Nécessaire Web.
Spécificités Techniques Campagne NPI Nov Orange : Flash Transparent + 300x250 ATTENTION : s’il y a une interaction entre les deux créations les.
Algorithmique et programmation en
Initiation au JavaScript
Philippe Gandy - 8 septembre 2015 Basé sur les notes de cours de Daniel Morin et Roch Leclerc.
Faire déplacer le personnage à l’aide des flèches du clavier Il y a plusieurs façon de procéder selon nos attentes, mais en voici une qui est très simple:
Scénario Les scénarios permettent de modifier la position, taille … des calques au cours du temps. Son fonctionnement est très proche de celui de Macromedia.
PROCESSING Semaine 03. PLAN DE LEÇON Interaction avec un programme Gestion de la souris Gestion du clavier.
Dreamweaver MX Jauneau Marie Claude-Antoine Zarate.
FLASH MX : séance 1 Sandrine Rabin Nicolas Mollet SI28.
Environnement Flash MX
DreamWeaver Séance 2 HMIDA Ahmed A2008. Plan 1.Calques 2.CSS 3.Modèles 4.Formulaires 5.Comportements 6.Mise en ligne.
FLASH MX : séance 1 Vivien FILIPPINI Jeanne VERRE Exposé SI28.
Séance Flash 2 TD SI28 du 16/04/07 Nadel Ben Ghmiss Bruno Prémartin.
Présentation Dreamweaver – Partie 2 Mickaël PIQUE – Automne 2004.
Exposé DREAMWEAVER 2 Guillaume DUBREUIL Adrien HADOUX.
Padmanaathan Gaayathrie
SI28 Partie 1 Bruno Binet FLASH MX. Les atouts de Flash Création d’animation pour le Web, pouvant contenir une forte interactivité Faible poids des fichiers.
Réalisation d'un jeu de tir aux Canards Florian GAUCHER Alexandre LEVY SI 28 Exposé Flash 3.
Deuxième Exposé Si Nicolas Debeljak Sun Young Park.
SI28 - Écriture multimédia interactive – A2004 Présentation Dreamweaver Partie 2 Pierre Malet GSU05.
FLASH SEANCE 2 Interaction avec Action Script. Action script Langage de programmation utilisé par Flash. Définir des propriétés, des actions des comportements.
** Flash séance 2 Action script. ** Action Script Ajoute de l’interactivité Permet de contrôler les clips  Langage de programmation orienté objet.
Flash 2 ème séance Interaction François Marliac Mickaël Moreira.
Flash MX – Séance 2 Interactions & ActionScript David Rapin Si28 P06.
Dreamweaver le retour Avec Les Formulaires Les Calques
Flash MX er Séance LIU Xinlei GI02.
FORMULAIRES FOMULAIRE Permet à l’utilisateur d’entrer des renseignements le concernant. Utilisation –Inscription sur un site –Mise à jour d’une base.
Télécharger :
Dreamweaver 2 Plan 1.Calques 2.CSS 3.Modèles 4.Comportements 5.Formulaires 6.Mise en ligne 1 Timothée Devaux Myriam Roudy Dreamweaver 2 Printemps 2008.
Les formulaires Les calques Les comportements Les scénarios Les modèles Les feuilles de styles (CSS) La mise en ligne Les formulaires permettent à l’utilisateur.
Amine Benabdennbi - Omar Berrada Rekhami Flash 2 – Interactivité Avancée Flash 2 Séance de Flash n°2 TD SI28 du 16/04/2007 Amine Benabdennbi Omar Berrada.
 Flash : animations mais aussi interactions  ActionScript : langage de programmation multipliant les possibilités de dynamisme et d’interactivité d’un.
Flash 1 Cariou SandraCoffinot Nicolas. Sommaire : I)Généralités II)Interface de Flash III)Grouper et Dissocier IV)Image clé V)Scénario et calques VI)Symboles.
Télécharger :
Réalisation d’un jeu de tir au canards. Page d’accueil Télécharger les fichiers sources. Importez les images parchemins et fond_shoot Insérer l’image.
Flash : deuxième séance Yannick Bresson Alessandro Camozzato Tien-Quang Tong 22/10/07.
1 Exposé Flash 3 Objectif : Réalisation d’un jeu de tir aux canards Si28 - Paméla GUERIZEC – le 28 novembre 2005.
SI28 Flash 3 Tir’O’Canard 1 Téléchargez le swf : 1.Présentation 5.Fin 4.Jeu 2.Zone de travail 3.Menu.
EXPOSE FLASH 2 SI 28 24/10/2006 Delphine GODREAU Hélène PERRIER.
Sommaire : -A propos des images importées -Les boutons et l’interactivité dans la scène -Textes dynamiques -Les clips (les liaisons) -Les sons -Les composants.
DREAMWEAVER MX2 - Séance 2 Les calques Les comportements Les scénarios Les formulaires Les feuilles de style Les modèles Les cadres Mise en ligne Jérôme.
Gaëtan MARANZANA SI28-A04 Flash MX DEUXIEME EXPOSE.
Exposé Flash 3 - Tir aux canards - DIDELOT Guillaume GI02 VAN DER PLAETSEN Virginie GSU04Printemps 06.
Interface Tutorial Flash 2 Par Vincent ² SI28 – P06 Bibliothèque Composant s Panneau actions Barre d'outils Timeline.
Dreamweaver 2 Feuilles de Style CSS Formulaires Calques Comportements
AKOONE Farouck LI Li SI 28 A2004. Flash permet de : Créer des animations pour le Web, pouvant contenir une forte interactivité Des fichiers de faible.
BOUTET Antoine MARICOT Benoit ActionScript Flash Séance 2.
FLASH Séance 2 Xiaoliang Liang Morgane Le Nan SI28 P05.
Flash – séance 2 Interactions avec Action Script.
Séance 2 Marie Lavogez Justine Leleu Dreamweaver MX.
Gaël DELBARY Benoît DEVEAUX
DREAMWEAVER 2 Michael LEPERS Pierre LAINÉ.  Formulaire  Calques  Comportements  Feuille de style CSS  Modèle  Scénario  Gestion du site.
PRESENTATION FLASH 2 MAURIN Marion BERETTI Vincent.
SI28 : D REAMWEAVER 2 Audrey BUISSON – GSU05 Romain LASSALLE – GI05 1 SI28 – Ecriture interactive et multimedia.
Lundi 20 octobre 2008Séance Flash 21 Séance Flash 2 ActionScript Cheikh DIEDHIOU Germain LEDRUT.
Introduction à PowerPoint, logiciel de présentation Session hiver 2007 Commission scolaire Lac-St-Jean par Stéphanie Boivin.
Transcription de la présentation:

L’interactivité avec ActionScript

ActionScript Langage de programmation de Flash qui permet de : Gérer des actions et des animations sur la scène Contrôler la tête de lecture (timeline) Lire des sons et des vidéos Gérer les événements souris et clavier Où placer le code ? Sur l’occurrence d’un bouton -> Actions - Boutons Sur l’occurrence d’un clip -> Actions - Clip Sur une image -> Actions – Image Une méthode fréquemment utilisée consiste à placer le code sur un calque à part => il faut alors nommer les occurrences afin de pouvoir les appeler dans ce script

Gestionnaire d’événements Sur l’occurrence d’un clip : onClipEvent() Load: L'action est lancée dès que le clip est instancié et apparaît dans le scénario. EnterFrame: L'action est déclenchée continuellement à la cadence du clip. keyDown: L'action est initiée lorsqu'une touche est enfoncée. onRollOver : L’action est déclenchée lorsque le clip est survolé par la souris. onRollOut : L’action est déclenchée lorsque la souris se retire du clip. Sur l’occurrence d’un bouton : on() press: Le bouton de la souris est enfoncé alors que le pointeur se trouve au-dessus du bouton. release: Le bouton de la souris est relâché alors que le pointeur se trouve au-dessus du bouton. rollOver: Le pointeur de la souris passe au-dessus du bouton. rollOut: Le pointeur passe en dehors de la zone du bouton.

Hiérarchie des objets _root clip1clip3clip2 clip21clip31 >scène principale >clips imbriqués dans la scène >clips imbriqués dans d’autres clips

Hiérarchie des objets Chemin absolu (ne dépend pas de l'endroit où on se trouve) Exemple : _root.clip_3. ??? =... effectue une action sur Clip_3 quelque soit l’endroit où on entre le code Chemin relatif (dépend du clip dans lequel on tape le code) Exemple : this. ??? =... effectue une action sur le clip dans lequel le code est entré Exemple : _parent. ??? =... effectue une action sur le parent du clip dans lequel le code est entré (clip_3 dans le cas où le code est entré dans clip_31)

Variables Définition rigoureuse d’une variable var Nom_variable:Type_variable = new Type_Variable(Valeur_Variable); Exemple : var age:Number = new Number(35); Définition plus simple mais correcte var Nom_variable:Type_variable = Valeur_Variable; Exemple : var age:Number = 35;(var age=35 fonctionne également mais pas très correcte) Les différents types de variable Number String (chaîne de caractères) Boolean (valeurs possible : true ou false) Array (tableau)

Variables globales et locales Une variable globale est connue à tout niveau de l’application _global.Nom_variable = Valeur_variable; Exemple : _global.age = 14; Une variable locale est connue uniquement dans le bloc où elle est définie Exemple : var prenom:String = "Anthony"; Exemple : var il_pleut:Boolean = true;

Sons Pour créer un son dans Flash il faut commencer par créer un objet Sound. var Nom_Variable = new Sound(); Exemple : var musique = new Sound(); On peut ensuite utiliser loadSound pour attacher un son présent sur le disque dur ou issu d’Internet à notre objet Sound. Exemple : mon_son.loadSound( " true); (pour lire le son en streaming) Exemple : mon_son.loadSound( "mon_son.mp3", true); Ou utiliser attachSound pour attacher un son présent dans la bibliothèque à notre objet Sound grâce à son identifiant. Glisser le son dans la bibliothèque puis clic droit sur le son, Propriété de liaison et cocher « export for ActionScript » Exemple : mon_son.attachSound( « id_mon_son.mp3" );

Sons: Propriétés Une fois qu’un son a été attaché à un objet Sound on peut utiliser diverses fonctions pour manipuler l’objet : Nom_Variable_Son.start(décalage,nb_de_lectures); décalage est la durée en secondes entre les lectures successives d’un son, nb_de_lecture est le nombre de lectures successives du son à effectuer. Exemple : mon_son.start(0,10); Nom_Variable_Son.stop(); Nom_Variable_Son.setVolume(volume); volume est un entier à 100 par défaut Nom_Variable_Son.duration(durée); durée est la durée du son en ms stopAllSounds(); Pour couper tous les sons

Collision Le HitTest fonctionne de deux façons: Soit entre deux Clips : (clip1.hitTest(clip2)) Dans ce cas, il trace un rectangle invisible autour des deux formes complexes. Soit un Clip par rapport à un point ( clip1.hitTest(x, y, valeur booleene)). Si le bool est true, alors il trace un rectangle invisible autour du clip comme precedement, sinon seule la partie occupée par le clip compte (c'est ca qui est interessant) La fonction rend un boolean et s'emploie donc dans le cadre d'un if le plus souvent

Exercice: Drag & Drop Quelques fonctions utiles pour l’exercice: public _droptarget : String [read-only]String Renvoie le chemin absolu, en utilisant une notation de syntaxe à barre oblique, de l'occurrence de clip sur laquelle ce clip a été déposé. La propriété _droptarget renvoie toujours un chemin qui commence par une barre oblique (/). public substring(start: Number, end: Number) : StringNumber Renvoie une chaîne comprenant les caractères entre les points spécifiés par les paramètres start et end. Si le paramètre end n'est pas spécifié, la fin de la sous-chaîne correspond à la fin de la chaîne startDrag() stopDrag()

Les Boutons Créer une forme puis la convertir en bouton (F8) : Propriétés en double-clic Principaux évènements sur les boutons On(press): Le bouton de la souris est enfoncé alors que le pointeur se trouve au- dessus du bouton. On(release): Le bouton de la souris est relâché alors que le pointeur se trouve au-dessus du bouton. On(rollOver): Le pointeur de la souris passe au-dessus du bouton. On(rollOut): Le pointeur passe en dehors de la zone du bouton Exemple : bouton vers lien URL on(release){ getURL(" }

Navigation : au sein d’une séquence, entre séquences Se déplacer dans la timeline 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.

Navigation : au sein d’une séquence, entre séquences Exemple : 2 séquences : Menu et Anim1 Sur le bouton dans Menu: on(release){gotoAndPlay("Anim1",1);} A la fin de l'animation dans Anim1: gotoAndStop("Menu",1);

Navigation d’un swf à un autre LA FONCTION LOADMOVIE L’exemple suivant charge le fichier SWF circle.swf à partir du même répertoire et remplace un clip intitulé monClip qui existe déjà sur la scène : Syntaxe : loadMovie("circle.swf", monClip);

Déplacement avec le clavier - TRANSFORMER L’IMAGE EN CLIP AVEC F8. Appeler le clip « bonhomme » - DONNER UN NOM D ‘OCCURRENCE. L’appeler « personnage » this.mario.onEnterFrame = function(){ if (Key.isDown(Key.UP)){ this._y -= 5;} else if (Key.isDown(Key.DOWN)){ this._y += 5;} else if (Key.isDown(Key.LEFT)){ this._x -= 5;} else if (Key.isDown(Key.RIGHT)){ this._x += 5;} stop(); }