Tag Archives: borderSkin

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 a title background image fill on a Halo Alert control in Flex 4

In a previous example, “Setting a background image fill on a Halo Alert control in Flex 4”, we saw how you could can a repeating background image fill on a Halo Alert control (with default Spark skin) in Flex 4 by setting the borderSkin style.

The following example shows how you can set the title bar background image fill on a Halo Alert control (with default Spark skin) in Flex 4 by setting the borderSkin style.

Full code after the jump.

Continue reading Setting a title background image fill on a Halo Alert control in Flex 4

Setting the corner radius on the Halo Alert control in Flex 4

The following example shows how you can set the corner radius on the Halo TextArea control (with default Spark skin) in Flex 4 by creating a custom skin and setting the radiusX and radiusY properties on the Rect objects (in Flex 3 and earlier this was done by setting the cornerRadius style directly).

Full code after the jump.

Continue reading Setting the corner radius on the Halo Alert 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