Input, Process and Output - 02textIO.fla

This program demonstrates

• Input -
      some text typed by the user.
      button press to trigger the processing
• Process - joining text strings together.
• Output - text output to the screen.

It makes use of

• an initialisation script
• static text for output
• input text
• button release event handling
• dynamic text for output

Start up Macromedia Flash

1. Start a new Flash document.
2. Set the background colour.
3. Set the size of the stage to 250 x 160.
4. Save this document as 02textIO.fla

Add a Static Text title to the stage.

5. Select the text tool and drag out a rectangle where you can enter some text onto the stage.
   The text should read "What is your name?".
6. Select the arrow tool and drag the text to the right position on the stage.
7. Make sure the text is static.

Add an Input Text control to your stage.

8. Select the text tool and drag out a rectangle where you can enter some text onto the stage.
9. Set the text to Input Text
10. Select the arrow tool and drag the text to the right position on the stage.
11. Set the Instance Name of the text to "inputText"
12. Toggle the text border on.

Add a push button to the stage.

CTRL+F7 toggles the Components frame on or off.

13. Double click here to add the push button
14. Select the arrow tool and drag the button to the correct position.
15. Make sure the Parameters pane is selected.
16. Alter the button label to "Submit".

Add a Dynamic Text area for the program output.

17. Select the text tool and drag out an area for the output text.
18. (a) Make sure the text is Dynamic and
    (b) give it an instance name of outputText.
19. Select the arrow tool and drag the output text to the correct position.
20. Toggle the text border off.

It is good coding practice to initialise your data properly. Write some ActionScript code to initialise the Input Text to read "Who are you?".

21. Click on Layer 1 - Frame 1.
22. Click Actions to open this view.
23. You can turn line numbers on or off here.
24. Enter this code
    
    _root.inputText.text = "Enter your name here. ";

25. Use CTRL+Enter to do a test run.

Create the event handler to process the button release.

26. Click the Submit Button and make sure it is selected (and nothing else is selected).
27. Click Actions to open this view.
28. Enter your code here ...
    
    on (release)
    {
        _root.outputText.text = "Hello " + _root.inputText.text;
    }
    
29. Remember to save your work.

Do a test run with CTRL+Enter. The program should now work.

Here is the finished movie/program.

You can download the source code.

Your learning task

Write your own version of this program.

Add to it to ask "where do you live?". Assuming your name is Fred and you live in Norwich, the program should produce output like this ...

"Hello Fred from Norwich."