Flex Skin & Style & ItemRenderer

定义Style的语法

引用

<fx:Style>
    @namespace_declaration
    namespace|Application { style_definition }
</fx:Style>

示例代码：

    <fx:Script>
        <![CDATA[
            [Embed("assets/asterisk_orange.png")]
            protected const ICON:Class;
        ]]>
    </fx:Script>
 
    <fx:Style>
        @namespace s "library://ns.adobe.com/flex/spark";
        @namespace mx "library://ns.adobe.com/flex/mx";
 
        s|Button#btn1 {
            icon: "assets/asterisk_orange.png";
        }
 
        s|Button#btn2 {
            icon: Embed("assets/asterisk_orange.png");
        }
 
        s|Button#btn3 {
            icon: PropertyReference("ICON");
        }
    </fx:Style>
 
    <s:Button id="btn1" label="Spark Button with dynamic icon" />
    <s:Button id="btn2" label="Spark Button with inline embedded icon" />
    <s:Button id="btn3" label="Spark Button with metadata [Embed] icon" />

参考链接：
Using local style definitions
http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-7e8b.html

如何在Skin中访问其对应的host component？
方法1：通过变量hostComponent
示例代码：

	<s:BitmapImage id="icon" horizontalCenter="0" verticalCenter="0"
				   source="{hostComponent.content}"/>

方法2：通过[SkinPart("false")] + 相同ID
示例代码：
Hosted Component:

[SkinPart("false")]
public var bodyGroup:Group;//变量名必须和Skin中的对应组件的ID相同

Skin:

<s:Group id="bodyGroup" width="160" height="160">
	<s:layout>
		<lo:FlowLayout horizontalGap="0" verticalGap="0" padding="0"/>
	</s:layout>
</s:Group>

如何在ItemRenderer里拿到DataProvider分配的数据？
通过data变量。

为什么给Custom ItemRenderer设置的state没有生效。
需要override getCurrentRendererState函数。

override protected function getCurrentRendererState():String
{
   return this.currentState;
}

参考链接：
http://stackoverflow.com/questions/4557168/spark-list-itemrenderer-focus-defaults-the-currentstate