Penser aux commandes partie 2 de 2

Au cours de ce tutoriel, nous étendrons davantage le cadre de commande à partir de la première partie. Nous allons créer un cadre de gestion de scène, avec un code facilement compréhensible et maintenable.


Aperçu du résultat final

Jetons un coup d'œil au résultat final sur lequel nous allons travailler:


Gestion de scène

Une approche raisonnable pour diviser une application Flash complète en éléments plus petits consiste à la gérer en tant que scènes séparées. L'IDE Flash vous permet d'effectuer une gestion de scène sans écrire de code, mais nous allons aborder les choses complètement différemment. Nous allons créer notre propre cadre de gestion de scène.

Dans notre cadre de gestion de scènes, nous considérons les scènes comme les plus petits éléments constitutifs d’une application Flash complète. Chaque scène est composée d’un intro commande et un outro commander. Une commande d'introduction initialise tout ce dont vous avez besoin pour une scène, telle que l'ajout d'un logo à la liste d'affichage de votre image-objet conteneur. Une commande outro fait exactement le contraire, telle que supprimer le logo de l'image-objet conteneur. Vous pouvez voir la transition d'une scène à une autre en tant que commande outro de la première scène suivie de la commande d'introduction de la seconde. De cette façon, nous pouvons assembler des scènes et gérer très facilement leurs transitions..

Regardez cette figure. Une scène est comme un morceau de puzzle. l'extrémité gauche représentant la commande d'introduction et l'extrémité droite étant la commande outro.

Effectuer une transition de la scène A à la scène B revient à connecter les deux pièces ensemble. La commande outro de la scène A est exécutée en premier, la commande d'introduction de la scène B est exécutée ensuite, puis la transition de scène est terminée.

C’est fondamentalement le même concept pour effectuer une transition de la scène A à la scène C. Nous devons simplement assembler les pièces de puzzle A et C au lieu de A et B.


Créer quelques commandes supplémentaires

Avant de commencer à créer le cadre de gestion des scènes, créons d’abord des classes de commandes qui seront utilisées ultérieurement dans ce didacticiel. Vous pouvez simplement vous concentrer sur les méthodes execute () écrasées des classes de commandes suivantes, qui constituent la partie la plus importante de ces classes..


Commandes de Tweening GreenSock

Sans aucun doute, la plate-forme GreenSock Tweening est l’un des meilleurs frameworks de tweening à source ouverte du marché. Les transitions entre scènes impliquent généralement beaucoup d'interpolations et la plate-forme GreenSock Tweening a toujours été mon premier choix en matière de création d'interpolations. Nous allons encapsuler ce framework dans des classes de commandes pour l'intégrer à notre framework de commandes. Téléchargez la bibliothèque TweenMax et installez-la.

Nous utiliserons les méthodes to () et from () de la classe TweenMax. La classe TweenMax offre un moyen de gérer l'achèvement d'une interpolation en appelant une fonction référencée par la propriété facultative "onComplete" dans le paramètre "vars". Nous allons affecter la méthode complete () de la commande à cette propriété. La méthode complete () est invoquée lorsque l'interpolation est terminée. Vous trouverez ci-dessous le code des commandes encapsulant ces deux méthodes. Créez un nouveau répertoire appelé "greensock" dans le répertoire "controls" que vous avez créé dans la première partie de ce didacticiel, puis enregistrez ces classes en tant que TweenMaxTo.as et TweenMaxFrom.as respectivement..

 package commands.greensock import com.greensock.TweenMax; importer des commandes.Commande; // cette commande encapsule la méthode TweenMax.to (), classe publique TweenMaxTo extend Command public var target: Object; public var duration: Number; variables publiques: Object; fonction publique TweenMaxTo (target: Object, durée: Number, vars: Object) this.target = target; this.duration = durée; this.vars = vars;  écrasera la fonction protégée execute (): void // demande à TweenMax d'appeler la méthode complete () de la commande lorsque l'interpolation est terminée vars.onComplete = complete; TweenMax.to (cible, durée, vars); 
 package commands.greensock import com.greensock.TweenMax; importer des commandes.Commande; // cette commande encapsule la méthode TweenMax.from (), classe publique TweenMaxFrom extend Command public var target: Object; public var duration: Number; variables publiques: Object; fonction publique TweenMaxFrom (target: Object, durée: Number, vars: Object) this.target = target; this.duration = durée; this.vars = vars;  écrasera la fonction protégée execute (): void // demande à TweenMax d'appeler la méthode complete () de la commande lorsque l'interpolation est terminée vars.onComplete = complete; TweenMax.from (cible, durée, vars); 

(Assurez-vous de relire mon introduction aux commandes si vous devez rafraîchir votre mémoire.)

TweenMaxTo interpelle l’objet cible de sa position actuelle (ou flou, alpha ou…) à la nouvelle position (etc.) que vous spécifiez avec l’objet vars. TweenMaxFrom fait le contraire.

Si vous connaissez suffisamment la plate-forme GreenSock Tweening, vous pouvez également encapsuler les classes TweenLite et TweenNano pour répondre à vos besoins..


Commandes de conteneur d'objet d'affichage

Comme mentionné précédemment, l'introduction et la sortie d'une scène peuvent très probablement impliquer l'ajout d'objets d'affichage à un conteneur d'objets d'affichage et le retrait des objets du conteneur. Alors, encapsulons les méthodes addChild () et removeChild () dans des commandes.

 package commands.display import commands.Command; import flash.display.DisplayObject; import flash.display.DisplayObjectContainer; // Cette commande encapsule la méthode addChild (), classe publique AddChild extend. Commande public var conteneur: DisplayObjectContainer; public var displayObject: DisplayObject fonction publique AddChild (conteneur: DisplayObjectContainer, displayObject: DisplayObject) this.container = conteneur; this.displayObject = displayObject;  écrase la fonction protégée execute (): void container.addChild (displayObject); Achevée(); 
 package commands.display import commands.Command; import flash.display.DisplayObject; import flash.display.DisplayObjectContainer; // Cette commande encapsule la méthode removeChild (). Public class RemoveChild extend Command public var container: DisplayObjectContainer; public var displayObject: DisplayObject fonction publique RemoveChild (conteneur: DisplayObjectContainer, displayObject: DisplayObject) this.container = conteneur; this.displayObject = displayObject;  écrase la fonction protégée execute (): void container.removeChild (displayObject); Achevée(); 

Commandes d'écoute d'événement

Nous utiliserons également des commandes pour gérer l’ajout et la suppression d’écouteurs d’événements. Nous allons donc encapsuler les méthodes addEventListener () et removeEventListener ()..

 package commands.events import commands.Command; import flash.events.IEventDispatcher; // cette commande encapsule la méthode addEventListener (), classe publique AddEventListener extended Command public var dispatcher: IEventDispatcher; public var type: String; public var listener: Function; fonction publique AddEventListener (dispatcher: IEventDispatcher, type: chaîne, écouteur: fonction) this.dispatcher = dispatcher; this.type = type; this.listener = auditeur;  écrasement de la fonction protégée execute (): void dispatcher.addEventListener (type, écouteur); Achevée(); 
 package commands.events import commands.Command; import flash.events.IEventDispatcher; // cette commande encapsule la méthode removeEventListener (). public class RemoveEventListener extend Command public var dispatcher: IEventDispatcher; public var type: String; public var listener: Function; fonction publique RemoveEventListener (dispatcher: IEventDispatcher, type: chaîne, écouteur: fonction) this.dispatcher = dispatcher; this.type = type; this.listener = auditeur;  écrase la fonction protégée execute (): void dispatcher.removeEventListener (type, écouteur); Achevée(); 

Commandes utilitaires

Enfin, nous aurons besoin de quelques commandes utilitaires pour faciliter les choses. La commande SetProperties définit les propriétés d'un objet à partir des valeurs de propriété d'un autre objet:

 package commands.utils import commands.Command; // cette commande définit les propriétés d'un objet de manière rapide et pratique. public class SetProperties extended Command public var target: Object; propriétés var publiques: Object; fonction publique SetProperties (target: Object, propriétés: Object) this.target = target; this.properties = propriétés;  écraser la fonction protégée execute (): void for (clé var: Chaîne dans les propriétés) cible [clé] = propriétés [clé];  Achevée(); 

Nous pouvons l'utiliser comme ceci:

var setProperties: SetProperties = new SetProperties (cible, x: 100, y: 230);

… Et définira les propriétés x et y de l'objet cible sur les valeurs spécifiées.

La commande factice ne fait simplement rien et termine l'exécution de la commande. Le but de cette commande est de servir d’espace réservé et deviendra clair plus tard:

 package commands.utils import commands.Command; // cette commande ne fait tout simplement rien et se termine lors de l'exécution de la classe publique Dummy extended Command fonction publique Dummy ()  écrase la fonction protégée execute (): void complete (); 

La commande Wait attend pendant un délai spécifié, puis termine l'exécution de la commande sans rien faire:

 package commands.utils import commands.Command; public class Wait waiting Commande fonction publique Wait (delay: Number = 0) super (delay);  écraser la fonction protégée execute (): void complete (); 

Vous vous demandez peut-être pourquoi nous aurions besoin d’une commande qui occupe tout le temps si nous avons déjà un paramètre constructeur "delay" dans la classe de base Command. Parfois, nous aimerions que les constructeurs aient uniquement des paramètres qui ont vraiment quelque chose à voir avec les fonctionnalités spécifiques de la commande, et inclure le délai "delay" comme un paramètre parmi eux interrompt en quelque sorte "l'uniformité" en termes de paramètres. Donc au lieu d'écrire le code ci-dessous:

 new SerialCommand (0, new SomeFancyCommand (delay1, fancyParam11, fancyParam12, fancyParam31), new SomeFancyCommand (delay2, fancyParam21, fancyParam22, fancyParam23));

Nous pourrions écrire quelque chose comme ceci:

 nouveau SerialCommand (0, nouveau Wait (delay1), nouveau SomeFancyCommand (fancyParam11, fancyParam12, fancyParam31), nouveau Wait (delay2), nouveau SomeFancyCommand (fancyParam21, fancyParam22, fancyParam22);

Les paramètres "delay" ne vous attirent plus inutilement dans les constructeurs SomeFancyCommand. Ils ont maintenant été déplacés vers les commandes d'attente pour rendre les choses plus propres.


Le cadre de gestion de scène

Voici notre classe de scène, représentant une seule "pièce de puzzle". Ce que fait chaque méthode est expliqué dans les commentaires. Cette classe est à peu près une classe "squelette", puisque chaque méthode crée une commande factice ou ne fait rien. Pour rendre les choses plus juteuses, ces méthodes doivent être remplacées. Créez un nouveau répertoire "scènes" dans le dossier source de votre projet pour stocker ces nouvelles classes:

 paquet scènes import commandes.Commande; importer commands.utils.Dummy; // cette classe représente une scène pour une application Flash complète. Classe publique Scene // une référence au gestionnaire de scènes possédant cette scène internal var _sceneManager: SceneManager; fonction finale protégée get sceneManager (): SceneManager return _sceneManager;  // crée la commande d'introduction de cette scène fonction publique createIntroCommand (): Command return new Dummy ();  // crée la commande outro de cette scène fonction publique createOutroCommand (): Command return new Dummy ();  // gère les éléments liés à la scène lorsque la scène est définie. function onSceneSet (): void 

Et voici la classe SceneManager qui gère les transitions de scènes, des détails également expliqués dans les commentaires. Notez que j'ai ajouté une "variable factice" pour éviter que les transitions ne soient interrompues par un appel intempestif à la méthode setScene ()..

 paquet scènes import commandes.Commande; import flash.events.Event; // cette classe gère les transitions de scènes, classe publique SceneManager // une référence à la scène actuelle private var _currentScene: Scene; // référence à la scène cible d'une transition private var _targetScene: Scene; // variable factice privée private var _isInTransition: Boolean = false; fonction publique SceneManager ()  fonction publique setScene (scene: Scene): void // si une transition n'est pas terminée, ignorez l'appel de la méthode if (_isInTransition) return; _targetScene = scene; // active la variable factice _isInTransition = true; // vérifie si une scène est déjà affectée au gestionnaire de scènes si (_currentScene) // si oui, commencez le début de la scène actuelle var outroCommand: Command = _currentScene.createOutroCommand (); // et écoute l'événement complet de la commande outroCommand.addEventListener (Event.COMPLETE, onCurrentOutroComplete); outroCommand.start ();  else // sinon, lancez l'intro de la scène cible gotoTargetScene ();  // invoqué lorsque la commande outro de la scène actuelle est complète. fonction privée onCurrentOutroComplete (e: Event): void Commande (e.target) .removeEventListener (Event.COMPLETE, onCurrentOutroComplete); gotoTargetScene ();  function privée gotoTargetScene (): void // définit la référence du gestionnaire de scène de la scène cible sur _targetScene._sceneManager = this; var introCommand: Command = _targetScene.createIntroCommand (); // écoute l'événement complet de la commande d'intro de la scène cible introCommand.addEventListener (Event.COMPLETE, onTargetIntroComplete); introCommand.start ();  // invoqué lorsque la commande d'introduction de la scène cible est complète. fonction privée onTargetIntroComplete (e: Event): void Commande (e.target) .removeEventListener (Event.COMPLETE, onTargetIntroComplete); // supprime la référence du gestionnaire de scènes de la scène précédente if (_currentScene) _currentScene._sceneManager = null; // définit la scène cible comme scène actuelle _currentScene = _targetScene; // désactive la variable factice _isInTransition = false; // et invoque la méthode onSceneSet () _currentScene.onSceneSet (); 

D'accord. Tout est prêt et nous sommes prêts à partir. Il est temps de créer une application réelle avec le framework que nous avons construit.


Étape 1: Créer un document Flash

Ouvrez l'IDE Flash et créez un nouveau document Flash. Nommez-le "SceneTransitions" et créez une classe de documents du même nom. En outre, vous pouvez placer un fond sur la scène si vous aimez.


Étape 2: Créer un texte d'introduction

Créez 4 symboles avec du texte et nommez-les en fonction de l'image suivante. Tout au long de cet exemple, exportez chaque symbole pour ActionScript avec un nom de classe identique à son nom de symbole..


Étape 3: Créer la scène 1

Créez des symboles et nommez-les comme indiqué dans l'image suivante. En outre, organisez leurs instances et nommez-les comme indiqué. Sélectionnez toutes les instances et convertissez-les, en tant que groupe, en un autre symbole, nommé "Scene1Sprite". Vous pouvez ensuite supprimer Scene1Sprite de la scène (mais pas de la bibliothèque)..


Étape 4: Créer la scène 2

Procédez exactement comme à l'étape précédente, mais cette fois, sélectionnez toutes les instances et convertissez-les en un symbole nommé "Scene2Sprite".


Étape 5: La classe de document

La classe de document est étonnamment simple. Créez simplement un gestionnaire de scènes et dites au gestionnaire de définir la scène actuelle sur une scène d'intro..

 package import flash.display.Sprite; importer des scènes.SceneManager; Classe publique SceneTransitions étend Sprite fonction publique SceneTransitions () var sceneManager: SceneManager = new SceneManager (); sceneManager.setScene (nouvelle IntroScene (this)); 

Étape 6: Créer la scène d'introduction

La scène initiale que nous avons définie pour le gestionnaire de scène est une scène d'intro. Comme son nom l'indique, cette scène est simplement une introduction à notre scène principale (plutôt que d'être la partie d'intro du "casse-tête" de notre scène principale). La commande intro (créée à partir de la méthode createIntroCommand () override) de cette scène d’intro déplace les occurrences de symboles vers le centre de la scène (à l’aide de la commande SetProperties), les ajoute au conteneur, les interpelle de zéro à 100%, et les rend flous à zéro alpha, un après l'autre. Ceci est réalisé en reliant toutes les commandes séparées avec une seule commande série (comme vous devez vous en souvenir de la première partie).

Lorsque la commande d'intro est terminée, la méthode onSceneSet () est appelée et, à ce stade, la propriété sceneManager est disponible et sa méthode setScene () peut être appelée pour changer de scène. Dans la méthode onSceneSet (), la méthode setScene () du gestionnaire de scène est appelée pour passer à Scene1 (une classe que nous allons créer à l'étape suivante). Comme nous n’avons pas redéfini createOutroCommand (), la commande outro de la scène d’intro est une commande fictive qui ne fait rien..

 package import commands.Command; importer commands.display.AddChild; importer commands.display.RemoveChild; importer commands.greensock.TweenMaxFrom; importer commands.greensock.TweenMaxTo; importer commands.scenes.SetScene; import commands.SerialCommand; import commands.utils.SetProperties; import flash.display.DisplayObject; import flash.display.Sprite; import flash.filters.BlurFilter; importer des scènes.Scene; Classe publique IntroScene: extension Scene // paramètres de constante private static const ZOOM_IN_TIME: Number = 0.2; Const statique privée HOLD_TIME: Number = 0.3; Constante statique privée BLUR_OUT_TIME: Number = 0.2; Constante statique privée BLUR_AMOUNT: Number = 20; conteneur var privé: Sprite; fonction publique IntroScene (conteneur: Sprite) this.container = conteneur;  écrase la fonction publique createIntroCommand (): Command var blur: BlurFilter = new BlurFilter (BLUR_AMOUNT, BLUR_AMOUNT, 2); // occurrences de symboles var text1: DisplayObject = new IntroText1 (); var text2: DisplayObject = new IntroText2 (); var text3: DisplayObject = new IntroText3 (); var text4: DisplayObject = new IntroText4 (); // C’est la commande série qui relie les éléments. var commande: Commande = new SerialCommand (0, // "THIS" new SetProperties (text1, x: 320, y: 200), new AddChild (conteneur, text1), new TweenMaxFrom (text1, ZOOM_IN_TIME, scaleX: 0, scaleY: 0), nouveau TweenMaxTo (text1, BLUR_OUT_TIME, delay: HOLD_TIME, alpha: 0, blurFilter: blur), nouveau RemoveChild (conteneur, text1), // "IS" new SetProperties (text2, x: 320, y: 200), nouvel AddChild (conteneur, text2), nouveau TweenMaxFrom (text2, ZOOM_IN_TIME, scaleX: 0, scaleY: 0), nouveau TweenMaxTo (text2, BLUR_OUT_TIME, delay: HOLD_TIME, alpha: 0, blurFilter: blur), nouvelle RemoveChild (conteneur, text2), // "AN" nouvelle SetProperties (text3, x: 320, y: 200), nouvelle AddChild (conteneur , text3), nouveau TweenMaxFrom (text3, ZOOM_IN_TIME, scaleX: 0, scaleY: 0), nouveau TweenMaxTo (text3, BLUR_OUT_TIME, retard: HOLD_TIME, alpha: 0, flouFilter: flou), nouveau RemoveChild (conteneur, texte3 ), // "INTRO" nouveau SetProperties (text4, x: 320, y: 200), nouvel AddChild (conteneur, text4), nouveau TweenMaxFrom (text4, ZOOM_IN_TIM E, scaleX: 0, scaleY: 0), new TweenMaxTo (text4, BLUR_OUT_TIME, delay: HOLD_TIME, alpha: 0, blurFilter: blur), new RemoveChild (conteneur, text4),); renvoyer la commande;  écrase la fonction publique onSceneSet (): void // une fois la scène définie, passe directement à la scène 1 sceneManager.setScene (new Scene1 (conteneur)); 

Vous pouvez ajuster la valeur des const pour modifier les effets d'interpolation.


Étape 7: Créer Scene1

Regardons maintenant la classe Scene1. Les champs de texte sont interpolés en position un par un; les boutons "intro_btn" et "scene2_btn" sont enregistrés avec les écouteurs d'événements de clic de souris après avoir été interpolés, ce qui est obtenu en enchaînant les commandes d'interpolation et en ajoutant des écouteurs avec une commande en série.

Une autre chose à noter est la commande AddChild qui ajoute Scene1Sprite au conteneur. Il est concaténé en série après une commande Wait qui attend une trame. Parce que la classe TweenMax met à jour tous les objets d'affichage dans l'image suivante après l’appel à la méthode TweenMax.from (), vous pouvez parfois apercevoir un "aperçu" rapide des objets à leur emplacement final, avant le début de l’interpolation. Le but de la commande Wait ici est de donner à TweenMax suffisamment de temps pour déplacer les objets aux emplacements de départ appropriés..

 package import commands.Command; importer commands.display.AddChild; importer commands.display.RemoveChild; importer commands.events.AddEventListener; importer commands.events.RemoveEventListener; importer commands.greensock.TweenMaxFrom; importer commands.greensock.TweenMaxTo; import commands.ParallelCommand; import commands.SerialCommand; import commands.utils.SetProperties; importer commands.utils.Wait; import flash.display.Sprite; import flash.events.Event; import flash.events.MouseEvent; import flash.filters.BlurFilter; importer des scènes.Scene; Classe publique Scene1 extend Scene // paramètres de constante private static const IN_TIME: Number = 0.4; Const statique privée OUT_TIME: Number = 0.2; Const statique privée DELAY_TIME: Number = 0.2; Constante statique privée BLUR_AMOUNT: Number = 20; conteneur var privé: Sprite; var privé: Scene1Sprite; Var flou privé: BlurFilter; fonction publique Scene1 (conteneur: Sprite) this.container = conteneur; ss = new Scene1Sprite ();  écrase la fonction publique createIntroCommand (): Command var commande: Command = new ParallelCommand (0, // "THIS" new TweenMaxFrom (ss.text1_mc, IN_TIME, x: -400), // "IS" new TweenMaxFrom ( ss.text2_mc, IN_TIME, y: -250, retard: DELAY_TIME), // "SCENE" nouveau TweenMaxFrom (ss.text3_mc, IN_TIME, y: 250, retard: DELAY_TIME * 2), // "1" new TweenMaxFrom (ss.text4_mc, IN_TIME, x: 400, delay: DELAY_TIME * 3), // bouton d'introduction nouveau SerialCommand (0, nouveau TweenMaxFrom (ss.intro_btn, IN_TIME, y: 250, délai: DELAY_TIME * 4 ), nouvel AddEventListener (ss.intro_btn, MouseEvent.CLICK, replayIntro)), // bouton scène 2 nouveau SerialCommand (0, nouveau TweenMaxFrom (ss.scene2_btn, IN_TIME, y: 250, délai: DELAY_TIME * 5), new AddEventListener (ss.scene2_btn, MouseEvent.CLICK, gotoScene2)), // déplace la sprite de la scène 1 au centre du conteneur new SetProperties (ss, x: 300, y: 200), // ajoute la scène 1 sprite dans le conteneur // attend une image pour permettre le déplacement des éléments dans les emplacements appropriés new SerialCommand (0, new Wait (1 / containe) r.stage.frameRate), nouvel AddChild (conteneur, ss))); renvoyer la commande;  écrase la fonction publique createOutroCommand (): Command var blur: BlurFilter = new BlurFilter (BLUR_AMOUNT, BLUR_AMOUNT, 3); var commande: Command = new ParallelCommand (0, // supprime les objets d'affichage new SerialCommand (0, // "THIS" nouveau TweenMaxTo (ss.text1_mc, OUT_TIME, alpha: 0, blurFilter: blur), // "IS" nouveau TweenMaxTo (ss.text2_mc, OUT_TIME, alpha: 0, flouFilter: flou), // "SCENE" nouveau TweenMaxTo (ss.text3_mc, OUT_TIME, alpha: 0, flouFilter: flou), // "1" nouveau TweenMaxTo (ss.text4_mc, OUT_TIME, alpha: 0, flouFilter: flou), // bouton d'introduction nouveau TweenMaxTo (ss.intro_btn, OUT_TIME, alpha: 0, flouFilter: flou), // scène 2 nouveau TweenMaxTo (ss.scene2_btn, OUT_TIME, alpha: 0, blurFilter: blur), // remove scène 1 sprite new RemoveChild (conteneur, ss)), // remove les écouteurs d'événement new RemoveEventListener (ss.intro_btn, MouseEvent.CLICK, replayIntro), nouveau RemoveEventListener (ss.scene2_btn, MouseEvent.CLICK, gotoScene2)); renvoyer la commande;  fonction privée replayIntro (e: Event): void sceneManager.setScene (new IntroScene (conteneur));  fonction privée gotoScene2 (e: Event): void sceneManager.setScene (new Scene2 (conteneur)); 

Étape 8: Créer Scene2

La classe Scene2 ressemble beaucoup à Scene1; si du texte a été changé:

 package import commands.Command; importer commands.display.AddChild; importer commands.display.RemoveChild; importer commands.events.AddEventListener; importer commands.events.RemoveEventListener; importer commands.greensock.TweenMaxFrom; importer commands.greensock.TweenMaxTo; import commands.ParallelCommand; import commands.SerialCommand; import commands.utils.SetProperties; importer commands.utils.Wait; import flash.display.Sprite; import flash.events.Event; import flash.events.MouseEvent; import flash.filters.BlurFilter; importer des scènes.Scene; Classe publique Scene2 extend Scene // paramètres de constante private static const IN_TIME: Number = 0.4; Const statique privée OUT_TIME: Number = 0.2; Const statique privée DELAY_TIME: Number = 0.2; Constante statique privée BLUR_AMOUNT: Number = 20; conteneur var privé: Sprite; var privé: Scene2Sprite; Var flou privé: BlurFilter; fonction publique Scene2 (conteneur: Sprite) this.container = conteneur; ss = new Scene2Sprite ();  écrase la fonction publique createIntroCommand (): Command var commande: Command = new ParallelCommand (0, // "... AND" new TweenMaxFrom (ss.text1_mc, IN_TIME, x: -400), // "THIS IS" new TweenMaxFrom (ss.text2_mc, IN_TIME, y: -250, retard: DELAY_TIME), // "SCENE" nouveau TweenMaxFrom (ss.text3_mc, IN_TIME, y: 250, retard: DELAY_TIME * 2), // " 2 "nouveau TweenMaxFrom (ss.text4_mc, IN_TIME, x: 400, retard: DELAY_TIME * 3), // bouton d'introduction nouveau SerialCommand (0, nouveau TweenMaxFrom (ss.intro_btn, IN_TIME, y: 250, délai: DELAY_TIME) * 4), nouvel AddEventListener (ss.intro_btn, MouseEvent.CLICK, replayIntro)), // bouton de la scène 1 nouveau SerialCommand (0, nouveau TweenMaxFrom (ss.scene1_btn, IN_TIME, y: 250, délai: DELAY_TIME * 5 ), new AddEventListener (ss.scene1_btn, MouseEvent.CLICK, gotoScene1)), // déplace le sprite de la scène 2 au centre du conteneur, nouveau SetProperties (ss, x: 300, y: 200), // ajoute le scène 2 image-objet dans le conteneur // attente d'une image pour permettre le déplacement d'éléments dans les emplacements appropriés new SerialCommand (0, new Wait (1 / container.stage.frameRate), nouvel AddChild (conteneur, ss))); renvoyer la commande;  écrase la fonction publique createOutroCommand (): Command var blur: BlurFilter = new BlurFilter (BLUR_AMOUNT, BLUR_AMOUNT, 3); var commande: Command = new ParallelCommand (0, // supprime les objets d'affichage new SerialCommand (0, // "THIS" nouveau TweenMaxTo (ss.text1_mc, OUT_TIME, alpha: 0, blurFilter: blur), // "IS" nouveau TweenMaxTo (ss.text2_mc, OUT_TIME, alpha: 0, flouFilter: flou), // "SCENE" nouveau TweenMaxTo (ss.text3_mc, OUT_TIME, alpha: 0, flouFilter: flou), // "2" nouveau TweenMaxTo (ss.text4_mc, OUT_TIME, alpha: 0, flouFilter: flou), // bouton d'introduction nouveau TweenMaxTo (ss.intro_btn, OUT_TIME, alpha: 0, flouFilter: flou), // scène 1 nouveau bouton TweenMaxTo (ss.scene1_btn, OUT_TIME, alpha: 0, blurFilter: blur), // remove scène 1 sprite new RemoveChild (conteneur, ss)), // remove les écouteurs d'événement new RemoveEventListener (ss.intro_btn, MouseEvent.CLICK, replayIntro), nouveau RemoveEventListener (ss.scene1_btn, MouseEvent.CLICK, gotoScene1)); renvoyer la commande;  fonction privée replayIntro (e: Event): void sceneManager.setScene (new IntroScene (conteneur));  fonction privée gotoScene1 (e: Event): void sceneManager.setScene (new Scene1 (conteneur)); 

Tester le film

C'est vrai, nous avons enfin fini! Appuyez sur CTRL + ENTRÉE dans l'IDE Flash pour tester le film et voir les transitions fluides et transparentes entre les scènes..


Conclusion

Dans ce tutoriel, nous avons construit nos propres cadres de gestion de commandes et de scènes. Nous avons parcouru beaucoup de code, mais cela en vaut la peine. Maintenant que nous avons ces frameworks sous la main, la gestion de la scène se fait avec un code facilement compréhensible et maintenable. Chaque application Flash peut être décomposée en scènes et chaque scène est composée de commandes d'introduction et de sortie. Les instructions sont encapsulées dans des commandes, ce qui permet d'obtenir une "apparence de code" uniforme, ce qui nous permet de gérer l'intrusion et la sortie de scène de manière très détaillée..

J'espère que ça vous a plu, merci d'avoir lu!