Flex 4 的十大变化

<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/halo"><s:Button label="My Flex 4 Button" /><mx:Button label="My Flex 3 Button" /><!-- Given the states A,B,C -->
<m:states>
<m:State name="A"/>
<m:State name="B"/>
<m:State name="C"/>
</m:states>

<!-- This button will appear in only states A and B -->
<Button label="Click Me" includeIn="A, B"/>

<!-- This button will appear in states A and B -->
<Button label="Button C" excludeFrom="C"/><?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" alpha.disabled="0.5">

<fx:Metadata>
<![CDATA[
/**
* @copy spark.skins.default.ApplicationSkin#hostComponent
*/
[HostComponent("spark.components.Panel")]
]]>
</fx:Metadata>

<fx:Script>
/* Define the skin elements that should not be colorized.
For panel, border and title backround are skinned, but the content area and title text are not. */
static private const exclusions:Array = ["background", "titleField", "contentGroup"];

/**
* @copy spark.skins.SparkSkin#colorizeExclusions
*/
override public function get colorizeExclusions():Array {return exclusions;}

/* Define the content fill items that should be colored by the "contentBackgroundColor" style. */
static private const contentFill:Array = ["bgFill"];

/**
* @inheritDoc
*/
override public function get contentItems():Array {return contentFill};
</fx:Script>

<s:states>
<s:State name="normal" />
<s:State name="disabled" />
</s:states>

. . . . .

<s:Rect left="1" right="1" top="31" >
<s:fill>
<s:SolidColor />
</s:fill>
</s:Rect>

<!-- layer 5: text -->
<!-- Defines the appearance of the PanelSkin class's title bar. -->
<s:SimpleText id="titleField" lineBreak="explicit"
left="10" right="4" top="2"
verticalAlign="middle" fontWeight="bold">
</s:SimpleText>

<s:Group id="contentGroup" left="1" right="1" top="32" bottom="1">
</s:Group>

</s:SparkSkin><s:Group >
<s:layout>
<s:HorizontalLayout paddingLeft="5" paddingTop="5" />
</s:layout>

<s:Button label="Button 1" />
<s:Button label="Button 2" />
</s:Group>