Day #10 example - Friday, May 23rd, 2008 Flash games lab exercise



  1. Rollover Effects - pages 85 to 88 of your textbook (BGP book) should be read and tried out, as you review today's class.

  2. Today was the first day for Guide and Guided layers. Tweening Motion Along a Path is covered on pages 67 thru 70 of your BGP textbook.

  3. We just ran out of time and did not add the following ActionScript 3.0 statements and code to our application. Where do you add the code? To the actions layer of the explodingStars symbol.

    stop();
    
    play_btn.addEventListener(MouseEvent.ROLL_OVER, animate);
    
    function animate(evt:MouseEvent) {
    	play();
    }
    
  4. What layers did the explodingStars Movie Clip Symbol have? There were five layers. We named them button, star1, star2, star3, star4 and actions.

       top layer: actions
                  star4         Frame 2 KF has instance of starAnimation symbol
                  star3            "                                     "
                  star2            "                                     "
                  star1            "                                     "
    bottom layer: button        Frame 1 KF has the buttonSymbol (see book)
    
  5. What is different in the star1, star2, star3 and star4 layers, which all have only have a blank keyframe at Frame 1 and a Frame 2 keyframe with an instance of starAnimation symbol in it?

    The only difference is that 
        the starAnimation symbol instance in 
                    the star2 layer instance was rotated 90 degrees, 
                    the star3 layer instance was rotated 180 degrees, and
                    the star4 layer instance was rotated 270 degrees.
    
    How wonderfully symmetric to have the animations coming out in four 
    different directions.
    
    Note:  I changed the color (Tint) of each of the starAnimationSymbols
           to increase the interest in my star explosion.
    
  6. How did we get the rotating of 90, 180 and 270?
    Select one of the starAnimation instances from frame #2 of either
           the star2, star3, or star4 layers.
    
    Click on the star itself, then change the Tint color using the 
           Property Inspector panel.
    
    Modify menu, Transform submenu, Scale and Rotate command.
    
           Rotate  90 (for star2 layer object)
           Rotate 180 (for star3 layer object)
           Rotate 270 (for star4 layer object)
    
  7. We used the History Panel techniques to do the Rotate 180 and the Rotate 270. It was easier to Repeat the Rotate 90 twice for star3 object and 3 times for the star4 object.

  8. Download the COMPLETED VERSION of the above .swf file, so you can examine the various symbols and layers of the symbols and the Motion Guide, ActionScript and main stage filled with 100s of invisible objects (till run time).