Entire Site
Free Trial
Safari Books Online is a digital library providing on-demand subscription access to thousands of learning resources.
- Create BookmarkCreate Bookmark
- Create Note or TagCreate Note or Tag
- DownloadDownload
- PrintPrint
Chapter 10. Skinning and Styling > Spark Skins and Halo Components
Spark Skins and Halo Components
Although you are limited in what you can redefine, and more important, rearrange within a Halo component, it doesn’t preclude you from using MXMLG to create your skins. You need to use one of the Halo-specific skin classes SparkSkin or SparkSkinForHalo. SparkSkin is the base skin class for Halo (mx) components, although you should use the SparkSkinForHalo as your root skin tag if your component defines a border because this class implements the ability to alter the border with the errorColor style when validation failure occurs. Here is a simple SparkSkin class for a Halo button component:
Code View:
Scroll
/
Show All
<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Declarations>
<s:AnimateColor id="transitionEffect"
targets="{[fillBG, strokeBG]}" duration="250" />
</fx:Declarations>
<s:states>
<s:State name="up"/>
<s:State name="over"/>
<s:State name="down"/>
<s:State name="disabled"/>
</s:states>
<s:transitions>
<s:Transition fromState="up" toState="over"
effect="{transitionEffect}"/>
<s:Transition fromState="down" toState="over"
effect="{transitionEffect}"/>
<s:Transition fromState="over" toState="up"
effect="{transitionEffect}"/>
<s:Transition fromState="down" toState="up"
effect="{transitionEffect}"/>
</s:transitions>
<s:Rect id="background" radiusX="4" radiusY="4"
width="100%" height="100%">
<s:fill>
<s:SolidColor id="fillBG" color="0x666666"
color.over="0x999999"
color.down="0x888888" />
</s:fill>
<s:stroke>
<s:SolidColorStroke id="strokeBG"
color="0x333333"
color.over="0x666666"
pixelHinting="true"/>
</s:stroke>
</s:Rect>
</s:SparkSkin>
