Voici un tuto Flash / ActionScript sous forme d'une formation complète qui vous permettra de présenter :  vos créations, vos produits, vos news, etc... Les éléments ainsi présentés seront mis en valeur grâce à la classe TweenMax (pour ajouter des rotations 3D aux images chargées). Sachez aussi que vous pourrez présenter autant de projets que vous le voudrez, il n'y a aucune restriction à ce niveau.

Ce portfolio offre aussi la possibilité de régler la vitesse de défilement entre chaque élément et ceci depuis un slider avec animation des unités de vitesse. Vous aurez aussi la possibilité d'afficher vos images avec un titre, une description et une adresse d'aperçu. Il sera enfin possible de renvoyer les utilisateurs vers une url. Pour finir, ce portfolio propose une large gamme de boutons liés à la navigation, vous trouverez par exemple: un bouton suivant et précédent (pour le déplacement entre vos différents produits), un bouton play et pause (utile pour prendre le temps de visionner un produit et pour relancer simplement la lecture).

Fonctionnalité du Portfolio Flash:

•  Aucune restriction du nombre d'éléments à présenter
•  Affichage des images avec rotation 3D
• Un module avec fermoir pour présenter les produits (titre, description, lien)*
•  Slider de vitesse avec animation des niveaux de vitesse
•  Animation de texte: lueurs, clignotement, fondu, effet carbone.
• Paramétrage simplifié (utilisation des méthodes getter et setter)
• Possibilité de choisir le sens de défilement (Slider.mode=">" && mode="<")
• Mise en place simplifiée via un fichier xml (sans utilisation du logiciel Flash)
• Bouton de navigation suivant et précédent avec états: désactivé, over et out
• Bouton de lecture et de pause
• Un design soigné et pas mal d'outils simples à utiliser

Voici les grandes étapes de ce tuto Flash:

I°) Mise en place du design de notre portfolio dynamique xml :

• Mise en place de la structure principale (background, reflet, ombrages)
• Import de textures, utilisation du placage de motif
• Création des boutons suivant > précédent (animation des états: over, out, désactivé)
• Création du module de description, animation du fermoir, décoration
• Mise en place des textes animés, effet de reflet et de clignotement
• Mise en place des boutons de lecture et pause (gestion des états)
• Mise en place du conteneur d'image
• Mise en place du slider (paramétrage via l'inspecteur de composants)
• Création du module de niveau de vitesse (barres de 1 à 10)
• Barre de préchargement personnalisée avec affichage du pourcentage chargé, la barre est liée à la largeur de la scène (50% du chargement >> 50% de la largeur de la scène)

II°) Mise en place de la partie développement:
A)Mise en place du fichier folio.xml

• Mise en place de la balise principale: version et encodage
• Structure des nœuds
• paramètres (id, image, content, title, etc)
• Ajout de produit

B) Création de la classe SliceMenu.as

• Mise en place de la structure de la classe (package, classe, constructeur)
• Regroupement de l'ensemble des import liés au projet
• Mise en place des variables et constantes du projet
• Préparation des paramètre, pour lecture et écriture (getter setter)
• Initialisation du projet : création du preloader, ajout de la majorité des listeners
• Vérification de la validité des paramètre passés à la classe
• Récupération des données xml
• Gestion avancée des erreurs de chargements xml (affichage de message personnalisé directement dans l'interface via un texte dynamique formater et embedé)
• Gestion du déplacement vers la droite des produits (gestion du bouclafe)
• Gestion du déplacement vers la gauche des produits (gestion du bouclafe)
• Initialisation des produits (gestion des images, titres, description, url)
• Gestion de la navigation du lien texte via TextEvent.LINK
• Mise en place de la progression du chargement de l'image actuelle (progressBar)
• Placement dynamique de l'image via la classe TweenMax
• Gestion optimisé du réglage de la vitesse (gestion via le Slider, calcules inversés)
• Mise en place de la méthode play(), elle offre une lecture rapide du portfolio
• Regroupement des événements over et out lié à l'ensemble des boutons du projet

C)Mise en place de la classe Init.as

• Mise en place de la structure de la classe (package, classe, constructeur)
• Création d'une instance de notre portfolio
• Paramétrage simplifiée (durée, activeSeconde, mode,urlXML)
• Lecture du portfolio
• Ajout à la liste d'affichage

III°) Correction des erreurs que vous pouvez rencontrer

• Comment bien utiliser le panneau "erreurs de compilation"
• Les warning
• Retrouver une instance null dans les méandres de votre code

IV°)Les fichiers sources:

• Le fichier fla et swf pour flash cs4
• Le fichier folio.xml avec des exemples concrets
• La classe SliceMenu.as
• La classe Timeout et StringUtils
• Le pack d'images pour une utilisation immédiate
• Une image pour l'utilisation de motifs dans flash
• Les fonts utilisées dans le projet

Attention pour que l'application puisse fonctionner correctement, vous devez utiliser au minimum, la version 10 du flash player, au cas contraire vous devrez simplifier le déplacement de l'image en utilisant une rotation basique.