Masque AS3 résultat bizarre

Question

Je joue avec le masquage dynamique pour une partie d'un jeu de puzzle que je fais. J'ai un puzzle d'essai avec 6 pièces. Le casse-tête existe sur 3 couches:

• forme noire = ceci est où vous mettez vos morceaux
• pièces finies = ceci est une couche montrant le résultat combiné des morceaux trouvés
• pièces en vrac = peuvent être déplacés en place.

La forme noire ne pose aucun problème, c'est juste une simple transformation de couleur sur le sprite de résultat.

Lorsque je combine les pièces finies dans un sprite, je remarque que les espaces entre les pièces sont plus petits que ceux des capillaires. Cela n'a pas l'air trop bon, donc j'ai pensé à un moyen de contourner cela:

Une façon dont j'ai pensé à était de mettre un masque sur un sprite de résultat complet de sorte que seules les pièces trouvées sont visibles. J'ajouterais une bordure de 1px autour des pièces pour éviter les interstices.

Alors, je commencé à jouer avec des masques:

// test 
var test: Sprite = new TestSprite() as Sprite; 
test.x = test.y = 100; 
addChild(test); 

// puzzle pieces    
var pieces: Vector.<Sprite> = new Vector.<Sprite>; 
pieces.push(new TurtlePiece1()); 
pieces.push(new TurtlePiece2()); 
//pieces.push(new TurtlePiece3()); 
//pieces.push(new TurtlePiece4()); 
pieces.push(new TurtlePiece5()); 
pieces.push(new TurtlePiece6()); 

// finished locations for each piece 
var points: Vector.<Point> = new Vector.<Point>; 
points.push(new Point(0.3, 7.25)); 
points.push(new Point(110.35, 0)); 
//points.push(new Point(98.25, 52.6)); 
//points.push(new Point(23.95, 69.30)); 
points.push(new Point(157.25, 61.95)); 
points.push(new Point(146.7, 100.70)); 

var mask: Sprite = new Sprite(); 
for (var i: int = 0; i < pieces.length; i++) { 
    pieces[i].x = points[i].x; 
    pieces[i].y = points[i].y; 
    mask.addChild(pieces[i]); 
} 
test.mask = mask; 

La pleine forme et la forme de masque ressembler à ceci:

Après avoir appliqué le masque, il ressemble à ceci:

J'ai essayé la mise en cache sous forme de bitmap, sans résultat. Quelqu'un a-t-il une idée de ce que pourrait être le problème?

Tnx à l'avance,

Cordialement, Jeroen

Answer 1

je vois ce que vous essayez de faire, mais je ne sais pas pourquoi il ne fonctionne pas pour vous. J'ai créé un programme similaire un fonctionne comme prévu:

//Imports 
import flash.display.Shape; 
import flash.display.Sprite; 

//Draw Background Rect 
var backgroundRect:Shape = new Shape(); 
backgroundRect.graphics.beginFill(0x000000, 1.0); 
backgroundRect.graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight); 
backgroundRect.graphics.endFill(); 

addChild(backgroundRect); 

//Build Mask From Circles 
var backgroundMask:Sprite = new Sprite(); 

var circleA:Shape = circle(50, 0xFF0000); 
circleA.x = 50; 
circleA.y = 50; 

var circleB:Shape = circle(50, 0x00FF00); 
circleB.x = 100; 
circleB.y = 50; 

var circleC:Shape = circle(50, 0x0000FF); 
circleC.x = 150; 
circleC.y = 75; 

backgroundMask.addChild(circleA); 
backgroundMask.addChild(circleB); 
backgroundMask.addChild(circleC); 

addChild(backgroundMask); 

//Assign Mask 
backgroundRect.mask = backgroundMask; 

//Create Circle 
function circle(radius:uint, color:uint):Shape 
{ 
    var result:Shape = new Shape(); 
    result.graphics.beginFill(color, 1.0); 
    result.graphics.drawCircle(0, 0, radius); 
    result.graphics.endFill(); 

    return result; 
} 

la seule chose que je peux penser que les morceaux que vous ajoutez au sprite de masque sont overriting l'autre, de façon similaire à ce que se produit lorsque vous chevauchement de plusieurs formes au sein d'un seul appel graphique:

//Imports 
import flash.display.Shape; 
import flash.display.Sprite; 

//Draw Circle 
var circleA:Shape = circle(50, 0xFF0000); 
circleA.x = 50; 
circleA.y = 50; 

addChild(circleA); 

//Create Circle 
function circle(radius:uint, color:uint):Shape 
{ 
    var result:Shape = new Shape(); 
    result.graphics.beginFill(color, 1.0); 
    result.graphics.drawCircle(0, 0, radius); 
    result.graphics.drawCircle(50, 50, radius); 
    result.graphics.endFill(); 

    return result; 
}