1.SparkSkin介绍
(1)spark.skins，这个包里面只有一个class：SparkSkin，非美工的程序员可以通过这个class来实现任意自定义控件的样式。
(2)SparkSkin是一个Group类型的容器。（它继承自Group）
(3)全部的mx.spark的可视化控件的外观全部都是SparkSkin的子类
(4)SparkSkin：是全部Spark Class的基础类，也就说全部的mx.spark的可视化控件的外观全部都是SparkSkin的子类。
Skin：是SparkSkin的父类，例如ButtonBarSkin就是Skin的子类，如果想要自定义这部分组件的样式，则需要使用Skin。
综上所述，也就是可以使用SparkSkin的地方，我们使用Skin一样可以达到同样的效果。
2.SparkSkin示例
在Flex SDK 4(Gumbo)中，我们只需要将这个button的样式继承与SparkSkin或者Skin，然后在其中加入一些我想要的内容即可，请看以下的代码：
1 <?xml version="1.0" encoding="utf-8"?>
2 <s:SparkSkin
3 xmlns:s="library://ns.adobe.com/flex/spark"
4 xmlns:fx="http://ns.adobe.com/mxml/2009">
5 <s:states>
6 <s:State name="up"/>
7 <s:State name="over"/>
8 <s:State name="down"/>
9 <s:State name="disabled"/>
10 </s:states>
11 <fx:Metadata>[HostComponent("spark.components.Button")]</fx:Metadata>
12 <s:Ellipse width="100%" height="100%">
13 <s:fill>
14 <s:SolidColor color="0x131313" color.over="#191919" color.down="#ffffff"/>
15 </s:fill>
16 <s:stroke>
17 <s:SolidColorStroke color="0x0c0d0d" />
18 </s:stroke>
19 </s:Ellipse>
20 <s:RichText id="labelElement"
21 fontFamily="Myriad Pro"
22 fontSize="11"
23 color="0xBBBBBB"
24 textAlign="center"
25 horizontalCenter="0"
26 verticalCenter="1"
27 width="100%">
28 </s:RichText>
29 </s:SparkSkin>
我们可以用以下几个方式：
(1) Button {
skinClass: ClassReference("com.rianote.flex.skin.KButton");
}
(2)<Button skinClass="com.rianote.flex.skin.KButton" />
(3)myButton.setStyle( "skinClass", Class( KButton ));
其中skinClass也是Flex SDK 4(Gumbo)里面新增加的一个class，其作用就是设定当前这个组件的Skin。
主程序：
![]()
1 <?xml version='1.0' encoding='UTF-8'?>
2 <s:Application xmlns:s="library://ns.adobe.com/flex/spark"
3 xmlns:fx="http://ns.adobe.com/mxml/2009"
4 height="254" width="576">
5 <fx:Script>
6 <!--[CDATA[
7 import com.rianote.flex.skin.Button;
8 ]]-->
9 </fx:Script>
10 <s:Button x="54" y="56" skinClass="com.rianote.flex.skin.Button" height="32"
11 width="77" label="Button"/>
12 </s:Application>
13