Buttons, Sound, and ActionScript


Open Flash CS5

File>New...>Flash Document (ActionScript 2.0)

Change the stage size to 640 X 480 in the Property Window

Choose a white background and 12 fps

Draw a circle with a Solid fill and Black 2 pt Solid Stroke. This is going to be a button, so don't make it too large.

Select the circle AND stroke, Modify>Convert to Symbol (F8)

Name it "shapeButton" and choose Button as a type, Center Registration

convert

Notice the bounding box, that is one way of telling you that it is no longer a "Shape", it is an "Object"

Save as lnBSA.fla (Last Name in lowercase, Buttons, Sound, Actions)

Cmd+L or Window>Library, Dbl Click the shapeButton icon (not the object name).  You should now be in Edit Mode of your timeline

Lab le the layer "button"

Make a new layer & lab le it "text"

edit

On the "text" layer, select your Text tool & type with Black the Word "Shape" 12 or 14 pt, Bold, Times

With your selection tool center the word over your button. Make sure View>Snapping>Snap to Objects is Unchecked

Select the "Over" frame (both layers)

over

F6 or Insert>Timeline>Keyframe

Select the "Down" frame & F6 (both layers)

Select the "Hit" frame & F6 (button layer only)

Up, Over, Down, Hit

Select the "Over" frame, then select just the Stroke & from the "Transform" panel (Window>Transform), with Constrain checked, type 120% then "tab"

stroke

Select the "Down" frame & change the color of the button's fill

Leave the "Hit" frame  alone

Go back to "Scene 1" by clicking "Scene 1" anchor

scene1

Control>Enable Simple Buttons (Option+Cmd+B)

See your new "Rollover Button" in action

Make another button, name it "classicButton" by duplicating the shapeButton in the Library and changing it's name to classicButton. The drop down menu to get the "duplicate..." action is in the upper right hand corner of the Library window.

sub menu

Duplicate the shapeButton again and name it "textButton"

Dbl click the classicButton's icon to get into "Editing" mode

Select the text "up" frame

Shift+f5 - twice

This will delete the two frame in fro of it (Over & Down)

Replace the word "Shape" with "Classic" and center it in the Button

Click f6 twice & it will paste it into the Over frame and twice again to fill it into the Down frame

Repeat with the textButton and use the word "Text"

Go back to scene 1

Drag one instance each of the classicButton, and textButton from the Library to the stage

Make sure "Enable simple buttons" is not checked (Control>Enable Simple Buttons)

Arrange the three buttons along the left side of the stage, fairly evenly spaced

Modify>Align>Left

Modify>Align>Distribute Heights

Label layer 1 as "buttons"

Insert/Scene - Twice

You now have 3 scenes, which are the same as 3 HTML pages, or three different windows when it is playing on the Internet.

Go back to Scene 1

back scene 1



Window>Other Panels>Scene,  Rename Scene 1 as shapeScene (return), and Scene 2 as classicScene (return), and Scene 3 as textScene

Close the panel and go back to shapeScene

Make sure "Enable Simple Buttons" is off & the "Action" widow is visible (Window>Actions)

Click "Script Assistant Button"

actionPanel

Also bring up the Output Window (Window>Output)

Select the Shape button

From the actions window: Global Functions>Movie Clip Control>Dbl. click "on">select "release"


Global Functions>Timeline Control>Dbl. click "gotoAndPlay" and choose "shapeScene" from the drop-down menu (see picture above)

Save

Select the Classic button

Repeat above, but, after the gotoAndPlay and choose   "classicScene"

Save

Select the Text button

Repeat above, but, after the gotoAndPlay and choose   "textScene"


Check Control>Enable Simple Buttons

Check to see if buttons work

If they do.....

Save

Select frame 1 of the shapeScene, Edit>Timeline>Copy Frames

Go to the classicScene

Select frame 1, Edit>Timeline>Paste Frames

Save

Go to the textScene

Select frame 1, Edit>Timeline>Paste Frames

Save

Go to your scene named "shapeScene"

Create a new layer in your timeline and name it "shapeTween"

Create a 50 frame Shape Tween

Go to your scene named "classicScene"

Create a new layer in your timeline and name it "classicTween"

Create a 50 frame Classic Tween

Make sure Buttons extend from frame 1 through to frame 50

Save

Go to your scene named "textScene"

Create a new layer in your timeline and name it "textTween"

Create a 50 frame Text Tween

Make sure Buttons extend from frame 1 through to frame 50

Save

You should now have a 3 page web page, with an animation on each


Control>Test Movie.  Do you see a problem?

Close the .swf file

Select shapeScene in your .fla file

Add a layer, label it "actions"

Select the last frame of your animation, F7

click the "Script Assistant button"

In the Actions Palette  GlobalFunction>Timeline Control>Dbl. click "stop"

Go to classicScene and textScene and do the same thing

Control>Test Movie

Close the .swf movie

Go back to shapeScene

Window>Library (Cmd+L)

Dbl click the shapeButton icon to get into the editing mode

Download a royalty free sound

Add a new layer, lab le it "sound"

File>Import>Import to Library  find the royalty free sound that you downloaded

Select the down frame of the sound layer, F7 & then drag a sound from the library to the stage

Repeat this for the classicButton and textButton

Go back to shapeScene

Control>Test Movie and check to see if the sound is working

Close SWF

Make a new layer in shapeScene and name it "webmaster"

Select the Text tool, Times, 18 pt, Bold, Black, Static text, type "Webmaster"

Place in lower left corner, under buttons

Make the word into a button

Name it wordButton

Edit it's Over, Down & Hit state (make the hit area a rectangle)

hit area



Go back to shapeScene

Make sure Enable Simple Buttons is off

Select the Webmaster button

click the "Script Assistant button"

Actions Palette: Global Function>Movie Clip Control>Dbl. click "on">click "release"

Global Function>Browser/Network>Dbl. click "getURL" then type  "mailto:mwh710@hotmail.com" in the URL field and in the window field choose "_self" from the drop down menu

Variables - Don't send

Save

File>Publish Settings

format
flash

Select and make noted changes from above pictures as an example

Click the Publish button

Check the HTML in several browsers

Test webmaster button

If it works, then copy frames and paste the button frame into the classicScene and textScene (Don't forget to make a new layer) and republish like above

Save

eMail me the .fla, .html, and the .swf files.