Lesson 4

Define Variables

 

OBJECTIVE:

In this lesson, you will use ActionScript to create interactive text and number variables.

Sample Solution

Lesson:  Create an input text box

  1. Open fl9_4.fla from the Flash – Chapter 9 folder on the server, then save it as 'math' to your Flash C9 folder in your server folder
  2. Drag the playhead through the timeline—this movie has two screens, an introduction that allows you to type in a name, and a screen to enter numbers and perform calculations
  3. Click frame 1 on the background layer, then click the Text tool on the Tools panel
  4. Display the Properties panel, then make the following changes:
    Family:  Arial
    Style:  Bold
    Size:  18
    Color:   #990000
  5. Click the Text type list arrow in the Properties panel, click Input Text, click the show border around text button to turn it on, then verify the Behavior is set to single line
  6. Draw a text box in the center
    [TIP:  Use the pointer to move the box—use the handles to resize the box]
  7. Verify the input text box is selected on the Stage, display the OPTIONS area on the Properties panel, click the Variable text box, type 'myname', press Enter
  8. Test the movie—a white input text box appears—a white input text box appears
  9. Close the Flash Player window

Summary:  You created an input text box in which users can type their name.  You also specified the formatting for the input text.

 

Lesson:  Create a dynamic text box

  1. Click the Selection tool on the Tools panel, then click frame 5 on the background layer
  2. Click the Pasteboard to deselect the objects
  3. Click the Text tool on the Tools panel, click the white area next to the character, then draw a text box in the white area of the Stage to the right of the cartoon character
  4. Click the Selection tool (on the Tools panel), then verify the text box is selected
  5. Display the Properties panel
  6. Click the Text type list arrow, click Dynamic Text, display the OPTIONS area of the Properties panel, click the Variable text box, type 'mywelcome', then press Enter

Summary:  You created a dynamic text box to hold the name the user enters.

 

Lesson:  Use ActionScript to collect and modify string variables

  1. Click frame 1 on the buttons layer, then click the Enter button on the Stage
  2. Display the Actions panel, then verify that the enter button symbol and name are displayed in the lower left of the Script pane
  3. Turn off Script Assist
  4. In the Script pane, click at the end of Line 2 after the semicolon, press Enter to create a new blank line after Line 2 but before the closing curly bracket, then type the following line of ActionScript:
    mywelcome = ”Hello, ”+myname;
    When the user clicks the Enter button, this ActionScript takes the name the user has entered in the myname input field, prefaces it with the work “Hello”, then places the text string in the mywelcome dynamic text box
    Your script should look as follows:
    on (release) {
         gotoAndPlay("calculator");
         mywelcome = "Hello, "+myname;
    }
  5. Click the Check syntax button in the Script pane, then click OK—if there are errors in the code, check your code and be sure it matches the above instructions
  6. Click the Auto format button in the Script pane
  7. Test the movie, click the name input field, type 'Jesse', then click Enter—the name “Jesse” appears in the dynamic text field, prefaced by “Hello”
  8. Close the Flash Player window, then close the Actions panel

Summary:  You used ActionScript to modify a text variable and place it in a dynamic text box.

 

Lesson:  Use ActionScript to collect and perform a mathematical operation on a numeric variable

  1. Click frame 5 on the Timeline to display the second screen--this screen already contains two input text boxes (First Number and Second Number) and a dynamic text box (Total)
  2. Verify the Selection tool on the Tools panel is selected, click the subtraction button, then display the Actions panel
  3. Verify that the minus_button symbol and name are displayed in the lower left of the Script pane, then type the three lines of ActionScript in the Script pane as follows:
    on (release) {
         myTotal=firstNumber-secondNumber;
    }

    When the user clicks the subtraction button, this ActionScript subtracts the number the user has typed in the secondNumber input field from the number in the firstNumber input field, then places the result in the myTotal dynamic text field
  4. Check the syntax and auto format the code
  5. Test the movie, type 'Jesse', click the Enter button, type 20 in the First Number box, type 10 in the Second Number box, click the subtraction button
  6. Close the Flash Player window

Summary:  You used ActionScript to create a mathematical operation that works with variables.

 

Lesson:  Copying ActionScript code

  1. Right-click the ActionScript code in the Script pane, then click Select All
  2. Right-click the ActionScript code in the Script pane, then click Copy
  3. Click the multiplication button on the Stage, verify the multiplication button symbol and name are displayed at the lower left of the Script pane, right-click in the Script pane, then click Paste
  4. Double-click the minus sign between firstNumber and secondNumber, type * (an asterisk)
    Compare your script to the following:
    on (release) {
         my Total = firstNumber*secondNumber;
    }
  5. Click the division button on the Stage, verify the division button symbol and name are displayed at the lower left of the Script pane, click in the Script pane, right-click, then click Paste
  6. Double-click the minus sign, then type '/' (forward slash)--the forward slash is the division operator
  7. Test the movie, type 'Jesse', click the Enter button, then experiment with entering numbers in the input boxes and clicking the subtraction, multiplication, and division buttons
  8. Close the Flash Player window

Summary:  You copied ActionScript code from one object to another and made a change in the code.

 

Lesson:  Use the Number function to create an addition operation for numeric variables

  1. Click the addition button on the Stage, then display the Actions panel
  2. Verify the plus_button button symbol and names are displayed in the lower left of the Script pane
  3. Click in the script pane, right-click, then click Paste
  4. Edit the second line of the ActionScript to the following:
    myTotal=number(firstNumber)+number(secondNumber);
  5. Test the movie, type 'Jesse', click the Enter button, then experiment with typing numbers in the input boxes and clicking the plus sign
  6. Close the Flash Player window, save your work, then close the file
  7. Exit Flash

Summary:  You used the Number function to create an addition operation in ActionScript.