KCMcG Studios

I managed to add bullets and lasers back into the game recently. Lasers turned out to be a much tougher challenge than I thought it would be. I’m still used to drawing graphics using Flash sprites. FlxSprites offer the same functionality, but use different functions. There’s also one additional catch with FlxSprites.

The Catch: Default Flixel Sprite

Flixel has this weird habit of inserting a default sprite if you don’t add a sprite yourself. This means that if you try and jump straight into drawing a line, the default Flixel sprite jumps in and then gets partially overwritten by your line.

Here’s the code I had been using:

var tempWidth:int = this.x - this.target.x;
var tempHeight:int = this.y - this.target.y;
				
this.drawLine(0, 0, tempWidth, tempHeight, 0xff0000, 2);

Find the width and height of the line. Draw the line from the bullet’s origin to the target’s origin. Seems simple, right? Unfortunately, Flixel only draws graphics within the actual height and width of the sprite. So to fix that, we have to create a sprite big enough to encompass the entire laser beam, move the sprite to the top-left corner of the laser’s length and draw the laser from the tower to the target.

Here’s the new code:

var tempWidth:int = Math.abs(this.x - this.target.x);
var tempHeight:int = Math.abs(this.y - this.target.y);
this.makeGraphic(tempWidth, tempHeight, 0x00000000);
this.x = Math.min(this.x, this.target.x);
this.y = Math.min(this.y, this.target.y);
	
this.drawLine(startPoint.x < this.target.x ? 0 : tempWidth, 
    startPoint.y < this.target.y ? 0 : tempHeight, 
    startPoint.x > this.target.x ? 0 : tempWidth,
    startPoint.y > this.target.y ? 0 : tempHeight, 0xff0000, 2);

The end result

Next I’ll be adding the “Wave” type tower back in and adding some UI so you can actually see the stats on the towers and enemies. Almost back to where I had been. Flixel has made the code for this game a lot simpler and taken some of the weird bugs out of it too.