flex4与flex3的比较(原创)

一、容器布局
1、spark.components.BorderContainer结合spark.components.HGroup和spark.components.VGroup代替mx.containers.HBox和mx.containers.VBox
2、未解决问题，mx.containers.FormItem的属性required设置为true，应用就不渲染问题，并且有警告信息
Description Resource Path Location Type
设计模式: 布置组件时出错。请选择“设计”>“刷新”以刷新设计模式。 Chapter4.mxml /Chapter4/src Unknown Problem
此问题已经解决，可能是flex环境渲染设计视图慢的bug，运行出来的页面里是正常的
3、mx.containers.ViewStack、mx.containers.TabNavigator、mx.containers.Accordion与mx.containers.Panel搭配的导航，改为内部用spark.components.NavigatorContent实现。
4、mx.states.State在flex3中是将容器通过addChild放到内部，如：
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:states>
<mx:State name="contact">
<mx:AddChild position="lastChild">
组件和容器
</mx:AddChild>
<mx:AddChild position="lastChild">
组件和容器
</mx:AddChild>
</mx:State>
<mx:State name="thankYou">
<mx:AddChild position="lastChild">
组件和容器
</mx:AddChild>
</mx:State>
</mx:states>
其它组件、容器
</mx:Application>
第二种方式：
<mx:states>
<mx:State name="State1"/>
<mx:State name="contact"/>
<mx:State name="thankYou"/>
</mx:states>
组件和容器通过includeIn="contact,thankYou"属性绑定到状态
在flex4中
用法与flex3的第二种方法一样
其它值得注意的：
1、flex3：<mx:AddChild relativeTo="{bookForm}" position="lastChild" creationPolicy="all">
<s:FormItem id="isbn" label="ISBN:1590595432"/>
</mx:AddChild>
flex4：<s:FormItem id="isbn" label="ISBN:1590595432" includeIn="bookDetails"/>放在id=bookForm的容器中；
2、 flex3：<mx:SetProperty target="{book}" name="title" value="Book Details"/>即：<mx:SetProperty target="{目标对象}" name="目标对象属性" value="目标对象属性值"/>
flex4：<s:Panel title="XML Book" id="book" title.bookDetails="Book Details">即：：<s:目标对象类型 属性.状态="目标对象属性值">
3、flex3：<mx:RemoveChild target="{bookLink}"/>
flex4：<mx:目标对象类型 id="bookLink" excludeFrom="状态"/>
二、XML解析、处理
1、flex3：可以使用ArrayCollection和E4X格式的XMLList
flex4：XMLList必须转换为XMLListCollection替代了。
2、flex3：可以使用mx：Model或者fx：Model作为datagrid的数据源。
flex4：还没弄清楚，似乎不行。
3、flex3：<mx:DataGrid x="56" y="900" width="950" dataProvider="{bookStock4.lastResult.books.stock}">
<mx:columns>
<mx:DataGridColumn dataField="name" headerText="Book Name"/>
<mx:DataGridColumn dataField="author" headerText="Author Text"/>
<mx:DataGridColumn dataField="description" headerText="Description"/>
<mx:DataGridColumn dataField="publish_date" headerText="Publish Date"/>
</mx:columns>
</mx:DataGrid>
flex4：<s:DataGrid x="56" y="700" width="950" dataProvider="{bookStock4.lastResult.books.stock}">
<s:columns>
<s:ArrayList>
<s:GridColumn dataField="name" headerText="Book Name"/>
<s:GridColumn dataField="author" headerText="Author Text"/>
<s:GridColumn dataField="description" headerText="Description"/>
<s:GridColumn dataField="publish_date" headerText="Publish Date"/>
</s:ArrayList>
</s:columns>
</s:DataGrid>
4、flex3：DateFormatter用来格式化日期
flex4：使用DateTimeFormatter，但具体操作略有不同。
5、flex3：属性itemRenderer和itemEditor可以使用任意的内容，如mx.controls.TextArea
flex4：属性itemRenderer和itemEditor只能放置spark.components.gridClasses.GridItemEditor的实现

延伸阅读