cover
Flash Games Studio

cover
Flash Math Creativity


more

3 a.m. Tips
Simply Flashing

Christopher B. Contois

 

 

Home   |   PowerPoint   |   Flash   |  Links   |   About   |   Contact

Simply Flashing

Christopher B. Contois
2cinteractive.com


Tutorial- Input Text Field

Download .fla - 30k

Objective:
To demonstrate a user controlled input field.

Concept:
By utilizing the set properties command with a variable text field, the user will be able to control the width of a box.

This project will specifically control the width of the greenBox. The key is the text field that is created. It has been changed to an input box via the Paragraph panel's "Text Option" section. Additionally it has been assigned the variable name "size" and the only numbers button has been selected.

Instructions:
Begin by creating a new Movie Clip ("Insert-Symbol" or "Ctrl+F8"). Make sure you check the Movie Clip. In my case I plan on creating a green box with the name "mc_greenBox".

Draw an object on the screen. Place it in frame 1 and name your layer. Also, although it is not needed for this file it is recommended that you add an "Actions" layer and place a "stop" in frame 1.

To do this open your actions window (ctrl+alt+A). Scroll through your "Basic Actions" and double click "Stop" . In the window on the right you should see: stop ();

Go back to "Scene 1" (upper-left corner of the screen) and then go to the Instance Panel (Window -Panels- Instance (ctrl+I))

From your library drag you new movie clip onto the timeline. Name this layer.

Create a new layer (insert-layer) and name it "Actions".

Add a stop in Frame 1.

Create a new layer for your text field and give it a name (i.e. inputField). Use the text tool and draw a small text field.

On the "Text Options" Panel (Window-Panels-Text Options) change "Static Text to "Input Text". Also Type a name in for the variable (i.e. size). This variable is what will be utilized to control the boxes width. Under the embed fonts

select the "1,2,3" tab- this will allow only numbers to be inputted into the field - you have now created a variable text field.

Create one more layer and add a button to activate the end-user's input (Ctrl+F8). Open the "Actions" window (Ctrl+Alt+A). Add the following script to the button (pink text does not effect the script, the are comments):

// on release of the mouse button
// or press of the enter key

on (release, keyPress "") {
     // the number from the size field and
     // apply it to the property of "greenBox"

      setProperty ("greenBox", _width, size);
// terminate the command -like a period
}

Once complet your layers should look like:

All that is left is to test your movie (shift+enter). Type a number in the field, click on your button and watch the width adjust.

Final Note:
If you click on the setProperty command in your script in Flash you will see there are several things provided in the drop down at the bottom that will currently say "width", such as height, alpha, and more. The purpose of any file is to teach something new- however if you truly understand it you will be able to get much more benefit. If you have any questions please email me at any time.

Quick Ref:
1. Create a Movie Clip
2. Go to the give your movie clip a name
(i.e. greenBox)
3. Top layer of .fla - Create "Actions" layer (recommended for all files)
4. Actions' layer, frame 1 place a stop command
5. Using the text tool draw a text field
6. On the "Text Option's" panel change the drop down from "Static Text" to "Input Text"
7. Type a name in for the variable (i.e. size)
8. Under the embed fonts select the 1,2,3 tab- this will allow only numbers to be inputed into the field - you have now created a variable text field
9. Create a button
10. Place this script onto the button
// on release of the mouse button
// or press of the enter key

on (release, keyPress "") {
     // the number from the size field and
     // apply it to the property of "greenBox"

      setProperty ("greenBox", _width, size);
// terminate the command -like a period
}
11. Test movie and have fun

-Christopher
email: ccontois@2cinteractive.com
url: www.2cinteractive.com


  Search
   
powered by FreeFind  
Copyright 2002. All Rights Reserved.

PowerPoint
ellenfinkelstein.com

bitbetter.com
presentations.com
microsoft.com
more

Flash
flashkit.com
actionscripts.org

flashguru.co.uk
flashplanet.com
more