Multiple FlxSprite with makeGraphic bugs when same color.
-
Hello,
I have found something thats probably a bug (or i'm really not getting it). If you create 2 FlxSprites of the same background color. Then they will be combined.
// Source (From template (# flixel tpl -n 'somename') package; import flixel.FlxState; import flixel.util.FlxColor; import flixel.FlxSprite; import flixel.FlxG; using flixel.util.FlxSpriteUtil; class PlayState extends FlxState { override public function create():Void { super.create(); var triangle:FlxSprite; var circle:FlxSprite; var white:FlxColor = FlxColor.WHITE; var tricol:FlxColor = FlxColor.BLUE; var circol:FlxColor = FlxColor.BLUE; var objcolor:FlxColor = new FlxColor(Std.parseInt('0x55161616')); var hw:Int = Std.int(FlxG.stage.stageWidth / 2); var hh:Int = Std.int(FlxG.stage.stageHeight / 2); var rad:Float = 0.5; var off:Int = Std.int(hh * 0.5); var linestyle:LineStyle = { color: new FlxColor(Std.parseInt('0xAA101010')), thickness: 3 }; var drawstyle:DrawStyle = { smoothing: true }; // setup background color; bgColor = white; // white. // make a triangle triangle = new FlxSprite(); triangle.makeGraphic(hw, hh, tricol); triangle.drawTriangle(0, 0, hh, objcolor, linestyle, drawstyle); // make a triangle circle = new FlxSprite(); circle.makeGraphic(hw, hh, circol); circle.drawCircle(off, off, rad, objcolor, linestyle, drawstyle); circle.x = hw; circle.y = hh; add(triangle); add(circle); } } // end source
If now the circle and triangle are on both Sprites :( If you change tricol or circol to be different than the other. Then it works as expected!
So as a quick solution you can do this to solve it (make a change of just one bit);
var tricol:FlxColor = new FlxColor(Std.parseInt('0xFF0000FF')); var circol:FlxColor = new FlxColor(Std.parseInt('0xFF0001FF'));
Or set a alpha bit different. (as long as the colors are different it works).
var tricol:FlxColor = new FlxColor(Std.parseInt('0xFF0000FF')); var circol:FlxColor = new FlxColor(Std.parseInt('0xFE0000FF'));
Hopefully this gets fixed in the future!
Best regards!
HaxeFlixel command-line tools (1.2.1) Installed flixel version: 4.2.1
-
Hey,
you need to replace these:triangle.makeGraphic(hw, hh, tricol); circle.makeGraphic(hw, hh, circol); // makeGraphic() will create a new canvas or use an available one with the same width, height and color // because all the width, height and color are the same, the triangle and the circle will be drawn on the same canvas
with these:
triangle.makeGraphic(hw, hh, tricol, true); // Unique = true circle.makeGraphic(hw, hh, circol, true); // Unique = true // setting Unique to true, makeGraphic() will create a new canvas anyway
Also, you only need to assign a
FlxColor
value by merely writing this:var objcolor:FlxColor = 0x55161616; // or var tricol:FlxColor = 0xFF0000FF;
-
Hey there,
Thanks a lot for the reply. I'm still new to HaxeFlixel and I did not get my information about makeGraphic from the API documentation, which does states this behavior. So my bad for not checking that!
I have some code that uses makeGraphic & drawTriangle a couple of times. I only rotate the triangles. I did notice that the Alpha was way too dark for the value it was given, the reason why is of-course because that it got rendered multiple times, which was - other then the too dark alpha color - unnoticeable for me. I've just now corrected the code to make use of the (un)unique feature. Which is actually great! (if you know what you are doing :)
And thanks for the tip for the hexadecimal integers as wel! (I'm very new to Haxe)
Also:
var rad:Float = 0.5;
Is a beginners mistake. Because radius equals a Float I assumed that it was a percentage realtive to the container size. Instead its the just the pixelsize. But if its < 1 then it just defaults to just that. ( see this thread ) Because it gave the desired result I was unaware of the mistake! ;)
Again thanks for helping and clarifying everything!
Best Regards!