How to use rounded mask for html5?

#1

I have this code:

        avatarSprite = new SpriteOnline(Std.int(this.w), Std.int(this.h));
	avatarSprite.load(url.url);
	avatarSprite.x = avatarSprite.width / 2;
	avatarSprite.y = avatarSprite.height / 2;
	
	
	var avmask:Sprite = new Sprite();
	avmask.graphics.beginFill(backColor, 0.1);
	avmask.graphics.drawCircle(0,0,50);  
	avmask.graphics.endFill();
	
	this.addChild(avmask);
	avatarSprite.mask = avmask;
	this.addChild(avatarSprite);

Unfortunally even drawing a circle it makes a square mask and not a circle or rounded one. Is there a way to make a rounded or non rectangled mask with html5?

#2

The -Dcanvas target on HTML5 should support more complex masks. We need to finish cacheAsBitmap before we can look at more complex OpenGL shader masks in the GL render target. Sorry for the inconvenience :slight_smile: