2.8.动态填充菜单
2.8.1. 问题
动态的来填充和修改一个菜单栏。
2.8.2. 解决办法
使用ActionScript 为MenuBar 控件的dataProvider 属性分配一个Collection 对象（例如ArrayCollection 或者XMLListCollection）。
2.8.3. 讨论
Flex3 中的MenuBar 控件支持运行时菜单栏动态创建。本节会创建一个带有MenuBar 控件的程序，在程序初始化的时候使用一个ArrayCollection 来填充这个控件。
如上代码使用了绑定机制来绑定menu_db 这个ArrayCollection 对象到MenuBar 组件的dataProvider 属性。在Application 的creationComplete 事件发出的时候，menu_dp 会被初始化并且填充菜单栏。和flex 中其他的数据驱动组件一样，使用Collection 对象（例如ArrayCollection 或者XMLListCollection）可以确保数据的任意变化都会触发控件相因的更新显示。
Collection 类提供了从菜单中编辑，添加以及删除项目的建议方法。做个示范，下面的例子在MenuBar 下面添加了简单的Form 控件，允许你通过ArrayCollection 中项的索引，来编辑相应菜单的项。
这是一个基础的表单，使用了输入控件允许你来指定数组的索引来获取指定的菜单项。在menuIdx 输入框输入0 然后在subMenuIdx 输入框留空就会得到顶层File 菜单。在menuIdx
输入框和subMenuIdx 输入框都输入0 会返回New 子菜单项。
当用户点击了Edit 按钮，editMenu 方法会被调用，指定的索引来获取菜单项的索引并且修改它的显示文字。如下所示：
editMenu 方法的代码会见识menuIdx 和subMenuIdx 的输入值，来获取他们指定的菜单项，并且使用label_ti 的值来更新获取到的菜单项的显示文本。需要注意的是编辑菜单显示的运作顺序，dataProvider 和MenuBar 联合以后，可以再修改数据之后，通过ArrayCollection 的itemUpdated 方法来做显示更新的请求。特别是和此例一样的嵌套数据使用的时候，呼叫itemUpdated 方法来请求显示内容更新是非常重要的。不然的话，数据会修改但是显示可能还是显示旧的数据。例子里面使用了一个try..catch 块劳作一个基础的错误处理。
动态的来填充和修改一个菜单栏。
2.8.2. 解决办法
使用ActionScript 为MenuBar 控件的dataProvider 属性分配一个Collection 对象（例如ArrayCollection 或者XMLListCollection）。
2.8.3. 讨论
Flex3 中的MenuBar 控件支持运行时菜单栏动态创建。本节会创建一个带有MenuBar 控件的程序，在程序初始化的时候使用一个ArrayCollection 来填充这个控件。
+展开
-XML
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
creationComplete="initApp(event)">
<mx:MenuBar id="menu" dataProvider="{menu_dp}"/>
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.FlexEvent;
[Bindable]
private var menu_dp:ArrayCollection;
private function initApp(evt:FlexEvent):void {
var temp:Array = new Array();
var subNodes:ArrayCollection = new ArrayCollection([
{label:"New"},{label:"Open"},
{label:"Close",enabled:false}]);
temp.push({label:"File",children:subNodes});
temp.push({label:"Edit"});
temp.push({label:"Source"});
subNodes = new ArrayCollection( [
{label:"50%", type:"radio", groupName:"one"},
{label:"100%", type:"radio",
groupName:"one",selected:true},
{label:"150%",type:"radio",groupName:"one"}]);
temp.push({label:"View",children:subNodes});
menu_dp = new ArrayCollection(temp);
}
]]>
</mx:Script>
</mx:Application>
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
creationComplete="initApp(event)">
<mx:MenuBar id="menu" dataProvider="{menu_dp}"/>
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.FlexEvent;
[Bindable]
private var menu_dp:ArrayCollection;
private function initApp(evt:FlexEvent):void {
var temp:Array = new Array();
var subNodes:ArrayCollection = new ArrayCollection([
{label:"New"},{label:"Open"},
{label:"Close",enabled:false}]);
temp.push({label:"File",children:subNodes});
temp.push({label:"Edit"});
temp.push({label:"Source"});
subNodes = new ArrayCollection( [
{label:"50%", type:"radio", groupName:"one"},
{label:"100%", type:"radio",
groupName:"one",selected:true},
{label:"150%",type:"radio",groupName:"one"}]);
temp.push({label:"View",children:subNodes});
menu_dp = new ArrayCollection(temp);
}
]]>
</mx:Script>
</mx:Application>
如上代码使用了绑定机制来绑定menu_db 这个ArrayCollection 对象到MenuBar 组件的dataProvider 属性。在Application 的creationComplete 事件发出的时候，menu_dp 会被初始化并且填充菜单栏。和flex 中其他的数据驱动组件一样，使用Collection 对象（例如ArrayCollection 或者XMLListCollection）可以确保数据的任意变化都会触发控件相因的更新显示。
Collection 类提供了从菜单中编辑，添加以及删除项目的建议方法。做个示范，下面的例子在MenuBar 下面添加了简单的Form 控件，允许你通过ArrayCollection 中项的索引，来编辑相应菜单的项。
+展开
-XML
<mx:Form>
<mx:FormHeading label="Menu Editor"/>
<mx:FormItem label="Menu Index">
<mx:TextInput id="menuIdx" restrict="0-9" text="0"
width="20"/>
</mx:FormItem>
<mx:FormItem label="Sub-Menu Index">
<mx:TextInput id="subMenuIdx" restrict="0-9"
width="20"/>
</mx:FormItem>
<mx:FormItem label="Menu Label">
<mx:TextInput id="label_ti"/>
</mx:FormItem>
<mx:FormItem>
<mx:Button label="Edit" click="editMenu()"/>
</mx:FormItem>
</mx:Form>
<mx:FormHeading label="Menu Editor"/>
<mx:FormItem label="Menu Index">
<mx:TextInput id="menuIdx" restrict="0-9" text="0"
width="20"/>
</mx:FormItem>
<mx:FormItem label="Sub-Menu Index">
<mx:TextInput id="subMenuIdx" restrict="0-9"
width="20"/>
</mx:FormItem>
<mx:FormItem label="Menu Label">
<mx:TextInput id="label_ti"/>
</mx:FormItem>
<mx:FormItem>
<mx:Button label="Edit" click="editMenu()"/>
</mx:FormItem>
</mx:Form>
这是一个基础的表单，使用了输入控件允许你来指定数组的索引来获取指定的菜单项。在menuIdx 输入框输入0 然后在subMenuIdx 输入框留空就会得到顶层File 菜单。在menuIdx
输入框和subMenuIdx 输入框都输入0 会返回New 子菜单项。
当用户点击了Edit 按钮，editMenu 方法会被调用，指定的索引来获取菜单项的索引并且修改它的显示文字。如下所示：
+展开
-ActionScript
private function editMenu():void {
var itemToEdit:Object;
try {
itemToEdit = menu_dp.getItemAt(int(menuIdx.text));
if(subMenuIdx.text) {
itemToEdit =
itemToEdit.children.getItemAt(int(subMenuIdx.text));
}i
temToEdit.label = label_ti.text;
menu_dp.itemUpdated(itemToEdit);
}c
catch(ex:Error){
trace("could not retrieve menu item");
}
}
var itemToEdit:Object;
try {
itemToEdit = menu_dp.getItemAt(int(menuIdx.text));
if(subMenuIdx.text) {
itemToEdit =
itemToEdit.children.getItemAt(int(subMenuIdx.text));
}i
temToEdit.label = label_ti.text;
menu_dp.itemUpdated(itemToEdit);
}c
catch(ex:Error){
trace("could not retrieve menu item");
}
}
editMenu 方法的代码会见识menuIdx 和subMenuIdx 的输入值，来获取他们指定的菜单项，并且使用label_ti 的值来更新获取到的菜单项的显示文本。需要注意的是编辑菜单显示的运作顺序，dataProvider 和MenuBar 联合以后，可以再修改数据之后，通过ArrayCollection 的itemUpdated 方法来做显示更新的请求。特别是和此例一样的嵌套数据使用的时候，呼叫itemUpdated 方法来请求显示内容更新是非常重要的。不然的话，数据会修改但是显示可能还是显示旧的数据。例子里面使用了一个try..catch 块劳作一个基础的错误处理。
加支付宝好友偷能量挖...
