Actionscript 3.0 for beginners: lesson # 2

As promised here is the second lesson in ActionScript 3.0! Today we start the analysis of a simple project that reproduces the play or the Tic Tac Toe Tic Tac Toe. I tried to include some special features in this example, ActionScript 3.0, trying to give space to the understanding and not on style. It follows that if I had to write the "game" really, I probably would have structured very differently, but in this case I tried to mediate between a classical program with a compact, hermetic more understandable for newbies. I created a single document class, the procedure is not necessary but useful to keep in line with the previous lesson .

Tic Tac Toe

Loading Flash ...

The source

In addition to the ActionScript file (. As) the document class, which will begin to analyze in detail here, the project is equipped with a standard Flash movie (. Fla) that provides the game interface. All the files needed to follow the comments to the code are available here .

Diagram of the game

In this version of the game I did not put the computer as an opponent, activities you can do if you feel like you readers. The issue, therefore, alternates two players, just like we're playing on a blackboard or on a sheet of paper. The logical schema that will follow is the following:

Scheme Tic Tac Toe

Global vision

e il suo interno: Before beginning the actual analysis of the code is good to see the outlines of a generic class, composed of the package , class , and its interior:

Scheme Tic Tac Toe

Document Class Manufacturer

As we anticipated last time , when we link to a Flash document - a movie - a document class, the latter being a real object to be instantiated, the system will boot the manufacturer.

1
2
3
4
5
6
7
8
9
/ **
* Constructor of the class
* /
TicTacToe ( ) : void { public function TicTacToe (): void {
/ / Set mode and internship internship stairs align
scaleMode = StageScaleMode . NO_SCALE internships. scaleMode = StageScaleMode . NO_SCALE
align = StageAlign . TOP_LEFT ; internships. align = StageAlign . TOP_LEFT;
Event . ADDED_TO_STAGE , init ) ; addEventListener ( Event . ADDED_TO_STAGE, init);
}

quando la nostra classe documento è aggiunta allo stage , cioè quando sarà visualizzata! The manufacturer in this case sets the stage , which is the container within a browser and add the call to the function / method init() when the document is added to our class stage , ie when it is displayed! This is a standard procedure that I adopt often. In some cases it is totally unnecessary, but if you make use of components, that is, those visual objects in the interface of the Flash (such as TextArea, TreeView, etc ...), these will not be available (as pointers) until the event ADDED_TO_STAGE has not been released! So to be safe, it is always good practice to follow this path, in anticipation of any new releases.

For those who own a dry object oriented programming, I recommend reading at least Classes, Objects and Instances !

: The function or method, init() has been called private (see Actionscript 3.0: public, protected, private, and internal ) by the keyword private :

1
2
3
4
5
6
7
8
9
10
/ **
* Method invoked when the MovieClip is added to the Stage
*
* @ Param {event} e = went from addEventListener (). Can be null
* @ Return void
* @ Private
* /
init ( e : Event = null ) : void { private function init (e: Event = null): void {
initCell ();
}

For now, as you can see, this function does is call another, initCell() . Often in the method init() are inserted all the initialization functions, avoiding to directly enter the code open. This can come in handy just in case re-initialize some parameters. Since this is an example of a relatively simple game, it may be strange to have this double jump almost useless, but in other cases, the method init() can be much larger, by calling a series of init functions like:

1
2
3
4
5
6
7
8
9
init ( e : Event = null ) : void { private function init (e: Event = null): void {
initBackground ();
initIntro ();
initPlayers ();
initScore ();
initEnemy ();
initSound ();
; start ();
}

. The method init() is invoked (ie called) when the system releases the event ADDED_TO_STAGE . For this reason it was added the parameter e:Event .

Tricks notes: often it can happen to have methods (such as init() ) that are invoked by both events, both within the code. It is precisely for this reason that the parameter of this method was set to e:Event = null . (a meno di “simularlo” con un notevole spreco di energie). In this way, in fact, should it ever need, we can call init() without passing any parameters, because we are not an event and then we could not pass the parameter e:Event (unless you "fake it" with considerable waste of energy ). For details on the management of the parameters in Actionscript 3.0, see also: Topics and default variables in Javascript, Actionscript and PHP and Actionscript 3.0 Topics variables ,

Initialization of the game

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
/ **
* Initialize a linear array that will represent our grid.
* This "grid" is defaulted to zero (0), which specifies that no
* Symbol (o / x) was done.
* The player 1 (or) will be assigned the value one (1). While the player 2 (x) will
* Associated with the value ten (10). With this trick when such
* Sum of the values ​​in row 1 is equal to 3, we will know who won the player 1.
* If the sum, instead of column 1 is 30, then won the 2 player ... and so on.
*
* 0 | 0 | 0
* --+---+---
* 0 | 0 | 0
* --+---+---
* 0 | 0 | 0
*
* @ Param void
* @ Return void
* @ Private
* /
initCell ( ) : void { private function initCell (): void {
/ / Array of pre-set the game to zero
, 0 , 0 , 0 , 0 , 0 , 0 , 0 , 0 ] ; __cell = [0, 0, 0, 0, 0, 0, 0, 0, 0];
/ / Always begins with the player (player) # 1
__player = 1;
/ / Draw the grid on the screen
createGrid ();
/ / Show the screen the player's turn (in this case 1)
= 'PLAYER ' + __player ; turno_txt. text = 'player' + __player;
/ / This variable is used to put the game paused if true
/ / Start game-
__stop = false;
}

This method initCell() takes care of initializing all the variables and create all the objects in the game.

Tricks notes: almost all video game programmers are perfectly familiar with the technique of mapping the playing area into an array with one or more dimensions. This technique, used in so-called Tile Game allows you to run a series of controls in a logical released from graphics to video. In this specific case I used a simple one-dimensional array consists of 9 elements representing the 9 boxes of the game. The fact that the array elements are sequential, compared to 3 x 3 grid, is not a problem as we shall see, but only a matter of point of view!
For those who want to deepen the interesting subject, I recommend reading Tile Based Games

All variables for internal use, global class-level, indicate use of the double underscore in front. indicano rispettivamente il giocatore attivo e lo stato del gioco. These, in fact, during the first draft of a class may then become public property, using their own encapsulation of OO programming (see write good OO code in Adobe Flash ). __player and __stop denote the active player and the game state.

For now I will stop here! Next time we will analyze the method createGrid() and the rest of the game, if you have questions or comment on this part.

4 comments to "Actionscript 3.0 for beginners: lesson # 2"

  1. September 28, 2008 Actionscript 3.0 for beginners: lesson # 3 | Undolog.com :

    [...] Analysis of the example of the game Tic Tac Toe, presented in Actionscript 3.0 for beginners: lesson # 2. We arrived at the function that creates the game grid: PLAIN TEXT [...]

  2. November 4, 2008 Billigflüge :

    Even though I do not like tic tac toe, Because The first player always wins, if he Makes His marks on at the right places, your tut is great! There are some points unclear to me yet, but I hope you will translate the site fastly. Kind regards

  3. November 11, 2008 Actionscript 3.0 for beginners: lesson # 4 | Undolog.com :

    [...] Our sample code for the TicTacToe (found in full on Google Code) and begin to analyze it in [...]

  4. November 28, 2008 dosa85:

    ontinuo do not understand how to insert the code .... I copy and paste error though usually in the AS file ... .... Bha!

Leave a comment

XHTML TAG PERMIT: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERTION CODE:
 <pre></pre> // blocco generico <code></code> // blocco generico [cc_actionscript][/cc_actionscript] // Actionscript [cc_actionscript3][/cc_actionscript3] // Actionscript 3 [cc_css][/cc_css] // CSS Style Sheet [cc_html][/cc_html] // HTML [cc_js][/cc_js] // Javascript [cc_objc][/cc_objc] // Objective-C [cc_php][/cc_objc] // PHP [cc_sql][/cc_sql] // SQL 


Stop SOPA