CODEWITHSUNDEEP
actionscript-3touch-eventstarling-framework
vincent
vincent

Reputation: 1323

drawing a line that follows your finger

I'm creating a game and i am trying to draw a line that is following my finger. I'm using the starling graphics axtension for this and that is working very nice and you can see how i do it below.

if (begin) {
    _startPoint = new Point(begin.globalX, begin.globalY);
    _line.graphics.lineStyle(1, 0xffffff, 1);
    addChild(_line);
} else if (moved) {
    var width:Number = MathUtils.DistanceBetweetnTwoPoints(_startPoint.x, _startPoint.y, moved.globalX, moved.globalY);
    _currentPoint = new Point(moved.globalX, moved.globalY);
    _line.graphics.clear();
    _line.graphics.moveTo(_startPoint.x, _startPoint.y);
    _line.graphics.lineTo(_currentPoint.x, _currentPoint.y);
} else if (end) {
    _line.graphics.clear();
    _endPoint = new Point(end.globalX, end.globalY);
    addBlock(_startPoint, _endPoint);
}

So what i want to do is the following. Atm moment it is just following my finger (draws a line from the startpoint to the currentpoint. But i want to enter a maximum width. Lets say 50. If it crosses the length of 50 it should just follow my finger rotationwise. So not getting any longer anymore but it does keep track of the direction of my finger and rotates towards it.

And a last thing (although i'm not sure if it's possible) is to let the line go from green to red, the closer it gets to its max length ( so entire line is green but it turns red the closer it gets to 50)

I have no idea how to achieve this sho it would be awesome if someone could point me in the right direction.

Upvotes: 0

Views: 716

Answers (1)

Vesper
Vesper

Reputation: 18747

If points will be enough, then:

  1. You calculate the distance between standpoint and touchpoint. If below your threshold, draw the full line.
  2. If not, you calculate a proportion between your desired length and deltas of X and Y between the standpoint and touchpoint, you will receive an intermediate point that will be the end of your drawn line.
  3. To select the color, either have a HSV or RGB interpolation between green and red. A stupid example of uint(255*lineLength/50)*0x10000+uint(255*(1.0-lineLength/50))*0x100 will do for some time. lineLength in here ranges from 0 to 50.0.

After you calculate all of this, you're set to draw a line as you did.

And a nitpick: the line "width" is named "thickness", which is 1 in your example (is set in lineStyle along with the color).

Upvotes: 1

Related Questions