Use the TextArea component

A TextArea component can be enabled or disabled in an application. In the disabled state, it cannot receive mouse or keyboard input. When enabled, it follows the same focus, selection, and navigation rules as an ActionScript TextField object. When a TextArea instance has focus, you can control it using the following keys:

For more information about controlling focus, see the FocusManager class in the ActionScript 3.0 Reference for the Adobe Flash Platform and Work with FocusManager .

You can set the following authoring parameters for each TextArea component instance in the Property inspector or the Component inspector: condenseWhite , editable , hortizontalScrollPolicy , maxChars , restrict , text , verticalScrollPolicy , and wordwrap . Each of these parameters has a corresponding ActionScript property of the same name. For information on the possible values for these parameters, see the TextArea class in the ActionScript 3.0 Reference for the Adobe Flash Platform .

A live preview of each TextArea instance reflects changes made to parameters in the Property inspector or Component inspector during authoring. If a scroll bar is needed, it appears in the live preview, but it does not function. Text is not selectable in the live preview, and you cannot enter text in the component instance on the Stage.

You can write ActionScript to control these and additional options for the TextArea component using its properties, methods, and events. For more information, see the TextArea class in the ActionScript 3.0 Reference for the Adobe Flash Platform .

The following procedure explains how to add a TextArea component to an application while authoring. The example sets up a focusOut event handler on the TextArea instance that verifies that the user typed something in the text area before giving focus to a different part of the interface.

1. Create a new Flash document (ActionScript 3.0).

2. Drag a TextArea component from the Components panel to the Stage and give it an instance name of aTa . Leave its parameters set to the default settings.

3. Drag a second TextArea component from the Components panel to the Stage, place it below the first one and give it an instance name of bTa . Leave its parameters set to the default settings.

4. Open the Actions panel, select Frame 1 in the main Timeline, and enter the following ActionScript code:

   import flash.events.FocusEvent; 
    
   aTa.restrict = "a-z,'\" \""; 
   aTa.addEventListener(Event.CHANGE,changeHandler); 
   aTa.addEventListener(FocusEvent.KEY_FOCUS_CHANGE, k_m_fHandler); 
   aTa.addEventListener(FocusEvent.MOUSE_FOCUS_CHANGE, k_m_fHandler); 
    
   function changeHandler(ch_evt:Event):void { 
       bTa.text = aTa.text; 
   } 
   function k_m_fHandler(kmf_event:FocusEvent):void { 
       kmf_event.preventDefault(); 
   }

   This example restricts the characters you can enter into the aTa text area to lowercase characters, the comma, the apostrophe, and spaces. It also sets up event handlers for the change , KEY_FOCUS_CHANGE , and MOUSE_FOCUS_CHANGE events on the aTa text area. The changeHandler() function causes the text that you enter in the aTa text area to automatically appear in the bTa text area by assigning aTa.text to bTa.text on each change event. The k_m_fHandler() function for the KEY_FOCUS_CHANGE and MOUSE_FOCUS_CHANGE events prevents you from pressing the Tab key to move to the next field without entering any text. It does this by preventing the default behavior.

5. Select Control > Test Movie.

   If you press the Tab key to move focus to the second text area without entering any text, you should see an error message and focus should return to the first text area. As you enter text in the first text area, you will see it duplicated in the second text area.