Chapter: Internet & World Wide Web HOW TO PROGRAM - Rich Internet Application Client Technologies - Adobe Flash CS3: Building an Interactive Game

| Study Material, Lecturing Notes, Assignment, Reference, Wiki description explanation, brief detail |

Objects in Flash

In this section, we introduce object-oriented programming in Flash.

Objects in Flash

 

In this section, we introduce object-oriented programming in Flash. We also demonstrate dynamic positioning (i.e., moving an object). We create two boxes. Each time you click on the left box, the right box will move to the left.

 

Start by creating a new Flash document named Box.fla. Set the movie’s dimensions to 230 px wide and 140 px high. On the stage, draw a 100-px-wide blue box with a black


outline and convert it into a movie-clip symbol. You can name this symbol box, but that is not necessary. Next, select the box on the stage and delete it, leaving the stage empty. This step ensures that the box will be added using the ActionScript code and that the box is not already on the stage. Now, create a new ActionScript File from the File > New menu, save it as BoxCode.as in the same directory as Box.fla, and add the code in Fig. 17.3.

 

The properties x and y refer to the respective x- and y-coordinates of the boxes. The two imports (lines 5–6) at the top of the code allow for the code to utilize those two classes, which in this case are MouseEvent and Sprite, both of which are built-in Flash classes. Inside the class, the two Box instances are declared. By declaration of the two Box objects at the beginning of the class (lines 11–12), they become instance variables and have scope through the entire class. Once the boxes have been allocated positions (lines 18–21), they must be placed on the stage using the addChild function (lines 23–24). The function handleClick is called every time the user clicks box1. The addEventListener function, which is invoked by box1, specifies that handleClick will be called whenever box1 is clicked (line 27).

 

1    // Fig. 17.2: BoxCode.as

 

2    // Object animation in ActionScript.

 

3    package

4    {

 

5          import flash.events.MouseEvent; // import MouseEvent class

 

6          import flash.display.Sprite; // import Sprite class

7

8          public class BoxCode extends Sprite

9          {

 

10               // create two new box objects

 

11               public var box1 = new Box();

 

12               public var box2 = new Box();

13

14               // initialize Box coordinates, add Boxes

 

15               // to the stage and register MOUSE_DOWN event handler

 

16               public function BoxCode() : void

17               {

 

18                      box1.x = 15; // set box1's x-coordinate

 

19                      box1.y = 20; // set box1's y-coordinate

 

20                      box2.x = 115; // set box2's x-coordinate

 

box2.y = 20; // set box2's y-coordinate

 

22

23                      addChild( box1 ); // add box1 to the stage

 

24                      addChild( box2 ); // add box2 to the stage

25          

26                      // handleClick is called when box1 is clicked

 

27                      box1.addEventListener( MouseEvent.MOUSE_DOWN, handleClick );

 

28                } // end BoxCode constructor

29

30                // move box2 5 pixels to the left whenever box1 is clicked

 

31                private function handleClick( args : MouseEvent )

32                {

33                      box2.x -= 5;

 

34                } // end function handleClick

 

35         } // end class BoxCode

 

36   } // end package

 

Fig. 17.3 | Object animation in ActionScript.

To test the code, return to Box.fla. In the Library panel, right click the Box symbol and select Linkage. In the pop-up box, check off the box next to Export for ActionScript and type Box in the space provided next to Class. Ignore Flash’s warning that a definition for this class doesn’t exist in the classpath. Once you return to the stage, go to the Property Inspector panel and in the space next to Document Class, type BoxCode and press Enter. Now, the BoxCode ActionScript file has been linked to this specific Flash document. Type <Ctrl>-Enter to test the movie.

 

Study Material, Lecturing Notes, Assignment, Reference, Wiki description explanation, brief detail


Copyright © 2018-2020 BrainKart.com; All Rights Reserved. Developed by Therithal info, Chennai.