Remote Synthesis
Search my blog:
Viewing By Entry / Main
Aug 21, 2008

Maintaining Text Selection Visibility in a Flex TextArea

Here's what appeared to be a simple problem, which in the end had a simple solution though with a long path to find it (thanks to Zoe Bloch for pointing me in the right direction). Basically, I needed my TextArea's to maintain the visibility of the text selection even when a user clicks on something else. Under normal circumstances, the selection remains, but isn't visible unless the TextArea has focus. However, the TextField class has a property called alwaysShowSelection that keeps the selection visible, though greyed out a bit, even when the TextField doesn't have focus. Well, TextArea seems to use a internal TextField to render the text but it doesn't make this property accessible. If you extend TextArea, however, you can access it. Here's how.

First of all, to see the behavior I talking about, view my example here. In it you can select text in myTextArea subclass (which, for lack of creativity, I call SelectionTextArea) as well as in a standard TextArea. After selecting some text, click on the button or the ComboBox and you will notice the text in the standard TextArea doesn't appear selected (though if you tab the focus back you will see it still is) while the selected text in SelectionTextArea remains visibly selected.

All my subclass includes is a call to set the alwaysShowSelection property of the TextArea's internal TextField to true. This is done on CreationComplete because prior to this the TextField variable is null. The full code for the class is below. As you can see, there's not much to it (and if you AS/Flex gurus have improvement suggestions, feel free).

package com
{
import mx.events.FlexEvent;

import mx.controls.TextArea;

public class SelectionTextArea extends TextArea
{
public function SelectionTextArea()
{
super();
addEventListener(FlexEvent.CREATION_COMPLETE,setAlwaysShowSelection);
}

private function setAlwaysShowSelection(event:FlexEvent):void
{
textField.alwaysShowSelection = true;
}
}
}

Comments
tony grimes
As a shortcut to this you can also access the textField property of the textArea class using the getTextField() method. It only works if you include the following in your client class: import mx.core.mx_internal; use namespace mx_internal; then you can use the following shorthand rather than extending textArea myTextArea.getTextField().alwaysShowSelection = true;


atan
ei tnx so much for this. :)


Write your comment



(it will not be displayed)