先看效果图：
其中Test.mxml为：
复制代码 代码如下:
?xml version="1.0" encoding="utf-8"?>
s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
fx:Declarations>
!-- 将非可视元素（例如服务、值对象）放在此处 -->
/fx:Declarations>
mx:HBox horizontalCenter="0" verticalCenter="1">
s:Button id="rightButton" skinClass="components.RightButtonSkin" />
s:Button id="cancelButton" skinClass="components.CancelButtonSkin" />
s:Button id="newStyleButton" skinClass="components.NewStyleButtonSkin"/>
s:Button id="StyleButton" skinClass="components.StyleButtonSkin"/>
/mx:HBox>
/s:Application>
RightButtonSkin.mxml(确定按钮皮肤)：
复制代码 代码如下:
?xml version="1.0" encoding="utf-8"?>
s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" alpha.disabled=".5">
!-- states -->
s:states>
s:State name="up" />
s:State name="over" />
s:State name="down" />
s:State name="disabled" />
/s:states>
!-- border and fill -->
s:Rect id="rect" radiusX="4" radiusY="4" top="0" right="0"
bottom="0" left="0">
s:fill>
s:SolidColor color="0xFAFAFA" color.over="0xEEEEEE"
color.down="0xEEEEEE"/>
/s:fill>
s:stroke>
s:SolidColorStroke color="0xCCCCCC" weight="1"/>
/s:stroke>
/s:Rect>
!-- highlight on top -->
s:Rect radiusX="4" radiusY="4" top="2" right="2" left="2"
height="50%">
s:fill>
s:LinearGradient rotation="90">
s:GradientEntry color="0xFFFFFF" alpha=".5"/>
s:GradientEntry color="0xFFFFFF" alpha=".1"/>
/s:LinearGradient>
/s:fill>
/s:Rect>
s:Label text="确定" color="0x131313"
textAlign="center"
fontFamily="宋体"
verticalAlign="middle"
horizontalCenter="0" verticalCenter="1"
left="30" right="30" top="8" bottom="8"
/>
/s:Skin>
NewStyleButtonSkin.mxml(新建按钮皮肤)：
ps：新建按钮上面那个icon是画上去的
复制代码 代码如下:
?xml version="1.0" encoding="utf-8"?>
s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" alpha.disabled=".5">
!-- states -->
s:states>
s:State name="up" />
s:State name="over" />
s:State name="down" />
s:State name="disabled" />
/s:states>
!-- border and fill -->
s:Rect id="rect" radiusX="4" radiusY="4" top="0" right="0"
bottom="0" left="0">
s:fill>
s:SolidColor color="0xFAFAFA" color.over="0xEEEEEE" color.down="0xEEEEEE"/>
/s:fill>
s:stroke>
s:SolidColorStroke color="0xCCCCCC" weight="1"/>
/s:stroke>
/s:Rect>
!-- highlight on top -->
s:Rect radiusX="4" radiusY="4" top="2" right="2" left="2"
height="50%">
s:fill>
s:LinearGradient rotation="90">
s:GradientEntry color="0xFFFFFF" alpha=".5"/>
s:GradientEntry color="0xFFFFFF" alpha=".1"/>
/s:LinearGradient>
/s:fill>
/s:Rect>
s:Graphic>
s:BitmapImage source="assets/round_plus2.png" left="8" top="6"/>
/s:Graphic>
s:Label text="新建样式" color="0x131313"
fontFamily="宋体"
left="30" right="20" top="8" bottom="8"
/>
/s:Skin>
您可能感兴趣的文章:- C# SkinEngine控件 给窗体添加皮肤的方法
- JQuery UI皮肤定制
- flex中如何用图像给按钮做皮肤
- ASP、PHP与javascript根据时段自动切换CSS皮肤的代码
- flex中使用css样式修改TextArea滚动条的皮肤代码
- jQuery切换网页皮肤并保存到Cookie示例代码
- JQuery给网页更换皮肤的方法
- python实现360皮肤按钮控件示例
- flex动态加载swf皮肤示例代码
- js仿百度切换皮肤功能（html+css）
