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。。