Adobe Flex 4 学习使用skin class外观应用程序

引言：
　　今天早上去了公司，打开Gmail，发现又一封来自Adobe的题为“Flash Builder 4:学习使用外观应用程序”的邮件，还是和上次一样发上来和大家共享一下。Adobe的例子ZIP包我都共享在文章中了。

相关介绍：
　　您使用样式和外观自定义应用程序的外观。Flex 4 框架包含两套组件：原来的 MX 组件（可以通过设置样式进行自定义）以及新的 Spark 组件（可通过创建自定义外观进行自定义，这些外观定义组件的外观和布局，然后使用样式将外观与组件关联在一起）。通常使用 MXML 创建 Spark 外观，并使用图形标签绘制图形元素。图形代码可以由程序员编写，或由设计人员使用 Adobe Photoshop CS5、Adobe Illustrator CS5 或 Adobe Fireworks CS5 软件生成。

以下是一个应用程序的代码，它创建并使用一个自定义组件外观：
Main.mxml

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
		xmlns:s="library://ns.adobe.com/flex/spark">
	<s:Label text="Standard Button" x="10" y="11"/>
	<s:Button label="Label" x="122" y="5"/>
	<s:Label text="Skinned Button" x="10" y="40"/>
	<s:Button skinClass="com.adobe.samples.skins.PlusButtonSkin" x="122" y="34"/> 
</s:Application>

PlusButtonSkin.mxml (/com/adobe/samples/skins/)

<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" 
	xmlns:s="library://ns.adobe.com/flex/spark" >
	<fx:Metadata>
		[HostComponent("spark.components.Button")]
	</fx:Metadata>
	<s:states>
		<s:State name="disabled" />
		<s:State name="down" />
		<s:State name="over" />
		<s:State name="up" />
	</s:states>
	<s:Path winding="evenOdd" data="M 2 13 C 2 7 7 2 13 2 C 18 2 23 7 23 13 C 23 18 18 23 13 23 C 7 23 2 18 2 13 Z " >
		<s:fill>
			<s:SolidColor color="#bfb59f" alpha="1"/>
		</s:fill>
		<s:stroke>
			<s:SolidColorStroke color="#403029" weight="3"/>
		</s:stroke>
	</s:Path>
	<s:Path winding="evenOdd" data="M 13 6 L 13 18">
		<s:stroke>
			<s:SolidColorStroke color="#403029" weight="2"/>
		</s:stroke>
	</s:Path>
	<s:Path winding="evenOdd" data="M 7 12 L 19 12">
		<s:stroke>
			<s:SolidColorStroke color="#403029" weight="2"/>
		</s:stroke>
	</s:Path>
</s:Skin>

运行结果：
查看完整例子请下载“skinClass_sample”。详细代码说明请看这里。

来自http://flex4jiaocheng.com/blog/368