mask et draw as3Résolu

Question

bonjours à tous,
Je souhaite créer une vitre gelée qui se "dégel" au passage de la souris.
Je m'explique: j'ai une image de fond, un clip pardessus qui représente une vitre gelée,
un autre clip masqué identique au fond. le masque de ce dernier est vide, le gel disparaîtra
lorsque je dessinerai dessus.je souhaite que la forme dessiner soit particulière,
j'appelle cette forme doigt.

pour cela j'utilise ce code:


//ajout de l'écouteur
stage.addEventListener(MouseEvent.MOUSE_OVER, traceMasque);

function traceMasque( mEvt:MouseEvent ):void {
stage.addEventListener(Event.ENTER_FRAME, Masque);

}

//fonction de création du masque
function Masque( e:Event ):void {

var doigts:doigt= new doigt();
var myBitmap:BitmapData=new BitmapData(doigts.width,doigts.height,true,0);
var bmp:Bitmap=new Bitmap(myBitmap);
myBitmap.draw(doigts);
bmp.x=mouseX-10;
bmp.y=mouseY-10;
masque.addChild(bmp);

}

mon problème est le suivant: le code fonctionne mais la forme est carré. Comment appliquer la forme exact de mon clip doigts sans qu'il me génère une zone carré autour de ce dernier?

crackter · Accepted Answer

salut,

Un objet BitmapData peut être dessiné à l'écran par un objet Bitmap de deux façons : avec le rendu vectoriel en tant que forme de remplissage de bitmap, ou en exécutant une routine de copie de pixels plus rapide. La routine de copie de pixels est nettement plus rapide que la fonctionnalité de rendu vectoriel, mais l'objet Bitmap doit satisfaire à certaines exigences pour y faire appel :

    * L'objet Bitmap ne peut pas subir d'étirement, de rotation ou d'inclinaison.
    * L'objet Bitmap ne peut pas subir de transformation des couleurs.
    * Aucun mode de fondu ne peut être appliqué à l'objet Bitmap.
    * Aucun découpage n'est effectué par le biais de calques de masque ou de méthodes setMask().
    * L'image en tant que telle ne doit pas être un masque.
    * Les coordonnées de destination ne doivent pas correspondre à la limite d'un pixel entier.

Tu dois "vectoriser" ton dessin doigts (que tu as dû linker en bibliothèque j'imagine). Sinon tu aura toujours la bordure carrée.
Sinon tu peux parser l'image doigt et remplir par exemple un sprite avec son bitmapdata et te servir de ce sprite comme d'un masque (et non pas utiliser le bmp).

zen69 · Answer

Cracker, 

Es-tu bien certain que ces contraintes sont encore effective en AS3... et setMask() c'est du AS2....


---------------------------------------------------------
Julien B.

crackter · Answer

Guide de référence as3 :

http://help.adobe.com/fr_FR/AS3LCR/Flash_10.0/flash/display/Bitmap.html

crackter · Answer

je sais bien que setMask c'est de l'as2, et est remplacé par mask tout court... mais la méthode reste la même.

pour ce qui est de ton doigt, si c'est un clip en biblio, il suffit de le vectoriser tout simplement, son "contour" deviendra vide ou pourra être effacé.

meumeu64 · Answer

Tout d'abord merci à tout les deux de bien vouloir m'aider à résoudre mon problème.
Effectivement je peu remplacer mon clip "masque" par un clip dynamique de cette façon:

var doigts:doigt= new doigt();
var monClip:Sprite= new Sprite();
var myBitmap:BitmapData=new BitmapData(doigts.width,doigts.height,true,0);

// puis dans mon "EnterFrame"
var bmp:Bitmap=new Bitmap(myBitmap);
myBitmap.draw(doigts);
bmp.x=mouseX-10;
bmp.y=mouseY-10;
monClip.addChild(bmp);
premier.mask=monClip;

premier étant l'occurrence de mon clip au premier plan et monClip le masque que je crée. 

Malheureusement mon problème persiste dans les deux cas.
la forme du clip doigt est une forme sans contours, dessinée avec le pinceau de flash et
irrégulières.

Même si j'ajoute un contour, ou que je la remplace par un objet dessiné à la plume, j'ai encore ce problème. Qu'entendez vous par vectoriser?

Je suis passé par une méthode douteuse en attendant mais qui fonctionne:


masque.buttonMode=true;

//ajout des écouteurs
stage.addEventListener(MouseEvent.MOUSE_OVER, traceMasque);

function traceMasque( mEvt:MouseEvent ):void
{

stage.addEventListener(Event.ENTER_FRAME, createMasque);

}
//fonction de création du masque
function createMasque ( e:Event ):void
{
var doigts:doigt= new doigt();
doigts.x = mouseX;
doigts.y = mouseY;
masque.addChild(doigts);
}

 
ici "doigts" n'est plus un bitmap...
Ce code donne le même résultat si remplace mon clip masque par un clip dynamique+ la méthode mask.

Mais ce code me limite si je désire en faire un élaboré.

crackter · Answer

oui c'est normal pour ton bmp forme un "rectangle" car il dépend de ton bitmapdata qui a une taille de doigt.width,doigt.height. Même avec l'option transparent à true, l'image fait effectivement la taille du bitmapdata. Ton 2e code est fonctionnel et c'est normal car tu utilises une image "vectorisé" qui n'a pas réellement de bordure. C'est la méthode dont je voulais te parler plus haut mais j'avais dû mal me faire comprendre.

meumeu64 · Answer

Ok, ok merci encore à tout les deux.

Mask et draw as3

7 réponses

Votre réponse

Discussions similaires