building the events components– lesson 111 building the events components lesson 11

14
Building the Events Components– Lesson 11 1 Building the Events Components Lesson 11

Upload: dennis-booker

Post on 13-Dec-2015

219 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

Building the Events Components– Lesson 11 1

Building the Events Components

Lesson 11

Page 2: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

2 Building the Events Components– Lesson 11

Objectives Import JPG images into a Flash file

dynamically. Create invisible buttons for functionality. Configure the registration point of a

movie clip symbol. Import script from a Script file. Use check boxes and input text boxes to

create an e-mail form.

Page 3: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

3 Building the Events Components– Lesson 11

Import JPG images dynamically You can import images into your document

based on user actions. Create a button symbol to contain the image.

To do so: Create a new layer (optional) and draw a rectangle

shape on the Stage. Set the desired dimensions in the Property inspector.

Convert the rectangle to a button symbol and set the registration point to the top left corner.

Assign a name for the symbol and click the OK button to close the dialog box.

Assign an instance name for the button in the Property inspector.

Page 4: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

4 Building the Events Components– Lesson 11

Set the registration point for movie clip or button symbols The registration point determines where the

movie clip or button will begin to load into its specified area. To do so:

Create an area for the symbol using the Rectangle or other tool.

Double-click the area, click the Modify menu, and then click Convert to Symbol.

Click one of the dots in the Registration section of the dialog box. (Most images begin to load from the top left corner.)

Click the Movie Clip or Button Behavior option. Assign a name for the symbol and close the dialog box. Assign an instance name for the symbol so it can be

referenced by a loadMovie command in an action script.

Page 5: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

5 Building the Events Components– Lesson 11

Setting the registration point

The figure below shows the Convert to Symbol dialog box where you set the registration point for symbols.

JPG and other images normally begin to load from the top left corner of the area they are inserted into. Setting the registration point anywhere else can cause the image to appear incorrectly.

Click one of the circles to set the registration point.

Page 6: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

6 Building the Events Components– Lesson 11

Use ActionScript to load the image dynamically

With a button symbol in place to contain the image, you can create ActionScript to load the image. To do so: Create an Actions layer, if necessary. Click the desired frame for the layer and

open the Actions-Frame panel. Expand the Browser/Network category (within

the Global Functions category) and double-click the loadMovie command.

In the parentheses next to the action name, enter the path to the image.

Page 7: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

7 Building the Events Components– Lesson 11

Invisible buttons add functionality to your movie Dynamically loading images into the button

symbols makes it difficult to add sound effect and loading commands in script code.

Invisible buttons can be added on top of the button symbol to contain the scripting and sound functionality.

Invisible buttons have graphic elements only in the Hit state.

Invisible buttons appear as semi-transparent, aqua-colored objects on the Stage. (They do not show up in the published file.)

Page 8: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

8 Building the Events Components– Lesson 11

Create an invisible button Create a layer (optional) for the invisible

button. Draw a rectangle (or other shape) and

convert it to a button symbol. Assign a name to the symbol.

Double-click the button in the library to enter editing mode. Click the Up keyframe and drag it to the Hit state. (The other states should all now be empty.)

Page 9: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

9 Building the Events Components– Lesson 11

Add sound and code to the invisible button While still in editing mode for the invisible button,

add a new layer to contain the sound effect. Create a keyframe in the Down state of the sound

layer. Locate the sound effect from the Sounds panel.

Click the Down frame of the sound layer and drag your selected sound onto the Stage to insert the sound into the Down and Hit states.

Drag the invisible button over the top of the button symbol for the area to contain the JPG image.

Open the Actions panel and add the ActionScript for the invisible button.

Page 10: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

10 Building the Events Components– Lesson 11

Create an e-mail form You can use text boxes and check boxes to create

an e-mail form. Text boxes can be used to create labels to identify

an input box and to allow the user to enter input. Use the Text tool in the toolbar to create the text boxes

and format them as desired. Drag CheckBox components from the Components

panel to add check boxes to the form. Check boxes allow users to select multiple items that they

are interested in. Check boxes include a label that can be set in the Property

inspector to tell the user the purpose of the box.

Page 11: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

11 Building the Events Components– Lesson 11

A Flash e-mail formThe figure below shows an example of an e-mail form created in Flash. The form has labels to identify the components, two text boxes for the user to input data, and four check boxes that the user can select.

Labels

Check boxes

Text boxes

Page 12: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

12 Building the Events Components– Lesson 11

Use the information on the form to send e-mail You can add a submit button to the

form that the user can click when they have entered their data.

Your Flash document can extract their data and send them an e-mail with the information they requested.

You can import a generic script that uses the mailto: command and customize it for your document.

Page 13: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

13 Building the Events Components– Lesson 11

Import generic scripts and customize them You can import preconfigured scripts into

your document and edit them as needed. To import a generic script:

Click the Options menu of the Actions panel, then click Import Script.

Locate the folder containing the script (scripts have an .as extension) and double-click the script to import it.

Browse through the script and edit it as needed.

Page 14: Building the Events Components– Lesson 111 Building the Events Components Lesson 11

14 Building the Events Components– Lesson 11

Summary

In this lesson, you learned: To import JPG images into a Flash file

dynamically. How to create invisible buttons for

functionality. How to configure the registration point of a

movie clip symbol. To import script from a Script file. How to use check boxes and input text boxes

to create an e-mail form.