How to create rounded rectangle with linear gradient?

[Dlean Jeans]

Yeah, that's all. A ROUNDED rectange with FlxSprite. I can only draw a normal non-round rectangle.

Wait a sec. I need to ask an off-topic question: Is there a class like (flash/openfl) DisplayObjectContainer in HaxeFlixel which groups FlxBasics and FlxObjects so I could easily set their positions as a group? Just answer Yes or No. I can write a simple class like that. I just ask so as to not waste my time.

[SruloArt]

* drawRoundRect

* FlxSpriteGroup would hold FlxSprites, so yes, kind-of (unless you have to use FlxObjects for some reason. BTW, FlxBasic doesn't have position vars).



[Dlean Jeans]

I meant a rounded rectangle WITH GRADIENT COLOR. Using FlxGradient seems to only draw a normal non-round rectangle.

[SruloArt]

So, how to draw a mask on top of a FlxGradient FlxSprite?

1. First, if you don't have a mask already create a temporary variable to hold your mask, for example, like this:

var tempMask = new FlxSprite(100, 100);
tempMask.makeGraphic(100, 100, FlxColor.TRANSPARENT,true);

2. Second, Draw whatever shape you want on top of it, for example, like this:

FlxSpriteUtil.drawRoundRect(tempMask, 0, 0, 50, 50, 10, 10, FlxColor.WHITE);

3. Third, use the mask to "erase" specific parts of your original sprite (I'm adding the FlxGradient FlxSprite here already, as an example):

FlxSpriteUtil.alphaMaskFlxSprite(FlxGradient.createGradientFlxSprite(100,100,[FlxColor.LIME, FlxColor.RED, FlxColor.WHITE], 1, 90, true), tempMask, yourSprite);

4. Just make sure your original FlxSprite (in this case, the FlxGradient's) and your mask Sprite (tempMask) have the same size bitmapData (in this case, 100X100px).