Outils pour utilisateurs

Outils du site


cours2009:multimedia:projet_basique_une_meilleure_organisation_du_projet

Projet basique : une meilleure organisation du projet

La méthode que je vous ai imposée :

  • Les graphismes sont dans des “FLA” séparés.
  • Le code est regroupé en un seul endroit.

Pose problème quand on compile le projet avec Flash IDE qui est conçu pour dans l'esprit : “un FLA” = “un code source”.

Les raisons de cette démarche sont :

  • Garder la réalisation simple en continuant de compiler avec Flash IDE.
  • Introduire ou mieux présenter des concepts en vous demandant de séparer les différentes pages.

Il vous faut faire un choix pour un vrai projet :

  • Continuer à utiliser Flash IDE, mais revenir à une approche plus classique.
  • Utiliser le compilateur du SDK de Flex : vous avez alors toutes latitudes pour paramétrer l'organisation de votre projet.
    • Remarque : utiliser le SDK de Flex ne signifie pas que l’on abandonne Flash IDE pour la création graphique.

Projet avec Flash IDE

On peut se limiter à l'usage d'un fichier “FLA” pour la compilation. Ou exploiter le fait que le lecteur Flash permet de charger dynamiquement des contenus : Faire un “SWF” par page (donc un “FLA” par pages).

Usage d'un unique FLA pour la compilation

L'usage d'un unique “FLA” est trivial.

Mais j'aimerais vous rappeler que vous pouvez partager des éléments de bibliothèque entre fichiers “FLA”.

Le plus basique est l'option : “Toujours mettre à jour avant la publication”. Vous pouvez, devez, garder les graphismes des pages dans des fichiers “FLA” séparer pour :

  • Faciliter l'édition des contenus.
  • Permettre le travail à plusieurs.

Bref, séparer l'édition du graphisme des pages était loin d'être inutile.

Faire un SWF par page

Si vous souhaiter faire cela avec Flash IDE, je ne saurais trop vous conseiller de regarder du côté de Gaia.

Sinon il y a deux points à comprendre :

  • Charger le contenu d'un autre “SWF” n'est pas vraiment différent de créer l'instance d'une Classe.
    • En fait, le lecteur Flash crée une instance du “SWF” chargé (qui contient des instances de nos graphismes).
  • On peut partager le code (et les instances) entre les “SWF”
    • Vous allez trouver le code intimidant, mais ne retenez que l'intention.

C'est pour cette raison que j'ai présenter le projet de cette façon :

  • Un “FLA” par page.
    • Maintenant on peut charger les pages dynamiquement.
  • Un même code source.
    • On garde commun le code qui gère la navigation entre les pages.
      • On l'exportera comme SWC pour utilisation par les pages.
    • On va simplement replacer le code spécifique à une page avec le “FLA” correspondant.
      • Les pages prendront le code à deux endroits :
        • Comme bibliothèque externe : Le SWC contenant celui commun à toute l'application.
        • Comme code source : un propre a chaque page.

La mise en oeuvre consiste en :

  • Spécifier que les “FLA” des pages publient les “SWF” dans le même dossier (ou sous-dossier) que l'application.
    • Plus besoin de publier un “SWC”, en fait on inverse le processus.
  • Demander à l'application de générer un ficher “SWC”
    • On indique à chaque page d'utiliser le SWC de l'application (comme bibliothèque externe).

C'est un peu embêtant à mettre en place, mais retenez simplement :

  • Ce n'est plus l'application qui utilise les pages.
  • C'est les pages qui utilisent (partage) l'application
    • Application qui charge les pages dynamiquement.

Pour le reste, il faut lire la documentation sur comment charger un SWF. C'est un peu plus long que de taper : new. Mais cela fait la même chose.

Le code qui suit assure que les pages chargées dynamiquement utilisent le code de l'application.

package src0.grZ0.unNom.projet 
{
    import flash.display.MovieClip;
    import flash.display.Loader;
    import flash.net.URLRequest;
    import flash.system.ApplicationDomain;
    import flash.system.LoaderContext;
    import com.asual.swfaddress.SWFAddress;
    import com.asual.swfaddress.SWFAddressEvent;
 
    public class Application extends MovieClip
    {
        private var _ldr:Loader;
 
        public function Application() 
        {
            // l'objet qui fait le chargement
            _ldr = new Loader();
            addChild(_ldr);
            SWFAddress.addEventListener(SWFAddressEvent.CHANGE, swfAddressChange);
            Application.navigueVers("Accueil");
        }
 
        public static function navigueVers(nomPage:String):void
        {
            SWFAddress.setValue(nomPage);
        }
 
        private function swfAddressChange(e:SWFAddressEvent):void 
        {
            var nomPage:String = e.value;
            // Traduit le nom de page en URL du SWF
            var urlPage:String = {
                "/":"PageAccueil.swf",
                "/Accueil":"PageAccueil.swf",
                "/Page1":"Page1.swf",
                "/Page2":"Page2.swf"
            }[nomPage];
            afficheURL(urlPage);
        }
 
        private function afficheURL(urlPage:String):void
        {
            // Supprime le contenu précédent.
            _ldr.unloadAndStop(true);
 
            // Définis le contexte de chargment
            //      comme "enfant" (utilise les classes du parent)
            var ctx:LoaderContext = new LoaderContext(
                false, new ApplicationDomain(ApplicationDomain.currentDomain));
 
            // Demande le chargement de l'URL dans le contexte "enfant".
            _ldr.load(new URLRequest(urlPage), ctx);
        }
    }
}

La classe de document

Une omission de ma part est le fait que je ne vous ai pas fait utiliser la “Classe de document”. C'est la Classe que l’on peut spécifier dans le panneau propriété quand l'on a sélectionnée la scène principale (ou on donne la couleur et la taille du fond).

À la place je vous ai fait placer une unique occurrence d'un symbole associé à une Classe (Application). La raison est que cela à exactement le même effet :

  • La classe du document est associée à une unique instance.
  • Cette instance est créée par Flash.
  • C'est l'instance d'un “Symbole” : celui qui représente le scénario racine (il n'apparait pas dans la bibliothèque).

Donc, si vous utilisez la Classe de document et chargez dynamiquement des SWF : je suis sûr que vous n'aviez pas compris ce qui se passe réellement !

Flashdevelop et SDK de Flex

FlashDevelop rend trivial l'usage du SDK de Flex. Il suffit de télécharger le SDK. Et d'indiquer à FlashDevelop où le trouver.

Le plus grand intérêt de l'usage du SDK de Flex : c'est de permettre de se passer de Flash IDE pour le code.

Par contre, l'on garde Flash IDE pour les graphismes, car il n'a pas d'alternative !

C'est pour cette raison que vous aviez compilé les pages en SWC. Pour pouvoir utiliser les graphismes produits par Flash IDE, il suffit de créer des instances de ceux-ci (après avoir indiqué qu'on les utilisent comme librairie).

Je vous conseille de lire :

Pour ce qui est du chargement dynamique, cela reste identique dans le principe à celui présenté pour Flash IDE. Seul change le fait qu'il faut indiquer les chemins à FlashDevelop (qui pilote le compilateur de Flex).

cours2009/multimedia/projet_basique_une_meilleure_organisation_du_projet.txt · Dernière modification: 2010/05/16 22:00 (modification externe)