Category Archives: TextArea

Creating a semi-transparent scroll bar thumb on an MX TextArea control in Flex 4

In previous examples, “Creating a custom scroll bar track skin on an MX TextArea control in Flex 4” and “Creating a custom scroll bar thumb skin on an MX TextArea control in Flex 4”, we saw how we could create a custom scroll bar track and thumb skin on an MX TextArea control in Flex 4 by setting the trackSkin, thumbSkin, verticalScrollBarStyleName, and horizontalScrollBarStyleName styles.

The following example shows how you can create a semi-transparent scroll bar thumb skin on an MX TextArea control in Flex 4 by setting the alpha property on the scroll bar thumb skin part’s fill.

Continue reading Creating a semi-transparent scroll bar thumb on an MX TextArea control in Flex 4

Creating a custom scroll bar thumb skin on an MX TextArea control in Flex 4

In a previous example, “Creating a custom scroll bar track skin on an MX TextArea control in Flex 4”, we saw how you can create a custom scroll bar track skin on an MX TextArea control in Flex 4 by setting the trackSkin, verticalScrollBarStyleName, and horizontalScrollBarStyleName and styles.

The following example shows how you can create a custom scroll bar thumn skin on an MX TextArea control in Flex 4 by setting the thumbSkin, verticalScrollBarStyleName, and horizontalScrollBarStyleName and styles.

Continue reading Creating a custom scroll bar thumb skin on an MX TextArea control in Flex 4

Setting a gradient background fill on a Halo TextArea control in Flex 4

In a previous example, “Setting the background fill color on a Halo TextArea control in Flex 4”, we saw how you could set the background fill color on the Halo TextArea control (with default Spark skin) in Flex 4 by setting the contentBackgroundColor style.

The following example shows how you can create a linear gradient background on a Halo/MX TextArea control in Flex 4 by creating a custom border skin with a LinearGradient fill and setting the borderSkin style.

Full code after the jump.

Continue reading Setting a gradient background fill on a Halo TextArea control in Flex 4

Setting the background fill color on a Halo TextArea control in Flex 4

The following example shows how you can set the background fill color on the Halo TextArea control (with default Spark skin) in Flex 4 by setting the contentBackgroundColor style (in Flex 3 and earlier this was done by setting the backgroundColor style).

Full code after the jump.

Continue reading Setting the background fill color on a Halo TextArea control in Flex 4

Changing the base theme color on the MX TextArea control in Flex 4

The following example shows how you can change the base/theme color on the MX TextArea control (with default Spark skin) in Flex 4 by setting the chromeColor style. Setting the chromeColor style sets both the TextArea control’s border color and horizontal/vertical scroll bar’s track/thumb colors.

Continue reading Changing the base theme color on the MX TextArea control in Flex 4

Changing the background alpha on the Halo TextArea control in Flex 4

The following example shows how you can set the background alpha on the Halo TextArea control’s Spark skin in Flex 4 by setting the borderSkin style. As you may have noticed, the Halo components have new “Spark” themed skins in Flex 4 (basically so you can use Halo+Spark components in the same Flex project and have a consistent look-and-feel). You may also have noticed that several styles on the Halo controls don’t appear to work any more when using the Spark skins. For example, if you want to change the background fill alpha on the Halo TextArea control in Flex 4, you can no longer set the backgroundAlpha style, you’ll now need to create a custom skin and set the borderSkin style.

The various Halo component’s new Spark skins can be found in your Flex 4 SDK installation in the following location: <Flex SDK>\frameworks\projects\sparkskins\src\mx\skins\spark\…

If you want to set the border skin on the Halo TextArea control, you’ll need to copy the TextInputBorderSkin.mxml file.

Full code after the jump.

Continue reading Changing the background alpha on the Halo TextArea control in Flex 4

Using tab stops with the TextArea control in Flex

The following example shows how you can set tab stops on the Flex TextArea control by setting the tabStops property on a TextFormat object and setting the defaultTextFormat property or setTextFormat() method, or by setting the TextArea control’s htmlText property to an HTML string with a <TextFormat> tag.

Full code after the jump.

Continue reading Using tab stops with the TextArea control in Flex