Bits & Bytes

Archive for the ‘Actionscript’ Category

Declaring and Using Vectors in Actionscript 3.0

Actionscript allows us to use a parameterized Vector class for an array-type data structure, in addition to the Array class. Unlike an Array, a Vector can only hold one type of data item. This restriction allows a Vector to be accessed more efficiently than an Array. So, a Vector should be used whenever possible.

A Vector in Actionscript is similar to an STL vector in C++. Both are parameterized by a data type and can grow or shrink as items are added or removed. Both the Actionscript and C++ types have many different operations for manipulating the vector types. Both vectors also use the less-than and greater-than symbols to bracket the parameter type. However, the Actionscript Vector requires an additional period before the parameter, as shown in the examples below.

One-Dimensional Vectors

Function Notation

var aMyVector:Vector.<int> = Vector.<int>([1, 2, 3]);
var aMyArray:Array = Array(new Sprite());
var aMyVector:Vector.<DisplayObject> = Vector.<DisplayObject>(aMyArray);

Constructor Notation

var aMyVector:Vector.<int> = new Vector.<int>();
aMyVector.push(1, 2);
var aMyVector:Vector..<int> = new Vector.<int>(2);
var aMyVector:Vector.<int> = new Vector.<int>(2, true);
aMyVector[0] = 1;
aMyVector[1] = 2;

Multi-dimensional Vectors

Above, we have several examples of how to create a Vector. The first example uses the Vector() function to create a Vector of 3 ints with the values 1, 2, and 3. The second example uses the Vector() function to create a Vector of the base type DisplayObject from an Array of the derived type Sprite.

Using constructors, we have three examples below those; the constructor takes two parameters: an uint and a Boolean to set the size and the whether the size is fixed, respectively. Without any parameters, the constructor uses the default parameters 0 and false to create a Vector of size zero that can be resized, as we show in the first constructor notation example. In the second constructor example, we create a Vector of ints with size 2. Since we did not specify a second argument, the Vector does not have a fixed size. In the last example, we create a Vector of ints with size 2 that has a fixed size, since the second parameter is true. We use the bracket operator to fill the first and second entries with 1 and 2, respectively.

var aaMyVector:Vector.<Vector.<int>> = new Vector.<Vector.<int>>(3, true);
aaMyVector[0] = new Vector.<int>(2, true);
aaMyVector[1] = new Vector.<int>(2, true);
aaMyVector[2] = new Vector.<int>(2, true);

aaMyVector[0][0] = 1;
aaMyVector[1][0] = 2;
aaMyVector[2][0] = 3;
aaMyVector[0][1] = 4;
aaMyVector[1][1] = 5;
aaMyVector[2][1] = 6;

Just as we did for Arrays, we can create multi-dimensional Vectors recursively. We can combine any of the methods for creating one-dimensional Vectors to do this. However, we limit ourselves to one example to avoid confusion. In this example, we create a Vector of 3 int Vectors. Next we create a new Vector of ints for each entry of this Vector. Finally, we use the double bracket operator to assign each entry a value.

Declaring and Using Arrays in Actionscript 3.0

Arrays in Actionscript are extremely flexible; there are many ways to declare and assign values to an array in Actionscript. We can use functions, bracket notation, or constructors to create an Array object. We also have several ways to fill the entries of an Array object.

It is important to note that an Array in Actionscript is an object. So, an Actionscript Array is very different from say an array in C/C++. In fact, Arraysin Actionscript can hold many different types of data, which is different from arrays in most languages. However, Actionscript does also have a Vector type, which is similar to a traditional array in that, for efficiency, it is limited to holding only one type of data.

One dimensional Arrays are pretty straight-forward in how they can be declared and used. However, there are multiple methods for creating one-dimensional Arrays, which can be put together in numerous combinations to created multi-dimensional Array objects.

One-Dimensional Arrays

Function Notation

var aMyArray:Array = Array();
var aMyArray:Array = Array(3);
var aMyArray:Array = Array(qMyObject);

Bracket Notation

var aMyArray:Array = [“XoaX.net”, 17];

Contructor Notation

var aMyArray:Array = new Array();
var aMyArray:Array = new Array(3);
var aMyArray:Array = new Array(1, 2, 3);

Above, we show several methods for creating an Array. The first three examples use function notation to create an Array of 0, 3, and 1 objects, respectively. Next, we have an Array of two elements that is created via the bracket notation; notice that the Array contains elements of different types: a string and an int. Lastly, we have three Array objects that are created using constructors: the first creates an Array with 0 elements, the second an Array with three elements, and the third an Array of the three elements 1, 2, and 3.

Filling an Array

var aMyArray:Array = new Array();
aMyArray.push(80, 120, 200, 440);
var aMyArray:Array = new Array(4);
aMyArray[0] = 80;
aMyArray[1] = 120;
aMyArray[2] = 200;
aMyArray[3] = 440;

Above, we have two examples of how to declare and fill an Array with the four elements 80, 120, 200, and 400. In the first case, the push() function puts an element, or multiple elements, into an Array and extends the size of the Array. In the second case, we use the typical bracket operator [] to set the value of entries that are already allocated. There are many other functions available for removing elements, concatenating Arrays, and altering Arrays in many other different ways, as well; we will cover those later.

Multi-dimensional Arrays

var aRow1:Array = new Array(1, 2, 3);
var aRow2:Array = new Array(4, 5, 6);
var aMyArray:Array = new Array(aRow1, aRow2);
var aRow1:Array = [1, 2, 3];
var aRow2:Array = [4, 5, 6];
var aMyArray:Array = [aRow1, aRow2];
var aMyArray:Array = new Array(2);
aMyArray[0] = new Array(1, 2, 3);
aMyArray[1] = new Array(4, 5, 6);
var aMyArray:Array = new Array(2);
aMyArray[0] = [1, 2, 3];
aMyArray[1] = [4, 5, 6];
var aMyArray:Array = [ [1, 2, 3], [4, 5, 6] ];

Here, we have 5 examples of how to create a two-dimensional Array object, by combining the methods for one-dimensional Arrays. We can continue like this and create Arrays with any number of dimensions.

Creating a 3D Animation in Actionscript 3.0

In this example, I create a 3D box with a ball bouncing around inside it. To do this, I create an animation using the ENTER_FRAME event that I used in the previous animation. The entire program is below at the end of this post.

The first line of code sets the callback for each frame of animation via a call to addEventListener() with ENTER_FRAME as the event and the function NextFrame() as the callback. After this, we use the stage’s graphics object to paint the entire screen black; this will be the background.

The next four sections of code each draw a rectangle in various shades of red and rotate them to make them to be perpendicular to the view. These are the four sides of our box. They are assigned a z-value of 25 to move them slightly away from the view plane at z = 0. Finally, the back to the box is created at z = 325 with a “XoaX.net” logo Bitmap. The dimensions of the box are 320x240x300.

After the walls of the box are created, we have three sets of variables for each dimension of movement for the ball inside the box. After this, we have Bitmap that represents the ball. This ball will be moved around by our animation callback function. Lastly, we have the callback function, which reflects the ball in each coordinate, similar to what we did in the last animation with the x-coordinate. Using these reflections, we get a ball that bounces around the box as we see in window above. Note that the projection is created via the default perspective projection, which we have not discussed yet.

addEventListener(Event.ENTER_FRAME, NextFrame);

// Paint the stage black 
var uiColorBack:uint = 0x00000000;
graphics.beginFill(uiColorBack);
    graphics.drawRect(0, 0, 320, 240);
graphics.endFill();

// Top
// Create rect for sprite and add to stage
var qTop:Sprite = new Sprite();
var uiColor:uint = 0x00900000;
qTop.graphics.beginFill(uiColor);
    qTop.graphics.drawRect(0, 0, 320, 300);
qTop.graphics.endFill();
qTop.rotationX = 90;
qTop.z = 25;
addChild(qTop);

// Left
var qLeft:Sprite = new Sprite();
var uiColor2:uint = 0x00B00000;
qLeft.graphics.beginFill(uiColor2);
    qLeft.graphics.drawRect(0, 0, 300, 240);
qLeft.graphics.endFill();
qLeft.rotationY = -90;
qLeft.z = 25;
addChild(qLeft);

// Right
var qRight:Sprite = new Sprite();
var uiColor3:uint = 0x00D00000;
qRight.graphics.beginFill(uiColor3);
    qRight.graphics.drawRect(0, 0, 300, 240);
qRight.graphics.endFill();
qRight.rotationY = -90;
qRight.x = 320;
qRight.z = 25;
addChild(qRight);

// Bottom
var qBottom:Sprite = new Sprite();
var uiColor4:uint = 0x00F00000;
qBottom.graphics.beginFill(uiColor4);
    qBottom.graphics.drawRect(0, 0, 320, 300);
qBottom.graphics.endFill();
qBottom.rotationX = 90;
qBottom.y = 240;
qBottom.z = 25;
addChild(qBottom);

// Back
// Use a logo image to create a bitmap
var qLogo:Bitmap = new Bitmap(new Logo(320, 240), "never", true);
qLogo.z = 325;
addChild(qLogo);

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

var uiY:uint = 0;
var uiDeltaY:uint = 3;
var kuiMaxY:uint = 180;

var uiZ:uint = 0;
var uiDeltaZ:uint = 3;
var kuiMaxZ:uint = 240;

// Use a ball image to create a bitmap
var qBall:Bitmap = new Bitmap(new Ball(60, 60), "never", true);
addChild(qBall);

// Animation callback
function NextFrame(e:Event) : void {
	uiX = ((uiX + uiDeltaX) % (kuiMaxX + 1));
	qBall.x = uiX;
	if (uiX == kuiMaxX || uiX == 0) {
		uiDeltaX = (kuiMaxX - uiDeltaX);
	}
	
	uiY = ((uiY + uiDeltaY) % (kuiMaxY + 1));
	qBall.y = uiY;
	if (uiY == kuiMaxY || uiY == 0) {
		uiDeltaY = (kuiMaxY - uiDeltaY);
	}
	
	uiZ = ((uiZ + uiDeltaZ) % (kuiMaxZ + 1));
	qBall.z = uiZ + 30 + 25;
	if (uiZ == kuiMaxZ || uiZ == 0) {
		uiDeltaZ = (kuiMaxZ - uiDeltaZ);
	}
}

Categories

Recent Posts