flex 学习笔记 皮肤（二）

在flex4 中最方便的莫过于在创建一个mxml文件型的皮肤? 如下button皮肤：

?

?

 
 

<?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">?????<s:Group?verticalCenter="0"?horizontalCenter="0">????????? ?
  
  

<s:Rect?id="rect"?radiusX="4"?radiusY="4"?top="0"?right="0"?bottom="0"?left="0">??? ?

  
  

?????????<s:fill>??????? ?

  
  

?????????<s:SolidColorcolors:SolidColorcolor="0x77CC22"?/>????????????????? ?

  
  

</s:fill>???????????? ?

  
  

<s:stroke>??????????????? ?

  
  

?<s:SolidColorStroke?color="0x131313"?weight="2"/>???????????? ?

  
  

</s:stroke>????????? ?

  
  

</s:Rect>????????????????? ?

  
  

?<s:Label?text="Button!"?color="0x131313"??????????????????textAlign="center"?verticalAlign="middle"?????????????????horizontalCenter="0"?verticalCenter="1"?????????????????left="12"?right="12"?top="6"?bottom="6"?????????/>?????</s:Group>? ?

  
  

</s:Application>??

 
 

如上程序所示：

????????? ?1? Group ：

????????????????? Spark中基本的没有样式的容器。api中如是说：Group 类是可视元素的容器基类。Group 容器将实现 IUIComponent 接口的任何组件和实现 IGraphicElement 接口的任何组件视为子代。希望管理可视子项（可视组件和图形组件）时，使用此容器。为了改进性能和最小化应用程序大小，不能设置 Group 容器的外观。如果希望应用外观，请改用 SkinnableContainer。

?????????? 2??? Rect???

??????????????????? 一个矩形。

???????????3??? fill

??????????????????? 填充颜色

?????????? 4?? stroke

??????????????????? 边线

???????????5?? label

???????????????????? 文本

总体来说就是：在没有外观的group容器里，用0x131313颜色的stroke画了一个矩形框，里面填充了0x77cc22的颜色，并且放了一个叫Button!的label文本。

从上到下 ，一层层描述绘制 效果如下：

?

当然这只是最简单的应用，学习ING。。