Flash Exercise 2

You can download these instructions if you wish: (right click and “Save Link As”) Flash Exercise 2

CODE SNIPPETS (explained later):

At the end of your animation: (below)

stop();

At the beginning of your animation:  (below)

import flash.events.MouseEvent; function onClick(event:MouseEvent):void {  gotoAndPlay(1); } replay_btn.addEventListener(MouseEvent.CLICK, onClick);

<Instance Name>: replay_btn

Exercise 2 Instructions:

Create a new file, Action Script 3, 650 x 500
Save it in your Drive or DropBox folder with your lastnamefirstinitial_ex2

Screen Shot 2013-09-16 at 8.50.22 AM

Screen Shot 2013-09-16 at 8.49.09 AM Change stage colour
Choose the Oval tool. Choose a stroke and fill colour that is different from the default. Make the stroke bigger. Draw a PERFECT CIRCLE (hold shift).

Screen Shot 2013-09-16 at 8.53.32 AM
Choose the text tool. Use an interesting, lively font and an appropriate size and colour.
Write your initials inside of the circle.

Screen Shot 2013-09-16 at 8.56.58 AM

Group the text and the shape together.

Screen Shot 2013-09-16 at 8.57.27 AM
Use the Align panel to position your shape in the bottom left corner.

Screen Shot 2013-09-16 at 8.58.07 AM

Screen Shot 2013-09-16 at 8.58.12 AM
Change the drawing into a symbol

Screen Shot 2013-09-16 at 8.58.33 AM

Right click on the object and choose Create Motion Tween

Screen Shot 2013-09-16 at 8.59.15 AM
Screen Shot 2013-09-16 at 8.59.30 AM

Place the playhead on frame 24
Move the symbol so that it is aligned in the bottom right corner

Screen Shot 2013-09-16 at 9.00.11 AM
Place the playhead on frame 12

Screen Shot 2013-09-16 at 9.00.37 AM

Move the symbol so that it is aligned in the middle of the stage and against the top

Screen Shot 2013-09-16 at 9.00.33 AM

Go to the Control menu and choose Test Movie

Screen Shot 2013-09-16 at 9.01.14 AM

To stop the animation from looping:

Create a new layer. Call this Action.

Screen Shot 2013-09-16 at 9.06.31 AM

Screen Shot 2013-09-16 at 9.06.43 AM

Choose frame 24 on the action layer.
Open the Action panel

Screen Shot 2013-09-16 at 9.07.26 AM

Insert a Key Frame

Screen Shot 2013-09-16 at 9.33.16 AM

Screen Shot 2013-09-16 at 9.08.23 AM

Enter the text: stop();

Screen Shot 2013-09-16 at 9.08.50 AM
Go to the control menu and test movie

Screen Shot 2013-09-16 at 9.01.14 AM

To replay the animation:

Create a new layer. Call it Button.

Screen Shot 2013-09-16 at 9.11.33 AM
Open the Components panel.

Screen Shot 2013-09-16 at 9.11.51 AM

Under User Interface, drag a button onto the screen.

Screen Shot 2013-09-16 at 9.11.58 AM

Screen Shot 2013-09-16 at 9.13.28 AM
Make sure the button is selected on the stage. Open the Properties panel. Change the name of this to replay_btn

Screen Shot 2013-09-16 at 9.15.00 AM
Still in Properties, look for Component Parameters. Change the label to “Replay” (or other text.)

Screen Shot 2013-09-16 at 9.15.15 AM
On the Actions layer, put the playhead in frame 1.

Screen Shot 2013-09-16 at 9.15.30 AM
Go to Actions panel. Paste in this code snippet:

import flash.events.MouseEvent; function onClick(event:MouseEvent):void {  gotoAndPlay(1); } replay_btn.addEventListener(MouseEvent.CLICK, onClick);

Go to control and test movie.

Go to File menu and look at Publish settings.
Make sure that Flash and HTML are turned on, the rest off

Publish animation.

To view, open the HTML file in your browser

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Tell Mr. Robson what's on your mind!