Bits & Bytes

Archive for the ‘Actionscript’ Category

Creating a Simple Animation in Actionscript 3.0

In this example, I create a red rectangle the moves back and forth across the screen. The primary purpose of this example is to show how to create a callback function for animation. So, I will not bother to explain too much about the coordinate calculations that are used for motion.

To create an animation, I could use a Timer object to set an time interval for the animation speed. However, it is better to use the frame rate of the application for controlling the animation. In this manner, the speed of the animation can be altered via the “Properties” window, and should be set to a level that is appropriate for the complexity of the program. The typical setting that is currently used for Flash is 24 frames per second. In order to set a callback that is called every frame, we can use the event ENTER_FRAME, as shown below.

addEventListener(Event.ENTER_FRAME, NextFrame);

// Create rect for sprite and add to stage
var qRect:Sprite = new Sprite();
var uiColor:uint = 0x00c00000;
qRect.graphics.beginFill(uiColor);
    qRect.graphics.drawRect(0, 0, 100, 75);
qRect.graphics.endFill();
addChild(qRect);

// Variables for motion control
var uiX:uint = 0;
var uiDeltaX:uint = 4;
var kuiMaxX:uint = 220;

// Animation callback
function NextFrame(e:Event) : void {
	uiX = ((uiX + uiDeltaX) % (kuiMaxX + 1));
	qRect.x = uiX;
	if (uiX == kuiMaxX || uiX == 0) {
		uiDeltaX = (kuiMaxX - uiDeltaX);
	}
}

Here, we have the code to move a rectangle back and forth across the screen. The first line of code sets the function NextFrame() as a callback that responds to the event that is generated at the start of a frame. After this, we have some code that creates a Sprite, draws a red rectangle on it, and adds the Sprite to the stage so that it will be displayed. In the next, three lines, we initialize the variables that will control the motion of the rectangle. Finally, we define the callback function, NextFrame(), which may seem confusing. We want to focus on the fact that this function sets the x-coordinate of the Sprite, qRect.x, to control the motion, while the rest of the code is just used for calculating the value of x.

Creating a Timed Callback Function in Actionscript 3.0

Below, we have an example program, which creates a timer callback function. This program draws a circle that flashes in the middle of the screen at a rate that is specified by the timer that we create. The code sets a timer to call a function that, alternatively, adds and removes a circle from the objects that are to be displayed.

The first three lines of active code initialize the Timer. The first line creates an instance of a Timer that creates a TIMER event every 1000 milliseconds, which equals 1 second. The second line sets the function FlashCircle() to get called every time a TIMER event occurs. The third line starts the Timer so that it generates events every second.

// Create a 1 second timer
var qMyTimer:Timer = new Timer(1000);
qMyTimer.addEventListener(TimerEvent.TIMER, FlashCircle);
qMyTimer.start();

var bDrawCircle:Boolean = true;

// Create a sprite with a circle drawn on it.
var qCircle:Sprite = new Sprite();
var uiColor:uint = 0x00800000;
qCircle.graphics.beginFill(uiColor);
    qCircle.graphics.drawCircle(160, 120, 100);
qCircle.graphics.endFill();

function FlashCircle(e:TimerEvent):void {
    // Add or remove the circle from the stage
    if (bDrawCircle) {
        addChild(qCircle);
    } else {
        removeChild(qCircle);
    }
    // Alternate the drawing
    bDrawCircle = !bDrawCircle;
}

Once the timer is initialized, we have a Boolean, bDrawCircle, that is used to toggle the display of the circle. Below this, we create a Sprite and draw a dark red circle on it. The circle is located at (160, 120) and has a radius of 100.

Finally, we have the callback function FlashCircle(). This function is called every second via a TIMER event. Inside the function, we add or remove the Sprite with the circle drawn on it from the list of items to be displayed. The last line reverses the value of the Boolean, bDrawCircle, to alternate it value between true and false and toggle the drawing of qCircle.

var qMyTimer:Timer = new Timer(1000, 3);

The timer in the program runs continuously. We could set the second argument in the constructor to 3, as shown in the line above. With this constructor call, the timer only runs 3 seconds and generates 3 events. When we don’t specify a second argument, the default value of 0 is used, which sets the timer to run indefinitely.

When we have a finite number of events coming from the timer, we can set an event callback to run when the timer is completely finished. The event TimerEvent.TIMER_COMPLETE can be used instead of TimerEvent.TIMER for a callback that runs when the timer is completely finished.

Type Conversions of Primitive Types in Actionscript

We can perform explicit type conversions by using constructor notation like this:

var dFloat:Number = 3.14159; var iConv:int = int(dFloat);

Here, we have the conversion of a floating-point (Number) type to an integer (int) type. A conversion from a Number to an int truncates the decimal so that the converted value “qConv” holds the value 3 after these lines are executed. In general, this is how the Number type gets converted to an int or a uint type: the value is simply truncated at the decimal point.

The Number type holds a much wider range than either the uint or int type can hold. When a Number type variable’s value lies outside the range of an int or a uint and a conversion takes place, a truncation occurs and the value is wrapped until it lies in the range of the target type.

var dFloat:Number = -3.14159; var uiConv:uint = uint(dFloat);

In the example above, the negative value of “dFloat” lies outside the range of the uint type. So, the result of this conversion is 4294967293, which is the same value you would get if you converted an int with the value of -3 to the unsigned (uint) type.

var bBool:Boolean = true; var uiConv:uint = uint(bBool);

We can convert numbers to booleans and vice versa. A Boolean variable with the value true gets converted to 1 and the value false gets converted to 0. This is the case regardless of whether the number type we are converting to is a uint, int or Number. So, the code segment above results in “uiConv” taking on the value 1 after the conversion.

var iNeg:int = -1; var bConv:Boolean = Boolean(iNeg);

When converting to a Boolean type from a numerical type, the value 0 converts to false, as does the value NaN for Number type variables. All other numerical values convert to true. So, for example, the code above converts the value -1 to true.

Converting numerical types to a String is pretty straight-forward. The value is converted to a string representation of the number. Likewise, Boolean values are converted to the strings “true” or “false,” as expected.

var sString:String = "a3.14"; var dConv:Number = Number(sString);

However, converting values from a String type is somewhat strange. A String converts to a Boolean value of false if the String is null or empty (“”). Otherwise, it converts to true. A String converts to a number if it can be converted. If a String contains non-numeric characters it converts to 0 for int and uint types, but converts to NaN for a Number type. The code above converts the string “a3.14” to NaN.

Categories

Recent Posts

Bits & Bytes

Archive for the ‘Actionscript’ Category

Creating a Simple Animation in Actionscript 3.0

Creating a Timed Callback Function in Actionscript 3.0

Type Conversions of Primitive Types in Actionscript