Dans ce tutoriel nous allons voir une application de coloriage pour mettre de la couleur dans des sections d'une image .
L'image que vous utiliserez doit etre dans le meme dossier que votre Fla , cette image doit etre une image de type coloriage GIF ( attention sur certaine image GIF ça ne fonctionne pas, peut etre est-ce dû a une mauvaise compression )et nous utiliserons le composant ColorPicker ainsi qu'un composant de bouton .
Pour voir votre Flash sur site internet, il faut impérativement que le fichier HTML ,le SWF et l'image soient dans le meme dossier .
La taille de votre document comprend la taille de votre image plus un espace en bas pour y inclure les composants
Commencez par insérer le composant ColorPicker dans votre document en le faisant glisser sur la scène .
Ouvrez le panneau Composants. Fenêtre> Composants>:
Sur la scène sélectionnez le, allez dans le panneau des Propriétés, donnez lui un nom d'instance : color_picker.
Toujours dans la fenetre des composant faites glisser sur le scene le composant bouton.
Ajoutez au bouton un nom d'instance : reset_btn.
Fichier => nouveau => Classe d'ActionScript 3 et collez le code ci dessous puis enregistrer le en le nommant :Main.as
package
{
import flash.display.*;
import flash.events.*;
import flash.net.*;
import flash.geom.*;
public class Main extends MovieClip
{
private var bitmap:Bitmap;
private var bitmapdata:BitmapData;
private var holder_mc:MovieClip;
private var current_color:uint=0;
public function Main()
{
addEventListener(Event.ADDED_TO_STAGE,init);
}
private function init(evt:Event):void
{
removeEventListener(Event.ADDED_TO_STAGE,init);
reset_btn.label="REFAIRE";
loadImage();
}
private function loadImage():void
{
if(holder_mc!=null)
{
removeChild(holder_mc);
bitmapdata.dispose();
bitmap=null;
holder_mc=null;
}
var request:URLRequest=new URLRequest("VOTRE IMAGE .gif");
var loader:Loader=new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE,onImageLoaded);
loader.load(request);
}
private function onImageLoaded(evt:Event):void
{
bitmap=evt.target.loader.content as Bitmap;
bitmapdata=bitmap.bitmapData;
holder_mc=new MovieClip();
holder_mc.addChild(bitmap);
addChild(holder_mc);
addListeners();
}
private function addListeners():void
{
color_picker.addEventListener(Event.CHANGE,onColorChange);
holder_mc.mouseChildren=false;
//holder_mc.buttonMode=true;
holder_mc.addEventListener(MouseEvent.MOUSE_DOWN, paint);
reset_btn.addEventListener(MouseEvent.MOUSE_DOWN,reset);
}
private function onColorChange(evt:Event):void
{
current_color=evt.target.selectedColor;
}
private function paint(evt:MouseEvent):void
{
var xx:Number=evt.localX;
var yy:Number=evt.localY;
bitmapdata.floodFill(xx,yy,current_color);
}
private function reset(evt:MouseEvent):void
{
loadImage();
}
}
}
Note: les parties en rouge sont:
pour le 1er: le nom qui va apparaitre sur votre bouton sur le 2em: le nom de votre image.gif
Revenir sur votre document et dans les propiétés n'oubliez pas de mettre la classe a celui ci
Testez votre animation et faites des arrangements s'il y a lieu .
Bon Flash !
tutoriel traduit du site Flepstudio