Author Topic: FlxPath, drawing the line?  (Read 2546 times)

Chelnok

  • Contributor
  • ****
  • Posts: 257
  • Karma: +0/-0
    • View Profile
FlxPath, drawing the line?
« on: Mon, Jul 18, 2011 »
Have anyone done anykind of drawline ..things based on FlxPath data?

I mean.. simply drawing the lines to screen :) Yes, i know its probably pretty simple, but i just havnt use to work with bitmapdata and that kind of things, so any code examples are wellcome.

osro

  • Active Member
  • ***
  • Posts: 121
  • Karma: +1/-0
    • View Profile
    • Purppura
Re: FlxPath, drawing the line?
« Reply #1 on: Mon, Jul 18, 2011 »
Should be fairly easy as the debugger already draws the lines through the path if you want.
At least the line drawings should be in there...

https://github.com/AdamAtomic/flixel/blob/dev/org/flixel/FlxPath.as#L203

Chelnok

  • Contributor
  • ****
  • Posts: 257
  • Karma: +0/-0
    • View Profile
Re: FlxPath, drawing the line?
« Reply #2 on: Mon, Jul 18, 2011 »
yeah, already tried to get it work from that, but i couldnt get anything to the screen..?

mightiest_hero

  • Member
  • **
  • Posts: 51
  • Karma: +0/-0
    • View Profile

lazyCrab

  • Member
  • **
  • Posts: 46
  • Karma: +0/-0
    • View Profile
Re: FlxPath, drawing the line?
« Reply #4 on: Tue, Jul 19, 2011 »
Never done it myself but i think that the source for the path finding demo in Flixel's features page should help since it does that
"WEEKS of programming can save HOURS of design"
"Programming today is a race betwin programmers trying to make bigger and vetter idiot proof programs and between the universe trying to make bigger and better idiots. Currently, the universe is winning"

Chelnok

  • Contributor
  • ****
  • Posts: 257
  • Karma: +0/-0
    • View Profile
Re: FlxPath, drawing the line?
« Reply #5 on: Tue, Jul 19, 2011 »
@mightiest_hero

I took your code, and its working. Just cant get the function drawDebug() to work when i add it to my (your) PlayState. No errors, but no lines either. I'm sure it'll open up, just need to try to understand how that drawing to buffer works.

@lazyCrab
The code is same, just different place :) ..done by mightiest_hero..


mightiest_hero

  • Member
  • **
  • Posts: 51
  • Karma: +0/-0
    • View Profile
Re: FlxPath, drawing the line?
« Reply #6 on: Tue, Jul 19, 2011 »
Strange.
You can see the path line in demo.
Maybe i can check you code if you post your code
Well it me who create that demo.
mightiest_hero is my username in this forum

Chelnok

  • Contributor
  • ****
  • Posts: 257
  • Karma: +0/-0
    • View Profile
Re: FlxPath, drawing the line?
« Reply #7 on: Wed, Jul 20, 2011 »
Thanks for help. I took another look today, and problem was my camera :) I added the camera, and didnt realize that reference needed to be passed to drawDebug function. I tough that if you have only one cam, its always default. Guess not.

Chelnok

  • Contributor
  • ****
  • Posts: 257
  • Karma: +0/-0
    • View Profile
Re: FlxPath, drawing the line?
« Reply #8 on: Thu, Jul 21, 2011 »
I still got little annoying thing to figure out:



As you can see, the path is working now, but i dont like how it goes over the tree.

I have in playstate:

Code: [Select]
override public function draw():void
{
super.draw();
//To draw path
if (_target.path != null )
{
_target.path.drawPath(cam);
}
}

How can i draw the path to over background but under the "over-layers" like tree?

Layer structure is like:
under
under
characters
over
over

Should i create new layer after "under" layers ..and create "ThePath" class extends FlxSprite, and place call "override draw()" there? I guess that should work, but i'm also interested if this is the right way to do this :)

Chelnok

  • Contributor
  • ****
  • Posts: 257
  • Karma: +0/-0
    • View Profile
Re: FlxPath, drawing the line?
« Reply #9 on: Sat, Jul 23, 2011 »
Yep, thats how it works.. Actually i did not do any new layers or sprites. New place for override draw() is in player class.





To show the path realtime where and how far (green) your player can go when you moving your mouse over the map:

Player class:

Code: [Select]
override public function draw():void
{
super.draw();
//To draw path
if (path != null )
{
path.drawPath(GameState.cam);
}
}

in Playstate: (my playstate is actually called GameState)
update:
Code: [Select]
if (!_walking)
showThePath()

showThePath()
Code: [Select]
private function showThePath():void
{
//Find path to goal
var _map:FlxTilemap = Registry.mapCollide;
var path:FlxPath = _map.findPath(new FlxPoint(_target.x + _target.width / 2, _target.y + _target.height / 2), new FlxPoint(_goal.x + _goal.width / 2, _goal.y + _goal.height / 2),false);

_target.path = path;
}

Add this to FlxPath:

Code: [Select]
public function drawPath(Camera:FlxCamera=null):void
{
if(nodes.length <= 0)
return;
if(Camera == null)
Camera = FlxG.camera;

//Set up our global flash graphics object to draw out the path
var gfx:Graphics = FlxG.flashGfx;
gfx.clear();

// for calc totaldist
var dx:Number
var dy:Number
var dist:int

GameState.totalDistance = 0;

var _ang:int = 0;

//Then fill up the object with node and path graphics
var node:FlxPoint;
var nextNode:FlxPoint;
var i:uint = 0;
var l:uint = nodes.length;
var linealpha:Number = .4;
while(i < l)
{
//get a reference to the current node
node = nodes[i] as FlxPoint;

//find the screen position of the node on this camera
_point.x = node.x - int(Camera.scroll.x*debugScrollFactor.x); //copied from getScreenXY()
_point.y = node.y - int(Camera.scroll.y*debugScrollFactor.y);
_point.x = int(_point.x + ((_point.x > 0)?0.0000001:-0.0000001));
_point.y = int(_point.y + ((_point.y > 0)?0.0000001:-0.0000001));

if(i < l-1)
{
nextNode = nodes[i+1];

dx = node.x - nextNode.x;
dy = node.y - nextNode.y;
dist = Math.sqrt(dx*dx + dy*dy);

GameState.totalDistance = GameState.totalDistance + dist;

}
else
{
nextNode = nodes[0];
linealpha = 0;
}


if (GameState.totalDistance < GameState._target.walkRange) debugColor = FlxG.GREEN
else debugColor = FlxG.RED

//then draw a line to the next node
gfx.moveTo(_point.x,_point.y);
gfx.lineStyle(7,debugColor,linealpha);
_point.x = nextNode.x - int(Camera.scroll.x*debugScrollFactor.x); //copied from getScreenXY()
_point.y = nextNode.y - int(Camera.scroll.y*debugScrollFactor.y);
_point.x = int(_point.x + ((_point.x > 0)?0.0000001:-0.0000001));
_point.y = int(_point.y + ((_point.y > 0)?0.0000001:-0.0000001));

if (i%2 != 0)
gfx.lineTo(_point.x,_point.y);

i++;
}

//then stamp the path down onto the game buffer
Camera.buffer.draw(FlxG.flashGfxSprite);
}


Things are still little messy :) but works anyway.