flex学习进度3

<?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" width="937" height="568">
	<fx:Style source="FlexGrocer.css"/>
	<fx:Script>
		<![CDATA[
			import flash.utils.describeType;
		]]>
	</fx:Script>
	<s:states>
		<s:State name="State1"/>
		<s:State name="cartView"/>
		<s:State name="expanded"/>
	</s:states>
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
		<!--数据结构mvc-->
		<fx:Model id="grocerDataFramework">
			<groceries>
				<description>牛奶是最古老的天然饮料之一，被誉为“白色血液”，对人体的重要性可想而知。
					牛奶顾名思义是从雌性奶牛身上所挤出来的。在不同国家，牛奶也分有不同的等级。
				目前最普遍的是全脂、低脂及脱脂牛奶。目前市面上牛奶的添加物也相当多，如高钙低脂牛奶，
				其中就增添了钙质。

				</description>
				</groceries>
		</fx:Model>
	</fx:Declarations>
	
	<s:controlBarLayout>
		<s:BasicLayout/>
	</s:controlBarLayout>
	
	<s:controlBarContent>
		<s:Button y="10" label="Checkout" id="btnCheckout" right="10"/>
		<s:Button y="10" label="View Cart" id="btnCartView" right="90"/>
		<s:Button label="Flex Grocer" x="5" y="5" skinClass.expanded="spark.skins.spark.ButtonSkin"/>
	</s:controlBarContent>
	<s:Label y="464" text="(c) 2009, FlexGrocer" right="10"/>
	<s:Group x="0" y="0" width="100%" height="100%" id="bodyGroup">
		<s:layout>
			<s:HorizontalLayout/>
		</s:layout>
		<s:Group width="100%" height="150" id="products" width.cartView="0" height.cartView="0" visible.cartView="false" width.expanded="84">
			<s:layout>
				<s:VerticalLayout/>
			</s:layout>
			<s:Label text="Milk" id="prodName"/>
			<!--@Embed('')jpg嵌入到swf技术有两大好处，1.程序开始就已经加载。2，离线也一样有图，但会增加swf文件的大小-->
			<mx:Image includeIn="State1,expanded" source="@Embed('../assets/test3.jpg')" width="99" height="99" scaleContent="true" mouseOver="this.currentState='expanded'" mouseOut="this.currentState='State1'"/>
			<s:Label text="$1.99" id="price"/>
			<s:Button label="AddToCart" id="add"/>
		</s:Group>
		<s:Group includeIn="expanded" width="100%" height="150" color="#C79A9A">
			<s:Label x="8" y="35" text="{grocerDataFramework.description}" height="115" width="245" id="expandedPro" color="#178CA1" fontFamily="细明体" backgroundColor="#6C2727" paddingRight="1" paddingLeft="1" paddingTop="1" paddingBottom="1"/>
			<s:RichText x="88" y="11" text="奶牛" backgroundColor="#B16565" color="#DDB1B1" fontSize="24"/>
		</s:Group>
		<s:Group height="100%" id="cartGroup" width.cartView="100%">
			<s:layout>
				<s:VerticalLayout>
				</s:VerticalLayout>
			</s:layout>
			<s:Label text="总价格为："/>
			<s:Button label="view cart" click="this.currentState='cartView'" includeIn="State1,expanded"/>
			<mx:DataGrid includeIn="cartView" id="dgCart">
				<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" click="this.currentState=''"/>
		</s:Group>
	</s:Group>

</s:Application>