Random Movement in AS3
- Page 5
by
kirupa | 24 December 2010
Have questions? Discuss this Flash / ActionScript
tutorial with others on the forums.
In the
previous page, you started to get a
better understanding of the things the BlueCircle class
does. In this page, we put words into code and explain how
what you learned in the previous page applies to what is
actually in your BlueCircle class.
The
function that is responsible for getting our circles to move
at each frame
tick is MoveCircle, and that is largely also because this
function is the event handler for the enterFrame event:
- private
function
MoveCircle(e:Event)
- {
- this.previousDistance
=
this.currentDistance;
- this.currentDistance
=
this.GetDistance();
-
- if
(this.currentDistance
<
this.previousDistance)
- {
- this.x
+=
this.speedX;
- this.y
+=
this.speedY;
- }
- else
- {
- this.SetNewPosition();
- }
- }
The first two lines are pretty interesting:
- previousDistance
=
this.currentDistance;
- currentDistance
=
this.GetDistance();
What I am trying to do with these two lines is get a
gauge for whether the circle has reached its target or not.
The way I do that is by measuring how far my circle has to
go now compared to how far it had to go a frame ago. That is
done by using two variables (previousDistance and
currentDistance) to cycle an old and new value between each
other. When
the circle is approaching its target, its current distance
will be less than its previous distance from earlier because
one would assume that it has moved towards target in that
frame. Using these two values, I can gauge whether the
circle has reached its destination or not. This approach is
similar to what I employ in the
Detecting Direction of Mouse Movement in AS3 tutorial.
In the first line, I set previousDistance's value to be
what the value of currentDistance was earlier. In the next
line, I set the currentDistance variable's value to the
current distance between where the circle is and where it
goes. That is calculated via the GetDistance function. Let's
look at that next:
- private
function
GetDistance():Number
- {
- return
Math.sqrt(Math.pow(this.x
-
this.newX,2)
+
Math.pow(this.y
-
this.newY,2));
- }
-
The GetDistance function returns the distance between two
points...Pythagorean style. I am not going to describe the
Pythagorean theorem in this article, but just know that it
is what is used to find a straight line distance given two
x,y coordinates. What I am doing is
providing the net horizontal and vertical coordinates.
If everything goes as planned, each time this function is
called, the distance will be a little bit less than what it
was earlier because your circle is hopefully getting closer
to your destination.
Ok, let's go back to our MoveCircle function:
- if
(currentDistance
<
previousDistance)
- {
- this.x
+=
this.speedX;
- this.y
+=
this.speedY;
- }
- else
- {
- SetNewPosition();
- }
There is an if statement that checks whether the value of
currentDistance is less than previousDistance. This is done
to ensure that you are still making progress towards
reaching the destination. As long as your circle is
approaching its destination, this answer will always be
true.
When this statement is true, we increment the current X
and Y position by the speedX and speedY values:
- if
(currentDistance
<
previousDistance)
- {
- this.x
+=
this.speedX;
- this.y
+=
this.speedY;
- }
- else
- {
-
SetNewPosition();
- }
You will see more about the speedX and speedY
variables shortly.
When the if statement is false, we call the
SetNewPosition function:
- if
(currentDistance
<
previousDistance)
- {
-
this.x
+=
this.speedX;
-
this.y
+=
this.speedY;
- }
- else
- {
- SetNewPosition();
- }
The false will occur only when currentDistance is greater
than or equal to the value stored by previousDistance. Do
you know when something like that happens? A situation like
this happens when our circle has reached its destination and
is now moving past it. The moment that happens, this if
statement will trigger a false and the SetNewPosition will
get called.
The SetNewPosition function is pretty awesome in its own
way, so let's take a look at that on the
next page!
Onwards to the
next page!
|
