Humanities Home page   Office of Digital Humanities
Back     BYU LiveCode Lessons Gateway

CHum 310
Motion and Animation

It may sometimes be desirable to include moving elements in your instructional application. For example, an instructional game might include a moving image that charted the user's progress toward a learning goal. Whatever the use of motion in your application, you should remember to keep the instructional objectives foremost and not to simply add animations or motion to "spice things up". Properly used, motion and animation can add visual interest that will enhance, not detract from, the goals of your program.

LiveCode provides some very powerful and simple to use motion and animation capabilities. These are outlined below.

Refer to the stackfile MotionWorkKey.rev for the completed examples that were presented in class. As always the stack can be found in the Keys folder on the class file server, or you can open it directly from LiveCode over the internet: go to stack url "http://chum310.byu.edu/Keys/MotionWorkKey.rev" .

Scripting Motion

The move command

The basic syntax of the move command is as follows:

move object [from startLoc] to endLoc

where...

object is a reference to any LiveCode object

startLoc is any expression that evaluates to a point in the form x,y (where x is the number of pixels from the left edge of the stack window and y is the number of pixels from the top of the stack window.) Note that this element is optional; if no start location is specified the object will move from its current location to the end location.

endLoc is any expression that evaluates to a point in the form x,y

For example,

move btn "myButton" from 30,100 to 500,450

The move command can also use this variant:

move object to pointList

where pointList is a return-separated list of destination points.

For example, given a variable motionPoints containing a point list in the form:

240,150
300,200
320,300
450,300
400,350
200,400
240,150

the command would look like this:

move btn "myButton" to motionPoints

The move command can also be used to move an object relative to its current position:

move image "myImage" relative 400,-100

In relative motion, positive integers in the x and y positions denotes movement to the right and downward respectively, and a negative integer denotes movement to the left and upward respectively. Thus, the above example moves the object 400 pixels to the right and 100 pixels upward.

By using the in time clause, you can specify the duration of the move operation:

move fld "myField" to 300,260 in 30 ticks

The time can be specified using ticks (60 ticks = 1 second), seconds, or milliseconds. The default time unit is ticks.

The without waiting clause causes the handler to continue executing immediately without waiting until the motion is finished. If it's left out the handler will not continue executing until after the move operation has finished.

move btn "myButton" to 400,400 in 5 seconds without waiting

This clause can be used with any form of the move command.

The without messages clause blocks any other built-in messages (most relevant here are mouse messages) from executing while the motion is in progress. The default behavior, without this clause, allows messages to be handled during the motion operation.

move image "myImage" relative -50,200 without messages

This clause can be used with any form of the move command.

Note that any object can be moved, including the stack window itself. If you do this, the location points are relative to the screen rather than the stack window.

move stack "motionWork" from 100,100 to 1000,750

The stop moving command

This command can be issued at any time to stop the motion of any object set in motion by the move command. The syntax is:

stop moving object

where object is any valid object reference. If the object referenced is not moving the command is simply ignored, so it is safe to write a handler that stops all objects that are potentially in motion, without having to check to see whether the object is moving at the time you issue the stop moving command

The moveSpeed property

When you don't specify a time for the motion using the in time clause, the motion uses the moveSpeed property. This property is a value from 0 to 65,535 and by default is set to 200. 1 is the slowest and 65,535 is the fastest. A value of 0 is supposed to move the object instantaneously according to the documentation, but my testing has shown that setting the moveSpeed to 0 causes a move command to try to move at 0 speed! This effectively hangs the script, so I would avoid doing this until it is fixed in a future version.

set the moveSpeed to 500

The moveStopped message

When a move command is issued that uses the without waiting form, a moveStopped message is sent when the movement stops. The moveStopped message is also sent when a movement is stopped using the stop moving command. You can then write a handler that will execute a desired set of commands when the movement is over:

on moveStopped
  put "The motion has ended." into fld "myfld"
  beep
end moveStopped

Obviously, if you don't write a moveStopped handler, this message is ignored.

The movingControls function

This function checks to see whether any objects are moving. If they are, it returns a list of the long IDs of the moving objects.

put the movingControls

returns information in this form:

image id 1006 of card id 1002 of stack "/Macintosh HD/Users/labuser/Desktop/motionWorkKey.rev"

The lockMoves property

When the lockMoves property is set to true, this prevents any motion from starting until lockMoves is set to false. You can use this property to issue several move commands and force them to wait until the property is set to false, at which time all of the motion operations will execute simultaneously:

on mouseUp
  set the lockMoves to true
  move fld "movingFld" from 100,75 to 550,300 in 3 seconds without waiting
  move img "airplane" from 600,420 to 100,95 in 4 seconds without waiting
  set the lockMoves to false
end mouseUp

Animation Exercise

Use the move command to move the airplane along the path indicated by the arrows. At the point where the airplane changes direction, use the flip command to change the way the airplane is facing, so that it is facing in the direction of movement. Add scripting to the reset button to return the airplane to its original location and orientation.


Back     BYU LiveCode Lessons Gateway
Maintained by Devin Asay.
Copyright © 2005 Brigham Young University