Flex Builder----原汁原味的Flex程序创建工具

最新推荐文章于 2008-08-03 20:39:00 发布

原创最新推荐文章于 2008-08-03 20:39:00 发布 · 1.2k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#flex #webservice #application #image #encoding

本文围绕FLEX编程展开，介绍了FLEX编程参考资料，提及可通过Flex Builder创建多种文件，在其中设计界面简单。还阐述了远程数据源支持多种数据对象，能绑定WS创建本地数据模型，代码与界面可分开。最后说明了在JBOSS中部署Flex程序，给出了FLEX程序示例。

FLEX编程参考 http://livedocs.macromedia.com/flex/1/asdocs/ （英文）

可以通过Flex Builder创建多种类型的文件，我认为FB就是Dreamwaver Flex的定制版本

在FB中设计FLEX程序界面就象DREAWEAVER开发HTML一样简单

远程数据源，支持多种类型的数据对象

绑定WS，并创建本地数据模型

在FB中写类，代码与界面分开，FLEX的程序扩展名为*.as，语法与java/c++很象

使用向导，2步就将数据源与控件属性进行绑定

在JBOSS中部署Flex程序

FLEX程序文件扩展名为.mxml，看名字就知道，他语法与XML有多密切的关系，其实就是拥有很多特殊元素的XML文件

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" verticalGap="0" initialize="initApp()">
<ShoppingCart id="cart" xmlns="*" />
<mx:WebService serviceName="FlexStoreCatalogWS" id="catalogWS">
<mx:operation name="getList" result="selectedItem=catalogWS.getList.result[0]">
<mx:request></mx:request>
</mx:operation>
</mx:WebService>
  <mx:Model id="catalog">
   {catalogWS.getList.result}
  </mx:Model>
<mx:Script source="flexstore_script.as" />
<mx:Style source="flexstore.css" />
<mx:VBox widthFlex="0">
<mx:Label text="Flex Store" styleName="appTitle" />
  <mx:HBox horizontalGap="4" height="548" width="860">
   <mx:Panel title="Product Catalog" id="main" width="484">
   <mx:ViewStack id="bodyStack" changeEffect="Fade">
<local:ThumbnailView xmlns:local="*" id="thumbView" dataObject="{catalog}" change="selectedItem=event.target.selectedItem"/><local:GridView xmlns:local="*" id="gridView" dataObject="{catalog}" change="selectedItem=event.target.selectedItem"/>
</mx:ViewStack>
   <mx:ControlBar height="45" horizontalAlign="right">
   <mx:HBox horizontalGap="0">
   <mx:Image source="@Embed('assets/images/thumb_off.png')" width="23" height="23" mouseDown="changeView('thumb')" />
   <mx:Image source="@Embed('assets/images/list_off.png')" width="23" height="23" mouseDown="changeView('grid')" />
   </mx:HBox>
   </mx:ControlBar>
   </mx:Panel>
   <mx:VBox widthFlex="1">
   <mx:Canvas id="topCanvas" widthFlex="1" vScrollPolicy="off">
     <local:ProductDetail xmlns:local="*" id="productDetail" height="330" width="370" vScrollPolicy="off" dataObject="{selectedItem}" shoppingCart="{cart}"/>
    </mx:Canvas>
    <mx:Canvas id="bottomCanvas" widthFlex="1" vScrollPolicy="off">
<local:CartView xmlns:local="*" id="cartView" height="212" width="370" dataObject="{cart}"/>
</mx:Canvas>
   </mx:VBox>
  </mx:HBox>
</mx:VBox>
</mx:Application>