天天看点

Flex3.权威指南.第二讲源代码

1.EComm.mxml

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"

  creationComplete="prodHandler(groceryInventory)"    >

    <mx:Model id="groceryInventory" source="assets/inventory.xml"/>

    <mx:Script>

        <![CDATA[

            import mx.messaging.Producer;

            import valueObjects.ShoppingCart;

            import valueObjects.ShoppingCartItem;

            import valueObjects.Product;

            [Bindable]

            private var theProduct:Product;

            [Bindable]

            public var cart:ShoppingCart=new ShoppingCart();

            private function prodHandler(theItem:Object):void{

                 theProduct=Product.buildProduct(theItem);

                 trace(theProduct);

            }

            private function addToCart(product:Product):void{

                var sci:ShoppingCartItem=new ShoppingCartItem(product);

                cart.addItem(sci);

            }

        ]]>

    </mx:Script>

    <mx:states>

        <mx:State name="cartView">

            <mx:SetProperty target="{products}" name="width" value="0"/>

            <mx:SetProperty target="{products}" name="height" value="0"/>

            <mx:SetProperty target="{cartBox}" name="width" value="100%"/>

            <mx:AddChild relativeTo="{cartBox}" position="lastChild">

                <mx:DataGrid id="dgCart" width="100%">

                    <mx:columns>

                        <mx:DataGridColumn headerText="Column 1" dataField="col1"/>

                        <mx:DataGridColumn headerText="Column 2" dataField="col2"/>

                        <mx:DataGridColumn headerText="Column 3" dataField="col3"/>

                    </mx:columns>

                </mx:DataGrid>

            </mx:AddChild>

            <mx:AddChild relativeTo="{cartBox}" position="lastChild">

                <mx:LinkButton label="Continue Shopping" click="this.currentState=''"/>

            </mx:AddChild>

            <mx:RemoveChild target="{linkbutton1}"/>

        </mx:State>

        <mx:State name="expanded">

              <mx:AddChild>

                  <mx:VBox x="200" width="100%">

                      <mx:Text text="{groceryInventory.description}" width="50%"/>

                      <mx:Label text="Certified Organic" visible="{theProduct.isOrganic}"/>

                      <mx:Label text="Low Fat" visible="{theProduct.isLowFat}"/>

                  </mx:VBox>

              </mx:AddChild>

        </mx:State>

    </mx:states>

    <mx:ApplicationControlBar dock="true" width="100%" height="90">

        <mx:Canvas width="100%" height="100%">

            <mx:Label x="0" y="0" text="Flex"/>

            <mx:Label x="0" y="41" text="GROCER"/>

            <mx:Button label="View Cart" id="btnViewCart" right="90" y="0"/>

            <mx:Button label="Checkout" id="btnCheckout" right="10" y="0"/>

        </mx:Canvas>

    </mx:ApplicationControlBar>

    <mx:Label text="(c) 2006, FlexGrocer" bottom="10" right="10"/>

    <mx:HBox x="0" y="0" width="100%" height="100%" id="bodyBox">

        <mx:VBox width="100%" height="100%" id="products">

            <mx:Label text="Milk" id="prodName"/>

            <mx:Image source="@Embed('assets/dairy_milk.jpg')" scaleContent="true"

             mouseOver="this.currentState='expanded'"

             mouseOut="this.currentState=''"    />

            <mx:Label text="$1.99" id="price"/>

            <mx:Button label="Add To Cart" id="add"

             click="addToCart(theProduct)"    />

        </mx:VBox>

        <mx:VBox height="100%" id="cartBox">

            <mx:Label text="Your Cart Total: $"/>

            <mx:LinkButton label="View Cart" click="this.currentState='cartView'" id="linkbutton1"/>

        </mx:VBox>

    </mx:HBox>

</mx:Application>

2.DataEntry.mxml

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

    layout="absolute">

    <mx:Model id="prodModel">

        <groceries>

            <catName>Dairy</catName>

            <prodName>Milk</prodName>

            <imageName>assets/dairy_milk.jpg</imageName>

            <cost>1.20</cost>

            <listPrice>1.99</listPrice>

            <isOrganic>true</isOrganic>

            <isLowFat>true</isLowFat>

            <description>Direct from California where cows are happiest!</description>

        </groceries>

    </mx:Model>

    <mx:Script>

        <![CDATA[

            import flash.net.FileReferenceList;

            public function fileBrowse():void{

                   var myFileRef:FileReferenceList=new FileReferenceList();

                   myFileRef.browse();

            }

        ]]>

    </mx:Script>

    <mx:Form>

        <mx:FormHeading label="{prodModel.catName}"/>

        <mx:FormItem label="Product Name">

            <mx:TextInput id="product" text="{prodModel.prodName}"/>

        </mx:FormItem>

        <mx:FormItem label="ProductNameUnit" direction="horizontal">

             <mx:ComboBox/>

             <mx:TextInput/>

        </mx:FormItem>

        <mx:FormItem label="Cost">

            <mx:TextInput id="cost" text="{prodModel.cost}"/>

        </mx:FormItem>

            <mx:FormItem label="List Price">

            <mx:TextInput id="listPrice" text="{prodModel.listPrice}"/>

        </mx:FormItem>

            <mx:FormItem label="Description">

            <mx:TextInput id="description" text="{prodModel.description}"/>

        </mx:FormItem>

        <mx:FormItem label="Organic">

            <mx:CheckBox id="isOrganic" selected="{prodModel.isOrganic}"/>

        </mx:FormItem>

        <mx:FormItem label="Is Low Fat">

            <mx:CheckBox id="isLowFat" selected="{prodModel.isLowFat}"/>

        </mx:FormItem>

        <mx:FormItem label="Image Path">

            <mx:TextInput id="imageName" text="{prodModel.imageName}"/>

            <mx:Button label="Browse" click="fileBrowse()"/>

        </mx:FormItem>

        <mx:FormItem>

             <mx:HBox>

                 <mx:Button label="Update"/>

                 <mx:Button label="Delete"/>

             </mx:HBox>

        </mx:FormItem>

    </mx:Form>

</mx:Application>

3.Dashboard.mxml

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal">

    <mx:ApplicationControlBar dock="true">

        <mx:LinkButton label="All"

            click="this.currentState=''"/>

        <mx:LinkButton label="Sales"

            click="this.currentState='fullSales'"/>

        <mx:LinkButton label="Categories"

            click="this.currentState='fullType'"/>

        <mx:LinkButton label="Comparison"

            click="this.currentState='fullComp'"/>

        <mx:Spacer width="100%"/>

        <mx:Label text="Start Date"/>

        <mx:DateField id="startDate"/>

        <mx:Label text="End Date"/>

        <mx:DateField id="endDate"/>

        <mx:RadioButtonGroup id="grossOrNetGroup"/>

        <mx:RadioButton id="gross" groupName="grossOrNetGroup"

            label="Gross Sales" data="GROSS" selected="true"/>

        <mx:RadioButton id="net" groupName="grossOrNetGroup"

            label="Net Sales" data="NET"/>   

    </mx:ApplicationControlBar>

    <mx:states>

        <mx:State name="fullSales">

            <mx:SetProperty target="{rightCharts}"

                name="width" value="0"/>

            <mx:SetProperty target="{rightCharts}"

                name="height" value="0"/>

        </mx:State>

        <mx:State name="fullType">

            <mx:SetProperty target="{sales}"

                name="width"

                value="0"/>

            <mx:SetProperty target="{sales}"

                name="height"

                value="0"/>

            <mx:SetProperty target="{comp}"

                name="width"

                value="0"/>

            <mx:SetProperty target="{comp}"

                name="height"

                value="0"/>

        </mx:State>

        <mx:State name="fullComp">

            <mx:SetProperty target="{sales}"

                name="width"

                value="0"/>

            <mx:SetProperty target="{sales}"

                name="height"

                value="0"/>

            <mx:SetProperty target="{type}"

                name="width"

                value="0"/>

            <mx:SetProperty target="{type}"

                name="height"

                value="0"/>

        </mx:State>

    </mx:states>

    <mx:Panel id="sales"

        width="100%" height="100%"

        title="Sales Chart">

        <mx:ControlBar>

        </mx:ControlBar>

    </mx:Panel>

    <mx:VBox id="rightCharts"

        width="100%" height="100%" >

        <mx:Panel id="type"

            width="100%" height="100%"

            title="Category Chart">

            <mx:ControlBar>

            </mx:ControlBar>

        </mx:Panel>

        <mx:Panel id="comp"

            width="100%" height="100%"

            title="Comparison Chart">

            <mx:ControlBar>

            </mx:ControlBar>

        </mx:Panel>

    </mx:VBox>

</mx:Application>

继续阅读