Masking with customized / polygon shape

A typical requirement to create custom closed shape was a big pain till now at my workplace. Many were working to create some run time changeable shape and through that, mask an image. I achieved this; finally, after visiting a blog and a forum for Flash programming. Also, my colleague Mayur helped to organize once I was ready and I explained like Proof of Concept.

For custom shape, you will require a reference to public property of any DisplayObject / UIComponent – that is graphics (flash.display.Graphics)

Now is the real crux.

The next steps work just like you draw something on paper (or Canvas)

// Create and initialize Sprite object
var spriteObj:Sprite = new Sprite();

// Clear graphics;

// Define style of line (border of the shape), 0xff00ff);

// Start filling with a selected color;

// Move to a position to start from (without actually drawing), y);

// Draw a line / curve or anything that is supported by graphics
// This may be used in a loop or recursive manner to draw lines / curves passing through n points
{, handlerY, x, y);

// End filling process, just like you put pen aside!;

// Define a new canvas and initialize it
var canObj:Canvas = new Canvas();

// Add the just created Sprite object as a raw (not direct UIComponent child) child

// Use over image as a mask, if required
imgComp.mask =  canObj;

Leave a Comment

NOTE - You can use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

%d bloggers like this: