集成 Adobe Flex 和 IBM WebSphere Portal

核心提示： 在 VBox 下有一个表单，允许用户添加新的 to-do 项，集成 Adobe Flex 和 IBM WebSphere Portal(5)，此表单包含三个文本字段（Date、Subject 和 Owner）和一个按钮，我们使用一个 <mx:Grid> 组件来控制这个 UI 的对齐（

在 VBox 下有一个表单，允许用户添加新的 to-do 项。此表单包含三个文本字段（Date、Subject 和 Owner）和一个按钮。我们使用一个 <mx:Grid> 组件来控制这个 UI 的对齐（参见清单 4）。

清单 4. 为项目表单添加网格
<mx:Grid>　
　　<mx:GridRow>　
　　　<mx:GridItem>　
　　　　　<mx:Label　text="Date:"/>　
　　　</mx:GridItem>　
　　　<mx:GridItem>　
　　　　　<mx:DateField　id="deadlineDateField"　formatString="YYYY-MM-DD"/>　
　　　</mx:GridItem>　
　　</mx:GridRow>　
　　...　
　　<mx:GridRow>　
　　　<mx:GridItem　colSpan="2"　horizontalAlign="right">　
　　　　　<mx:Button　label="Add"　click="saveNewItem()"/>　
　　　</mx:GridItem>　
　　</mx:GridRow>　
</mx:Grid>　

之后，我们再在 <mx:Script> 标记内用 ActionScript 代码创建客户逻辑并将内容包装成一个 CDATA 结构（参见清单 5）。为了访问不同的数据源，我们定义了一个常量 USE_MOCK_DATA 来控制此应用程序是否可以访问远端数据或本地 mock 数据。现在，我们将常量值设置为 true，这是因为我们此时只需将其显示为一个单独的应用程序。我们在随后的 “在 Flex 内使用 RemoteObject” 一节中将详细介绍如何使用 RemoteObject 服务来访问数据。

清单 5. 添加脚本来调用数据源
<mx:Script>　
　　<![CDATA[　
　　　…　
　　　private　static　const　USE_MOCK_DATA:Boolean　=　true;　…　
　　　private　function　getTodoList():void　
　　　{　
　　　　　if(USE_MOCK_DATA)　{　
　　　　　　//　Creat　the　mock　data　
　　　　　}　
　　　　　else　{　
　　　　　　//　Use　remote　object　to　access　the　back-service　
　　　　　}　
　　　}　
　　　…　
　　]]>　
</mx:Script>