ActionScript Facile
Chapitre 10
Création du Graphisme des Composants AS3 Facile

Date de publication : 8 décembre 2010.

Par Matthieu (Accueil) (Blog)
 

Article original : ActionScript-Facile.com - Création du Graphisme des Composants AS3 Facile

Commentez cet article : 1 commentaire Donner une note à l'article (4.5)

Viadeo Twitter Google Bookmarks ! Facebook Digg del.icio.us MySpace Yahoo MyWeb Blinklist Netvouz Reddit Simpy StumbleUpon Bookmarks Windows Live Favorites      



I. Introduction
II. Conception du graphisme d'un composant AS3
II-A. Création des classes skins
II-B. Création des graphismes
III. Utilisation des composants
IV. Conclusion
IV-A. Évolutions des fonctionnalités
IV-B. Sources commentées
IV-C. Quels graphismes avez-vous créé pour les composants AS3 Facile ?
V. Remerciements / Téléchargements


I. Introduction

Dans ce nouveau chapitre, nous allons aborder de nouvelles fonctionnalités du framework de composants AS3 facile :

  • la création des graphismes des composants.
  • le changement de graphisme pendant l'exécution de l'application Flash.

II. Conception du graphisme d'un composant AS3

Le Chapitre 3 – Les fonctionnalités d'une bibliothèque de composants AS3, montre une fonctionnalité particulièrement intéressante des composants AS3 Facile : chaque composant est personnalisable graphiquement.

Pour personnaliser graphiquement un composant, deux étapes suffisent :

  • créer la classe de Skin pour le composant.
  • créer les graphismes dans un fichier fla (MoviesClip, images, dessin vectoriel...).

II-A. Création des classes skins

La première étape consiste à créer la classe de skin pour le composant choisi.

Cette classe de "graphisme" étend la classe Skin du framework AS3 facile et contient la configuration des graphismes du fla qui seront utilisés. Appelons cette classe DefaultComponentSkin.as.

Pour chaque élément du composant, nous affectons une classe graphique (un movieclip ou un sprite par exemple). C'est-à-dire que chacun des graphismes du fla correspond à un élément du composant.

Le graphisme de l'élément est ensuite associé à une constante de la classe du composant.

Tous les composants possèdent des constantes de skin.

Ci-dessous, un exemple illustrant mes explications.

Pour le composant Button, dans le code source de cette classe, il y a trois constantes :

Button.as
static public const BUTTON_UP_SKIN:String = "BUTTON_UP_SKIN";
static public const BUTTON_DOWN_SKIN:String = "BUTTON_DOWN_SKIN";
static public const BUTTON_OVER_SKIN:String = "BUTTON_OVER_SKIN";
Le composant ComboBox possède des constantes supplémentaires, il est beaucoup plus complet.
ComboBox.as
/**
 * On définit les constantes de skin
 */
public static const COMBOBOX_BUTTON_OVER_SKIN:String = 'COMBOBOX_BUTTON_OVER_SKIN';
public static const COMBOBOX_BUTTON_UP_SKIN:String = 'COMBOBOX_BUTTON_UP_SKIN';
public static const COMBOBOX_BUTTON_DOWN_SKIN:String = 'COMBOBOX_BUTTON_DOWN_SKIN';
 
public static const COMBOBOX_ELEMENT_OVER_SKIN:String = 'COMBOBOX_ELEMENT_OVER_SKIN';
public static const COMBOBOX_ELEMENT_UP_SKIN:String = 'COMBOBOX_ELEMENT_UP_SKIN';
public static const COMBOBOX_ELEMENT_DOWN_SKIN:String = 'COMBOBOX_ELEMENT_DOWN_SKIN';
Puis, dans la classe DefaultComponentSkin.as, il suffit d'affecter chaque constante du composant à l'élément graphique du fla.

Voici deux exemples de Skin différents pour le composant Button :
com.as3facileexemple.skin.classic.DefaultButtonSkin.as
package com.as3facileexemple.skin.classic
{
	// Import des classes gérant la partie graphique du composant dans le fla (movieclip)
	// Provient de ui.swc (créé avec la compilation de UI.fla)
	import com.as3facile.skin.button.ButtonDownSkin;
	import com.as3facile.skin.button.ButtonOverSkin;
	import com.as3facile.skin.button.ButtonUpSkin;
 
	import com.actionscriptfacile.skin.Skin;
	import com.actionscriptfacile.ui.button.Button;
 
	/**
	 * Définition du skin utilisé pour un composant Button
	 *
	 * @author Matthieu
	 */
	public class DefaultButtonSkin extends Skin
	{
 
		public function DefaultButtonSkin()
		{
			// Affectation de chaque élément du bouton à un skin
			setSkin( Button.BUTTON_DOWN_SKIN , ButtonDownSkin );// élément du bouton, classe graphique (movieclip) associée
			setSkin( Button.BUTTON_OVER_SKIN, ButtonOverSkin );
			setSkin( Button.BUTTON_UP_SKIN , ButtonUpSkin );
		}
 
	}
 
}
com.as3facileexemple.skin.classic.DefaultButtonSkin2.as
package com.as3facileexemple.skin.classic
{
	// Import des classes gérant la partie graphique du composant dans le fla (movieclip)
	// Provient de ui.swc (créé avec la compilation de UI.fla)
	import com.as3facile.skin.button.ButtonDownSkin2;
	import com.as3facile.skin.button.ButtonOverSkin2;
	import com.as3facile.skin.button.ButtonUpSkin2;
 
	import com.actionscriptfacile.skin.Skin;
	import com.actionscriptfacile.ui.button.Button;
 
	/**
	 * Définition du skin utilisé pour un composant Button
	 *
	 * @author Matthieu
	 */
	public class DefaultButtonSkin2 extends Skin
	{
 
		public function DefaultButtonSkin2()
		{
			// Affectation de chaque élément du bouton à un skin
			setSkin( Button.BUTTON_DOWN_SKIN , ButtonDownSkin2 );// élément du bouton, classe graphique (movieclip) associée
			setSkin( Button.BUTTON_OVER_SKIN, ButtonOverSkin2 );
			setSkin( Button.BUTTON_UP_SKIN , ButtonUpSkin2 );
		}
 
	}
 
}

II-B. Création des graphismes

En fonction du composant (Button, List, ComboBox), vous devez créer un fichier fla avec un ou plusieurs éléments graphiques (sprite, MovieClip, images et / ou animation).

Pour connaitre le nom des classes (MovieClip) à créer pour le composant sélectionné, il suffit de regarder la classe DefaultComponentSkin.as que vous venez juste de créer. Elle contient les noms des classes MovieClip du fla.

Par exemple, la création des éléments graphiques du fla du composant VerticalScrollBar implique d'utiliser les noms suivants:

  • ScrollBarBackgroundSkin ;
  • ScrollerButtonDownSkin ;
  • ScrollerButtonOverSkin ;
  • ScrollerButtonSkin ;
  • ScrollUpButtonDownSkin ;
  • ScrollUpButtonOverSkin ;
  • ScrollUpButtonSkin ;
  • ScrollBottomButtonDownSkin ;
  • ScrollBottomButtonOverSkin ;
  • ScrollBottomButtonSkin.
Effectivement, la classe DefaultVerticalScrollbarSkin.as associe les noms ci-dessus aux constantes de la classe VerticalScrollBar.
com.as3facileexemple.skin.classic.DefaultVerticalScrollBarSkin.as
package com.as3facileexemple.skin.classic
{
	import com.actionscriptfacile.ui.scroll.components.VerticalScrollBar;
	import com.actionscriptfacile.ui.scroll.components.ScrollDownButton;
	import com.actionscriptfacile.ui.scroll.components.ScrollUpButton;
	import com.actionscriptfacile.ui.scroll.components.ScrollerButton;
	import com.actionscriptfacile.skin.Skin;
 
	// Import des classes gérant la partie graphique du composant dans le fla (movieclip)
	// Provient de ui.swc (créé avec la compilation de UI.fla)
	import com.as3facile.skin.scroll.ScrollBarBackgroundSkin;
	import com.as3facile.skin.scroll.ScrollBottomButtonSkin;
	import com.as3facile.skin.scroll.ScrollUpButtonSkin;
	import com.as3facile.skin.scroll.ScrollerButtonSkin;
 
	import com.as3facile.skin.scroll.ScrollerButtonDownSkin;
	import com.as3facile.skin.scroll.ScrollerButtonOverSkin;
 
	import com.as3facile.skin.scroll.ScrollUpButtonDownSkin;
	import com.as3facile.skin.scroll.ScrollUpButtonOverSkin;
 
	import com.as3facile.skin.scroll.ScrollBottomButtonDownSkin;
	import com.as3facile.skin.scroll.ScrollBottomButtonOverSkin;
 
	/**
	 * Définition du skin utilisé pour un composant VerticalScrollBar
	 *
	 * @author Matthieu
	 */
	public class DefaultVerticalScrollBarSkin extends Skin
	{
 
		public function DefaultVerticalScrollBarSkin()
		{
			// background
			setSkin( VerticalScrollBar.SCROLL_VERTICAL_BACKGROUND_SKIN, ScrollBarBackgroundSkin );
 
			//scroller
			setSkin( ScrollerButton.SCROLLER_VERTICAL_DOWN_SKIN, ScrollerButtonDownSkin );
			setSkin( ScrollerButton.SCROLLER_VERTICAL_OVER_SKIN, ScrollerButtonOverSkin );
			setSkin( ScrollerButton.SCROLLER_VERTICAL_UP_SKIN, ScrollerButtonSkin );
 
			// scroll up
			setSkin( ScrollUpButton.SCROLLUP_VERTICAL_DOWN_SKIN, ScrollUpButtonDownSkin );
			setSkin( ScrollUpButton.SCROLLUP_VERTICAL_OVER_SKIN, ScrollUpButtonOverSkin );
			setSkin( ScrollUpButton.SCROLLUP_VERTICAL_UP_SKIN, ScrollUpButtonSkin );
 
			// scroll down
 
			setSkin( ScrollDownButton.SCROLLDOWN_VERTICAL_DOWN_SKIN, ScrollBottomButtonDownSkin );
			setSkin( ScrollDownButton.SCROLLDOWN_VERTICAL_OVER_SKIN, ScrollBottomButtonOverSkin );
			setSkin( ScrollDownButton.SCROLLDOWN_VERTICAL_UP_SKIN, ScrollBottomButtonSkin );
		}
 
	}
 
}
Ensuite, il vous reste à créer le fla avec les classes correspondantes.

Par exemple, pour créer le skin du composant Button, il est nécessaire de créer trois MovieClip (ou sprite) différents. Un MovieClip par état du bouton (survolé, appuyé, normal).

Pensez-bien à paramétrer les propriétés de chacun des MovieClip :

  • Cochez la case Export For ActionScript
  • Cochez la case Export in frame 1
  • La Class : permet d'utiliser le graphisme du composant dans votre code AS3. C'est le nom de votre classe (associée à la constante du composante) utilisée dans la classe qui étend Skin.as, dans cet article : DefaultComponentSkin.as.
  • La Base Class : permet de définir les propriétés de votre graphisme / composant disponible pour votre code AS3. Cela peut être Sprite ou MovieClip par exemple.
Une copie d'écran pour illustrer mes explications :

Propriétés des Sprite dans Adobe Flash
Propriétés des Sprite dans Adobe Flash
Les graphismes définis dans le fla sont très basiques. Libre à vous d'insérer des images, des animations, des dessins vestoriels plus créatifs et recherchés.

Il y a énormément de possibilités pour personnaliser les composants du Framework Actionscript-Facile. Vous pouvez utiliser des images png, jpg, des animations, des dessins vectoriels...

Le principe de création des skins est identique pour chacun des composants. Il y a plus ou moins de MovieClip à créer suivant les états graphiques possibles du composant.

Ensuite, une fois le fla créé, vous pouvez l'exporter soit au format swc ou au format swf. C'est en fonction de la manière dont vous souhaitez utiliser les MovieClip avec votre code AS3.

Pour cet exemple, nous allons exporter le fla au format swc pour intégrer directement les classes graphiques avec l'éditeur AS3 de notre choix.

Pour développer simplement en ActionScript, je vous conseille l'éditeur FDT PowerFlasher : l'essayer, c'est l'adopter.


III. Utilisation des composants

Tous les composants du framework ActionScript-Facile s'utilisent de la même façon.

Ils possèdent tous des fonctionnalités communes :

  • personnalisation des graphiques,
  • possibilité de l'afficher ou non dans la DisplayList,
  • intéractions possibles avec l'utilisateur.
La première étape est de créer une nouvelle instance de notre composant. Par exemple, pour un Button, il suffit d'écrire le code suivant :
Button.as
var button:Button = new Button();
Deuxième étape : en fonction du composant utilisé, vous définissez ses paramètres. Ci dessous, la création d'un composant Button et d'une liste.
List.as
// création un objet de type Button
var button:Button = new Button();
 
// définition du texte
button.label = 'Button Component';
 
// création d'une liste
var list:List = new List();
 
// définition de la taille de la List
list.resize( 230, 150 );
 
// ajout de plusieurs éléments dans la liste
for ( var i:int = 0; i < 35; i++ )
{
	list.addElement( getListElement(i+1) );
}
La troisième étape consiste à affecter à notre composant le skin que nous lui avons conçu.
Un simple button.applySkin( new DefaultButtonSkin() ); met à jour le graphisme de notre composant.
Ou list.applySkin( new DefaultListSkin() ); pour le composant List.

En route pour la quatrième étape !
Il nous reste à positionner notre composant sur la scène et à l'afficher. Bien évidemment, il est possible de paramétrer les options de notre composant : modifier sa taille, le style de son texte...
Exemple.as
// ajout à la displaylsit
addChild( button );
 
// définition de sa taille en 150 * 30 pixels
button.resize( 150, 30 );
 
// définition de la position du button sur la scène
button.x = 60;
button.y = 60;
button.labelField.alignCenter(); // centre le texte
button.labelField.changeFormat("color", 0xffffff);// changement de la couleur du texte
button.labelField.changeFormat("size", 14);// changement de la taille de la police du texte
 
// détermination de la position de la List
list.x = 30;
list.y = 30;
 
// affichage - ajout à la displaylist
addChild( list );
 
// ajout des marges au contenu de la liste
list.margins = new UIMargins( 5, 5, 5, 5 )
La cinquième et dernière étape est plus ou moins compliquée en fonction de l'application flash que vous crééez.
Vous avez la possibilité d'écouter les actions de l'utilisateur.

En fonction des interactions de l'utilisateur, l'application flash peut :
  • afficher / masquer telle ou telle partie de l'interface,
  • modifier le titre d'un élément,
  • inviter l'utilisateur à effectuer une action dans votre application,
  • etc.
Ci-dessous le code source complet d'utilisation des composants que nous avons créés.
DeveloppezExample.as
package
{
	import flash.events.MouseEvent;
	import flash.display.Shape;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.text.Font;
 
	import com.as3facileexemple.skin.classic.DefaultListSkin;
	import com.as3facileexemple.skin.classic.DefaultButtonSkin;
	import com.as3facileexemple.skin.classic.DefaultButtonSkin2;
	import com.as3facileexemple.skin.classic.DefaultListSkin2;
	import com.as3facileexemple.skin.classic.DefaultComboBoxSkin;
 
	import com.actionscriptfacile.ui.button.Button;
	import com.actionscriptfacile.ui.list.List;
	import com.actionscriptfacile.ui.utils.UIMargins;
	import com.actionscriptfacile.ui.combo.element.ComboBoxElement;
	import com.actionscriptfacile.ui.combo.ComboBox;
	import com.actionscriptfacile.ui.text.UITextField;
 
	/**
	 * Exemple d'utilisation du Framework de composants AS3 ActionScript-Facile
	 *
	 * @author Matthieu
	 */
	public class DeveloppezExample extends Sprite
	{
 
		protected var m_comboFonts:ComboBox;
		protected var m_list:List;
		protected var m_textField:UITextField;
 
		public function DeveloppezExample()
		{
			/**
			 * On construit les boutons
			 */
			var buttonHide:Button = new Button();
 
			// définition du texte
			buttonHide.label = 'Arc en Ciel Liste';
 
			// Application du skin par défaut
			// [ Attention ! Ce skin utilise le fichier ui.swc qui doit être ajouté à la liste des composants à passer au compilateur ]
			buttonHide.applySkin( new DefaultButtonSkin() );
 
			// on écoute les changements qui interviennent sur le bouton
			buttonHide.addEventListener(MouseEvent.CLICK, changeSkinList );
 
			// ajout à la displaylist
			addChild( buttonHide );
 
			// définition de sa taille en 150 * 30 pixels
			buttonHide.resize( 150, 30 );
 
			// définition de la position du button sur la scène
			buttonHide.x = 10;
			buttonHide.y = 220;
 
			// acccès au composant de type UITextField (labelField)
			buttonHide.labelField.alignCenter(); // centre le texte
			buttonHide.labelField.changeFormat("color", 0xffffff);// changement de la couleur du texte
			buttonHide.labelField.changeFormat("size", 14);// changement de la taille de la police du texte
			buttonHide.labelField.changeFormat("font", "Arial");// changement de la police du texte
 
			var buttonShow:Button = new Button();
 
			// définition du texte
			buttonShow.label = 'Classique Liste';
 
			// Application du skin par défaut
			// [ Attention ! Ce skin utilise le fichier ui.swc qui doit être ajouté à la liste des composants à passer au compilateur ]
			buttonShow.applySkin( new DefaultButtonSkin2() );
 
			// on écoute les changements qui interviennent sur le bouton
			buttonShow.addEventListener(MouseEvent.CLICK, changeSkinList2 );
 
			// ajout à la displaylist
			addChild( buttonShow );
 
			// définition de sa taille en 150 * 30 pixels
			buttonShow.resize( 150, 30 );
 
			// définition de la position du button sur la scène
			buttonShow.x = buttonHide.x;
			buttonShow.y = buttonHide.y + buttonShow.height + 10;
 
			// acccès au composant de type UITextField (labelField)
			buttonShow.labelField.alignCenter(); // centre le texte
			buttonShow.labelField.changeFormat("color", 0xff33ff);// changement de la couleur du texte
			buttonShow.labelField.changeFormat("size", 14);// changement de la taille de la police du texte
			buttonShow.labelField.changeFormat("font", "Arial");// changement de la police du texte
 
			/**
			 * On construit la liste
			 */
			m_list = new List();
 
			// Application du skin par défaut
			// [ Attention ! Ce skin utilise le fichier ui.swc qui doit être ajouté à la liste des composants à passer au compilateur ]
			m_list.applySkin( new DefaultListSkin2() );
 
			// définition de la taille de la List
			m_list.resize( 230, 150 );
 
			// ajout de plusieurs éléments dans la liste
			for ( var i:int = 0; i < 35; i++ )
			{
				m_list.addElement( getListElement(i+1) );
			}
 
			// détermination de la position de la List
			m_list.x = 200;
			m_list.y = buttonHide.y;
 
			// ajout des marges au contenu de la liste
			m_list.margins = new UIMargins( 5, 10, 5, 5 );
 
			// affichage - ajout à la displaylist
			addChild( m_list );
 
			/**
			 * On construit la combobox
			 */
			m_comboFonts = new ComboBox();
			m_comboFonts.applySkin( new DefaultComboBoxSkin() );
 
			// on écoute les changements qui interviennent dans la combobox
			m_comboFonts.addEventListener(Event.CHANGE, changeHandler );
			m_comboFonts.resize( 300, 70 );
			m_comboFonts.componentsHeight = 25;// hauteur des éléments de la CombobBox
			m_comboFonts.margins = new UIMargins( 2, 2, 2, 2 );// ajout des marges au contenu de la liste
 
			/**
			 * Définition du format du titre de la ComboBox.
			 *
			 * Remarquez l'utilisation du paramètre true pour définir le format par défaut de notre titre
			 */
			m_comboFonts.currentElement.labelField.changeFormat("font", "Arial",-1,-1,true);
			m_comboFonts.currentElement.labelField.changeFormat("color", Math.random() * 0X00FFFFFF,-1,-1,true);
			m_comboFonts.currentElement.labelField.changeFormat("size", 15,-1,-1,true);
			m_comboFonts.currentElement.labelField.changeFormat("bold", true,-1,-1,true);
			m_comboFonts.currentElement.labelField.alignCenter();
 
			// on ajoute tous les noms de polices autorisées comme élément de la combobox
			var fonts:Array = Font.enumerateFonts( true );
 
			var boxElement:ComboBoxElement;
 
			for each ( var font:Font in fonts )
			{
				boxElement = m_comboFonts.addElement( font.fontName, font.fontName );
				boxElement.labelField.changeFormat("color", Math.random() * 0X00FFFFFF);// changement de la couleur du texte
				boxElement.labelField.changeFormat("size", 14);// changement de la taille de la police du texte
			}
 
			/**
			 * On construit un UITextField
			 */
			m_textField = new UITextField();
			m_textField.text = 'Développez avec fun  ';
 
			m_textField.x = m_textField.y = 5;
			m_textField.width = m_textField.maxWidth = 390;
			m_textField.height  = m_textField.maxHeight = 30;
			m_textField.changeFormat("size", 20);// changement de la taille de la police du texte
			m_textField.changeFormat("color", Math.random() * 0X00FFFFFF);// changement de la couleur
 
			m_comboFonts.y = m_textField.y + m_textField.height;
			m_comboFonts.x = 20;
 
			addChild( m_comboFonts );
			addChild( m_textField );
		}
 
		/**
		 * Fonction servant à écouter le changement de police au sein de la combobox.
		 * On applique la police à l'UITextField que l'on a crée et placé sur la
		 * scène.
		 *
		 * @param	e	Evènement de type MouseEvent.CLICK
		 */
		private function changeHandler(e:Event):void
		{
			m_textField.font = m_comboFonts.currentLabel;
			m_textField.changeFormat("color", Math.random() * 0X00FFFFFF);// changement de la couleur
		}
 
		/**
		 * Fonction servant à écouter les click de l'utilisateur sur le buttonHide.
		 * On modifie le skin de la List.
		 *
		 * @param	e	Evènement de type MouseEvent.CLICK
		 */
		 private function changeSkinList(e:MouseEvent) : void
		{
			m_list.applySkin(new DefaultListSkin() );
		}
 
		/**
		 * Fonction servant à écouter les click de l'utilisateur sur le buttonHide.
		 * On modifie le skin de la List.
		 *
		 * @param	e	Evènement de type MouseEvent.CLICK
		 */
		private function changeSkinList2(e:MouseEvent) : void
		{
			m_list.applySkin(new DefaultListSkin2() );
		}
 
		/**
		 * Création des éléments du composant List
		 */
		private function getListElement(id:Number):Sprite
		{
			// création de l'élément
			var oElement:Sprite = new Sprite();
 
			// ajout d'un fond avec une couleur aléatoire
			var shp:Shape = new Shape();
			var color:int = Math.random() * 0X00FFFFFF;
 
			shp.graphics.beginFill( color );
			shp.graphics.drawRect( 0, 0, 200, 30 );
			shp.graphics.endFill();
 
			// ajout d'un texte
			var oTxt:UITextField = new UITextField();
 
			// définition de la taille du texte
			oTxt.height = oTxt.maxHeight = 25;
			oTxt.width = oTxt.maxWidth = 195;
 
			oTxt.text = "Élément "+id;
			oTxt.selectable = false;
			oTxt.changeFormat("color", 0xffffff);// changement de la couleur du texte
			oTxt.changeFormat("size", 14);// changement de la taille de la police du texte
			oTxt.changeFormat("font", "Arial");// changement de la police du texte
 
			oTxt.alignCenter();
 
			oTxt.background = false;
			oTxt.backgroundColor = 0xff33ff;
 
			// ajout à la displaylist (le fond et le texte) de l'élément
			oElement.addChild(shp);
			oElement.addChild(oTxt);
 
			return oElement;
		}
	}
 
}

IV. Conclusion

Nous venons donc de découvrir la création de Skin / graphismes pour les composants ActionScript-Facile.

L'application Flash ci-dessous est une démonstration du changement de graphisme en live.



IV-A. Évolutions des fonctionnalités

A vous de créer des applications totalement réutilisables pour vos différents sites.

Par exemple, vous développez un livre d'or avec des graphismes s'accordant à la charte du site de votre client.

Vous pouvez réutiliser la même application, juste en modifiant totalement les graphismes pour votre nouveau client.

C'est génial, le temps que vous pouvez gagner pour vous concentrer sur le visuel, les besoins en terme d'image pour vos clients.


IV-B. Sources commentées

  • DeveloppezExample.as
  • com.actionscriptfacile.ui.button.Button.as
  • com.actionscriptfacile.ui.list.List.as
  • com.actionscriptfacile.ui.utils.UIMargins.as
  • com.actionscriptfacile.ui.combo.element.ComboBoxElement.as
  • com.actionscriptfacile.ui.combo.ComboBox.as
  • com.actionscriptfacile.ui.text.UITextField.as
Vous trouverez ci-dessous l'ensemble des classes créées. Elles sont commentées pour vous permettre de comprendre au mieux leur fonctionnement.
Vous pouvez télécharger le fichier zip : Changement de Skin en live


IV-C. Quels graphismes avez-vous créé pour les composants AS3 Facile ?

Postez-vos exemples de skins dans les commentaires : 1 commentaire Donner une note à l'article (4.5)


V. Remerciements / Téléchargements

Je remercie La Rédactrice Kalyparker pour sa disponibilité et l'ensemble de son travail de mise au gabarit des chapitres du framework AS3 Facile au format Developpez.com.

Merci beaucoup à l'équipe Developpez.com de contribuer à la diffusion des tutoriels de création d'un framework de composants ActionScript 3.

info Téléchargez l'ensemble des classes commentées du framework AS3 Facile (avec le code source et les exemples de tous les composants AS3).


               Version PDF (Miroir)   Version hors-ligne (Miroir)

Valid XHTML 1.0 TransitionalValid CSS!

Copyright © 2010 Matthieu - www.actionscript-facile.com. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts. Cette page est déposée.

 
 
Developpez.com

Nous contacter

Participez

Informations légales

 
Services

Forum Flash / Flex

Blogs

Hébergement

 
Partenaires

Hébergement Web