Actionscript 2: Animating with Numbers

1
Actionscript 2 Animating with Numbers!

• Week 10

2
Last week..

• Variables
• Trace command
• Loading Variables from a text file
• Using a dynamic text box to show variable value
  on screen
• Generating movieclips on the fly
• IF ELSE..FOR

3
Routine to produce a hitcount number of
yourclip movieclips

• for(x1xlt_root.hitcountx)
• _root.yourclip.duplicateMovieClip("yourclip"x,x)
  
• _root"yourclip"x._xrandom(300)
• _root"yourclip"x._yrandom(300)

4
A good way to start

• Write what you want to happen in English
• Break it down into small chunks
• Work on changing the english to actionscript ONE
  chunk at a time.
• Dry Run
• Pretend to be the computer

5
Animation principles

• You can change where something is on the stage by
  using _x and _y properties.
• i.e. _root.mymovieclip._x50
• Will move the mymovieclip instance to a position
  which is 50 pixels from the left edge of the
  stage.

6
X
stage
0,0
60 pixels
Position of the movieclip depends also on the
CENTRE point of rotation. In this case, its in
the centre
75 pixels
Y
mysquare
What code would we write to move the mysquare
movieclip to the above location?
7
Jumping or movement?

• _root.mysquare._x50
• How might we make the square jump to a random
  horizontal position?
• ____________________________
• How might we get smooth movement using this
  system?

8
Movement Logic

• Keep REPEATEDLY telling the movieclip to move a
  certain distance from where it currently is.
• In English roughly...From where you are, move a
  bit to the right, (repeat over and over)
• In English more tightlyyour position your
  position a bit more
• In Actionscript_root.mysquare._x_root.mysquare
  ._x1(where 1 is the distance you want it to
  move by)

9
This command needs to run all the time

• In which event should we put this script then?
• Answer__________________________

10
If you put the script on the movieclip itself

• Just use this instead of _root.mysquare.
• onClipEvent(enterFrame)
• this._xthis._x1
• In the lab, put this script on a movieclip and
  see it work

11
Other directions

• How would we make the square move down the
  stage?____________________________How would we
  make the square move to the left, instead of to
  the right?____________________________

12
Detecting boundaries

• EnglishIf the clip hits the right edge of the
  stage, let us know
• Actionscript (clunky)
• If (this._xgt300)
• trace(Ive hit the edge)
• Where 300 is the edge of the stage.

13
Boundariesbetter

• Actionscript(better)
• If (this._xgtStage.width)
• trace(Ive hit the edge)
• Stage.width is a command which gives you the
  width of the stage in pixels.

14
Adding some variables

• What about if you wanted this clip to move left
  when it hit the edge of the stage?
• English1. Start moving to the right2. When hit
  the stage on the right, move left.3. When hit
  the stage on the left, move right
• That means the direction is going to VARY.

15
Adding some variables

• So by setting up another variable called
  mydirection, which is sometimes 1, and sometimes
  -1, we can change the direction of the clip.
• this._xthis._x(mydirection1)(where
  mydirection is either 1 or -1)

16
1. Start by moving to the right

• Actionscriptmydirection1
• We want to set this up to start with ONCE.
• Which event?

17
1. Start by moving to the right

• onClipEvent(load)
• mydirection1
• onClipEvent(enterFrame)
• this._xthis._x(mydirection1)

18
2. When hit the stage on the right, move left.

• More englishwhen it hit the edge of the stage
  on the right set the direction to -1 (so it moves
  left)
• onClipEvent(load)
• mydirection1
• onClipEvent(enterFrame)
• this._xthis._x(mydirection1)
• if (this._xgtStage.width)
• mydirection-1

19
3. When hit the stage on the left, move right

• onClipEvent(load)
• mydirection1
• onClipEvent(enterFrame)
• this._xthis._x(mydirection1)
• if (this._xgtStage.width)
• mydirection-1

What would you put in these missing three lines?
20
More brainache

• I want to set up a random speed for the clip each
  time the movie runs.

21
Other properties to play with

• this._xscale (or _yscale)--measured in
  percentage
• this._rotation
• --measured in degrees
• this._alpha
• --measured as a percentage (1-100)

22
And

• Lab today practising this code
• Support Next Thursday (no lecture)
• Thursday 13th May EVERYBODY at 11am please.
• Show and Tell with Andrew and Me.
• Chance to see EVERYONES work
• HAND IN practical work at that session.HAND IN
  reports two days later.