<?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:Script>
<![CDATA[
]]>
</fx:Script>
<s:states>
<s:State name="State1"/>
<s:State name="cartView"/>
<s:State name="expanded"/>
</s:states>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<s:controlBarLayout>
<s:BasicLayout/>
</s:controlBarLayout>
<s:controlBarContent>
<s:Button y="0" label="CheckOut" id="btnCheckOut" right="20"/>
<s:Button y="0" label="btnViewCart" id="btnViewCart" right="120" click="this.currentState ='cartView'"/>
<s:Button label="Flex Grocery" y="0" left="21"/>
</s:controlBarContent>
<s:Label text="Flex Grocery (c)2009" right="20" bottom="20"/>
<s:HGroup width="100%" height="100%" id="bodyGroup">
<s:VGroup x="0" y="0" width="100%" height="100%" id="products"
width.cartView="0"
height.cartView="0"
visible.cartView="false">
<s:Label text=" Milk" id="prodName" width="52" height="18"
verticalAlign="middle"/>
<mx:Image width="48" height="59" scaleContent="true"
source="@Embed('assets/dairy_milk.jpg')"
mouseOver="this.currentState ='expanded'"
mouseOut ="this.currentState ='State1'"/>
<s:Label text=" $1.99" id="price" width="52" height="18"
verticalAlign="middle"/>
<s:Button label="AddToCart" id="Add" cornerRadius="6"/>
</s:VGroup >
<s:VGroup width="50%" height="100%" paddingLeft="40" rowHeight="40" id="cartGroup"
width.cartView="100%" requestedRowCount.State1="50" requestedRowCount.expanded="50">
<s:Label text=" Your Cart total :$" width="150" height="52"
verticalAlign="middle"/>
<s:Button includeIn="State1,expanded" label="ViewCart" width="126"
cornerRadius="6" enabled="true" click="this.currentState ='cartView'"/>
<mx:DataGrid includeIn="cartView" height="174" width="276">
<mx:columns>
<mx:DataGridColumn headerText="列 1" dataField="col1"/>
<mx:DataGridColumn headerText="列 2" dataField="col2"/>
<mx:DataGridColumn headerText="列 3" dataField="col3"/>
</mx:columns>
</mx:DataGrid>
<s:Button includeIn="cartView" label="Continue shopping ……" width="228" click="this.currentState =''"/>
</s:VGroup>
</s:HGroup>
<s:VGroup x="200" width="387" height="36" includeIn="expanded" >
<s:Label text="Low fat"/>
</s:VGroup>
</s:Application>
<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:Script>
<![CDATA[
]]>
</fx:Script>
<s:states>
<s:State name="State1"/>
<s:State name="cartView"/>
<s:State name="expanded"/>
</s:states>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<s:controlBarLayout>
<s:BasicLayout/>
</s:controlBarLayout>
<s:controlBarContent>
<s:Button y="0" label="CheckOut" id="btnCheckOut" right="20"/>
<s:Button y="0" label="btnViewCart" id="btnViewCart" right="120" click="this.currentState ='cartView'"/>
<s:Button label="Flex Grocery" y="0" left="21"/>
</s:controlBarContent>
<s:Label text="Flex Grocery (c)2009" right="20" bottom="20"/>
<s:HGroup width="100%" height="100%" id="bodyGroup">
<s:VGroup x="0" y="0" width="100%" height="100%" id="products"
width.cartView="0"
height.cartView="0"
visible.cartView="false">
<s:Label text=" Milk" id="prodName" width="52" height="18"
verticalAlign="middle"/>
<mx:Image width="48" height="59" scaleContent="true"
source="@Embed('assets/dairy_milk.jpg')"
mouseOver="this.currentState ='expanded'"
mouseOut ="this.currentState ='State1'"/>
<s:Label text=" $1.99" id="price" width="52" height="18"
verticalAlign="middle"/>
<s:Button label="AddToCart" id="Add" cornerRadius="6"/>
</s:VGroup >
<s:VGroup width="50%" height="100%" paddingLeft="40" rowHeight="40" id="cartGroup"
width.cartView="100%" requestedRowCount.State1="50" requestedRowCount.expanded="50">
<s:Label text=" Your Cart total :$" width="150" height="52"
verticalAlign="middle"/>
<s:Button includeIn="State1,expanded" label="ViewCart" width="126"
cornerRadius="6" enabled="true" click="this.currentState ='cartView'"/>
<mx:DataGrid includeIn="cartView" height="174" width="276">
<mx:columns>
<mx:DataGridColumn headerText="列 1" dataField="col1"/>
<mx:DataGridColumn headerText="列 2" dataField="col2"/>
<mx:DataGridColumn headerText="列 3" dataField="col3"/>
</mx:columns>
</mx:DataGrid>
<s:Button includeIn="cartView" label="Continue shopping ……" width="228" click="this.currentState =''"/>
</s:VGroup>
</s:HGroup>
<s:VGroup x="200" width="387" height="36" includeIn="expanded" >
<s:Label text="Low fat"/>
</s:VGroup>
</s:Application>