lundi 10 août 2009

Utilisations des clips de la bibliothèque pour l’AS

Il est important de savoir importer des éléments de la bibliothèque pour l’ActionScript pour dupliquer et dynamiser une séquence.

Activer l'exportation

Vous avez deux possibilités pour exporter un clip pour ActionScript. La première consiste à donner les paramètres d’exportation dès la création du clip (CTRL+F8 pour créer un nouveau symbole), puis d’activer le mode Avancé :



L’autre méthode serait de modifier les paramètres d’exportation en effectuant, à partir de la bibliothèque, un clique-droit sur le clip souhaité puis de choisir Propriétés....

Cochez la case «Exporter pour ActionScript», puis rentrer dans le champ «Classe» le nom d’utilisation.

ActionScript permettant d'ajouter dynamiquement un clip dans la scène

Pour ajouter un clip dans la scène, il faut dans un premier temps stocker le clip dans une variable du même type que le symbole à ajouter :

//Stock le clip voiture dans la variable nVoiture :
var nVoiture:voiture = new Voiture;

La variable nVoiture peut alors être considérée comme une occurence du clip voiture.
Il faut maintenant l’ajouter à la scène :

//Ajoute l’occurence de voiture dans la scène :
addChild(nVoiture);

Lorsque vous compilez le projet, vous pourez remarquer que la voiture a bien été ajoutée à la scène.
Par défaut, les coordonnées sont x=0 et y=0, mais vous pouvez ajouter les paramètres que vous voulez de cette façon :

//Stock le clip voiture dans la variable nVoiture :
var nVoiture:Voiture = new Voiture;
//Position en x de la voiture :
nVoiture.x = 200;
//Position en y de la voiture :
nVoiture.y = 350;
//Opacité de la voiture :
nVoiture.alpha = 0.5;
//Ajoute l’occurence de voiture dans la scène :
addChild(nVoiture);

N.B. : Attention à la casse, Flash fait la différence entre les caractères en majuscules et ceux en minuscules. Dans notre exemple le nom d’exportation Voiture à la première lettre en majuscule, il faut donc utiliser cette casse dans l’ActionScript.

Ajouter plusieurs clips aléatoirement

Pour ajouter de façon aléatoires plusieurs clip dans la scène, il faut utiliser une boucle, nous utiliserons la boucle for pour notre exemple.

//Tant que i est inférieur à 5, on éxécute l’instruction suivante :
for(var i:uint = 0; i++) {
//Stock le clip voiture dans la variable nVoiture :
var nVoiture:Voiture = new Voiture;
//Position aléatoirement en x la voiture :
nVoiture.x = Math.random()*stage.stageWidth;
//Position aléatoirement en y la voiture :
nVoiture.y = Math.random()*stage.stageHeight;
//Ajoute l’occurence de voiture dans la scène :
addChild(nVoiture);
}

La boucle for permet de réitérer une ou plusieurs instructions utilisant une variable, pour une plage de valeurs définies.

Le traitement d’une boucle for nécessite 3 expressions :
  1. une variable qui est placée à une valeur initiale
  2. une condition qui détermine la limite de la plage de valeurs
  3. une expression qui change la valeur de la variable après chaque boucle
La variable i est de type uint : Unsigned Integer : chiffre positif entier.
La fonction Math.random() permet de générer un nombre aléatoire de 0 à l’élément qui lui est multiplié, ici stage.stageWidth et stage.stageHeight qui correpondent à la largeur et à la hauteur de la scène.

jeudi 6 août 2009

Utilisation du son dans Flash

Importer du son dans la bibliothèque

Pour importer du son dans la bibliothèque, cliquez sur Fichier > Importer > Importer dans la Bibliothèque...
Le son se trouve alors dans la bibliothèque.

Ajouter du son directement dans une image clef

Pour ajouter du son directement dans une image clef il suffit de cliquez sur l’élément son qui a été préalablement importé dans la bibliothèque puis de le glisser dans la scène :


Le spectre du son apparait alors dans les images du calque sélectionné :


N.B. : Il faut prolonger l’image clef (F5) pour afficher une plus grande partie du spectre audio.

Jouer du son par l'ActionScript

Pour utiliser du son de la bibliothèque à partir de l’ActionScript, il faut dans un premier temps l’exporter : clique droit sur l’élément son puis Propriétés...
Cochez ensuite la case «Exporter pour l’ActionScript», puis donnez un nom à la classe. C’est ce nom qui sera utilisé dans l’ActionScript pour faire appel à l’élément, dans cet exemple nous l’appelerons «musique».

A partir de l’ActionScript il faut créer l’occurence du son puis activer la lecture du son :

//Créer une occurence de l’élément "musique" :
var nMusique:musique = new musique;
//Joue le son :
nMusique.play();

Dans cet exemple le son ne sera joué qu’une fois, puis ensuite coupé.

Jouer une musique en boucle

Pour jouer en boucle une musique il suffit de luis passer les paramètres suivants :

//Joue le son en boucle :
nMusique.play(0, int.MAX_VALUE);

A savoir que int.MAX_VALUE récupère la valeur maximale d’une nombre de entier de type integer, soit 2 147 483 647.
Le son sera alors joué 2 147 483 647 de fois.

Charger un son externe

Il faut dans un premier temps créer un élément de type Sound, et charger le son dans cet élément grâce à une URLRequest :

//Créer l’élément Sound :
var son:Sound = new Sound();
//On ajoute le chemin du son dans la variable URLSon :
var URLSon:URLRequest = new URLRequest("mp3/musique.mp3");
//Charge le son à partir de l’url spécifiée :
son.load(URLSon);
//Joue le son
son.play();

La musique à charger (musique.mp3) se trouve dans le dossier MP3 qui se trouve à la racine du fichier.

Jouer sur le volume du son

Pour régler le volume d’une musique il faut ajouter un canal audio et placer le son dans ce canal.
Ensuite, on ajoute un transformeur de son (SoundTransform) qui permet de gérer certaines propriétés comme le volume, la balance ou encore le croisement stéréo.

//Créer l’élément Sound :
var son:Sound = new Sound();
//On ajoute le chemin du son dans la variable URLSon :
var URLSon:URLRequest = new URLRequest("mp3/musique.mp3");
//Création du canal audio :
var canal:SoundChannel = new SoundChannel();
//Création du controleur audio :
var controle:SoundTransform;
//Charge le son à partir de l’url spécifiée :
son.load(URLSon);
//Ajoute le son au canal et le joue :
canal = son.play();
//Indique au controle le canal à modifier :
controle = canal.SoundTransform;
//Ajuste le volume :
controle.volume = 0.5;
//Applique la transformation au canal :
canal.SoundTransform = controle;

Volume = 0 : pas de son, volume = 1 son à 100%.
Pan = -1 : son dans le haut parleur de gauche, pan = 1 : son dans le haut parleur de droite.

N.B. : Les formats audio lisible par Flash sont les suivants : MP3, WAV, .M4A, .M4V, .AAC, .3GP et .MP4.
Flash peut jouer jusqu’à 32 sons simultanéments.

Quelques sites proposants des sons gratuits :

jeudi 5 mars 2009

Menu accordéon Flash AS3

Comment peut-on créer un menu de type accordéon en Flash AS3 ?









Créez dans un premier temps un MovieClip appelé "nomCat" qui servira de bouton pour appeler les catégories, insérez-y les éléments suivants :

  • un champ de texte dynamique ayant comme nom d'occurence "cat", celui-ci doit être placé à la vertical,
  • un fond rectangulaire pour le bouton.

Ensuite, créez un deuxième MovieClip nommé "blocBtContenu" et insérez-y les éléments suivants :
  • le MovieClip "nomCat" (coordonnées x:0; y:0),
  • dessinez, à droite de ce MovieClip, un rectangle pour le fond du contenu,
  • créez par dessus ce rectangle, un champ de texte dynamique ayant comme nom d'occurence "contenu".
Il faut ensuite exporter le MovieClip "blocBtContenu" pour l'AS3, nous pourrons ainsi créer dynamiquement les onglets du menu. Pour celà, ouvrez le panneau Bibliothèque puis effectuez un clique droit sur le MovieClip "blocBtContenu", sélectionnez "Propriétés" et cochez (dans la nouvelle fenêtre qui s'ouvre) la case "Exporter pour ActionScript".


Venons au code AS3 permettant de créer et d'animer le menu accordéon :
Copier/coller le code suivant dans la première image clef de votre Fla :
/**************************************************************/
//Importation des class de gestion du mouvement des onglets :
/**************************************************************/
import fl.transitions.easing.*;
import fl.transitions.Tween;


/**************************************************************/
//Initialisation des variables :
/**************************************************************/
//Contenu :
var elements:Array = new Array("Accueil", "Qui sommes-nous", "Services", "Produits", "Contact");
var contenu:Array = new Array("Contenu 1", "Contenu 2", "Contenu 3", "Contenu 4", "Contenu 5");

var site:Sprite = new Sprite();
var element:MovieClip;
var i:int;


/**************************************************************/
//Création des éléments :
/**************************************************************/
for(var elt:* in elements) {
var bloc:blocBtContenu = new blocBtContenu;
bloc.bt.buttonMode = true;
bloc.bt.mouseChildren = false;
bloc.bt.cat.text = elements[elt];
bloc.contenu.text = contenu[elt];
bloc.x = (bloc.bt.width+1) * elt;
bloc.bt.addEventListener(MouseEvent.CLICK, ouvrirFermer);
site.addChild(bloc);
}


//On affiche le premier onglet après la création de tous les éléments :
for(i=1; i<=site.numChildren-1; i++) {
element = site.getChildAt(i) as MovieClip;
element.x = ((element.bt.width+1) * (i-1)) + element.width;
}


//Création du masque :
var masque:Shape = new Shape();
masque.graphics.beginFill(0x000000);
masque.graphics.drawRect(0,0,((elements.length-1) * (MovieClip(site.getChildAt(0)).bt.width+1))+MovieClip(site.getChildAt(0)).width, MovieClip(site.getChildAt(0)).height);

//Ajoute le masque et le site sur la scène :
addChild(masque);
addChild(site);

//Applique le masque créé dynamiquement au site :
site.mask = masque;


/**************************************************************/
//Fonction permettant d'ouvrir/fermer les onglets :
/**************************************************************/
function ouvrirFermer(e:MouseEvent) {
try {
//Récupère l'élément à ouvrir :
var index:int = site.getChildIndex(e.target.parent)+1;
if(index <= site.numChildren) {
//Rabat tous les éléments vers la gauche :
for(i=0; i
element = site.getChildAt(i) as MovieClip;
new Tween(element, "x", Regular.easeOut, element.x, (element.bt.width+1)*i, 30);
}
//Pousse tous les éléments vers la droite :
for(i=index; i<=site.numChildren-1; i++) {
element = site.getChildAt(i) as MovieClip;
new Tween(element, "x", Regular.easeOut, element.x, ((element.bt.width+1) * (i-1)) + element.width, 30);
}
}
} catch(pErreur:Error) {
//Si il y a un problème, on affiche l'erreur :
trace("Erreur : \n" + pErreur); 
}
}

TELECHARGER LA SOURCE .FLA :

Problèmes pouvant être rencontrés :
Le nom des catégories ne s'apparait pas à la vertical : vérifiez que vous ayez bien intégré les polices de caractères au SWF si vous n'utilisez pas une police système de type Arial ou encore Time New Roman. Pour intégrez les polices : bouton "Intégration de caractères" dans le panneau propriété lorsque vous sélectionnez le texte. Choisissez ensuite la liste des caractères à intégrer.

mardi 7 octobre 2008

Error #2044: IOErrorEvent

Lorsque vous compilez votre fichier flash en swf, il est possible que Flash vous affiche l'erreur suivante :

Error #2044: IOErrorEvent non pris en charge : text=Error #2035: L'URL est introuvable.

Ou si vous utilisez un ecouteur de ce type :

loader.addEventListener(IOErrorEvent.IO_ERROR, afficheErreur);
function afficheErreur(error:IOErrorEvent):void {
trace(error);
}

Il se peut que vous ayez cette erreur qui en ressorte :

[IOErrorEvent type="ioError" bubbles=false cancelable=false eventPhase=2 text="Error #2032: Erreur de flux. URL: ...]

Il existe plusieurs solutions pour corriger l'erreur suivante sous Flash,

Problème lors de l'écriture de l'URL :
Vérifiez que l'URL que vous avez rentré en utilisant la fonction
URLRequest est correcte.
Il se peut également que lorsque vous ayez créé le fichier, celui-ci n'est pas l'extension désirée. Exemple : fichier.xml.txt
Or avec Windows, par défaut l'extension des fichiers connus sont masqués, il faut donc vous rendre dans le panneau de configuration : Démarrer > Paramètres > Panneau de configuration puis dans le panneau Options de dossiers sélectionnez l'onglet Affichage. Vérifiez que Masque les extensions des fichiers dont le type est connu soit bien décoché. Et pour finir revérifier l'extension de votre fichier.

Problème de cache :
Même si vous apportez des modifications sur le fichier que vous chargez en Flash, l'erreur persiste, cela peut venir du cache d'Internet Explorer. En effet le Player Flash utilise le système de cache d'Internet Explorer pour charger des URL distantes via la fonction URLRequest.
Il faut donc vider le cache d'Internet Explorer pour résoudre ce problème.

Pour en savoir plus sur le chargement de fichiers en AS3, référé vous à cette adresse :
http://pyrrha.developpez.com/articles/flash/as3/chargement/