How do i know how much the kid has
painted on the circle?
You can:
- make your circles and other shapes Sprites to get separate container
- render them into bitmap and count number of non-transparent pixels in it (you should know what number corresponds to 100%)
- since counting pixels is heavy operation (can take hundreds of milliseconds, depending of shape size), you don't want to run it on every frame. I suggest to do it on MOUSE_UP, right after kid finishes next stroke.
How to count pixels:
function countPixels(shape:DisplayObject):int
{
var bd:BitmapData = new BitmapData(shape.width, shape.height);
bd.draw(shape);
//here you get sequence of ARGB-packed colors in vector
var pixels:Vector.<uint> = bd.getVector(bd.rect);
//AFAIK, fastest method to traverse vector is 'for' loop
var pixel:uint;
var filledCount:int = 0;
for (var i:int = pixels.length - 1; i >= 0; i--)
{
pixel = pixels[i];
//pixel is 32-bit ARGB color value, test upper 8 bits (alpha):
if ((pixel >> 24) > 0) filledCount++;
}
return filledCount;
}
Run this on filled shape to get total pixel count to compare with.
After pixelCount reaches 95%, you can clear kid's drawing and show filled shape.