第07单元 菜单实现.pptVIP

第7章 菜单实现 在设计页面时，如果要引入类似桌面应用中常用的系统菜单，可以使用Flex中菜单类控件。菜单类控件共包括以下3种。 菜单控件（Menu Control），如图7.1。菜单控件只能使用ActionScript创建。在响应用户交互事件后弹出该控件。 菜单栏控件（MenuBar Control），如图7.2。菜单栏控件是基于菜单控件的。它在菜单的基础上将多个菜单组织成并列的菜单栏。 弹出式按钮菜单控件（PopUpButtonMenu Control），如图。弹出式按钮菜单控件类似于弹出式按钮控件。单击按钮右边的下拉箭头后，即弹出菜单，选择菜单项后，按钮显示被选项的标签和图标。 7.1 菜单类控件的属性 菜单类控件的属性可以定义菜单项的名称、类型等特征。菜单类控件中的三种控件均使用相同的属性对菜单项进行定义，同时也为菜单项提供不同的选中模式。下面对菜单类项属性和菜单项选中模式进行简要的介绍。 7.1.1 菜单项的属性 菜单类控件中每个控件都包含具体的菜单项的显示，例如菜单项的名称、事件响应类型等。Flex为菜单项提供了多个属性，以满足不同菜单类控件的需求。这些属性都需要在菜单类控件对应的数据中进行定义。控件在读取数据时，根据相应的属性标签进行区别。菜单项属性如表所示。 7.1.2 菜单项的选中模式 在选中菜单项或者进入该菜单项的子菜单时，Flex提供了4种模式。 normal：默认为该模式。当选中菜单项时，触发change事件。当该菜单项有子菜单时，展开子菜单。 check：该模式在菜单项选中是在菜单项旁边显式一个对号标记，与多选框组件中选中标记相同。当选中该菜单项时该菜单项的toggled属性为true，在菜单名的旁边做对号标记， radio：该模式在菜单项选中是在菜单项旁边显式一个圆点标记，与单选框组件中选中标记相同。由多个该radio类型的菜单项组成radio组，每个菜单项称为改组的一个成员。每次同组中只有一个成员可被选中。当选中该菜单项时，该数据项的toggled属性设为true，同时该组的其他成员的toggled属性设为false， separator：表现为分隔符。如果数据项定义为该类型，则数据项的名称等都不会显示，只显示分割符。该模式的数据项只作为数据项之间分割线。 7.2 菜单类控件的数据 在菜单类控件中，菜单总是呈结构化、层次化显示。与菜单控件对应的数据也需要时结构化层次化的，例如数组、XML等。数据的属性也需要在数据中进行定义。菜单类控件支持结构化的数据类型，如XML、Collections等。下面对菜单类控件中常用的数据类型进行介绍。 7.2.1 XML 使用XML作为菜单类控件数据时，可以在MXML中利用mx:XML或者mx:XMLList定义XML；也可在ActionScript中定义XML或者XMLList对象。XML的格式需遵从e4x。下面是利用mx:XML定义的数据。 mx:XML format=e4x id=menuData root menuitem label=菜单1 menuitem label=子菜单1-1 enabled=False/ menuitem label=子菜单1-2/ /menuitem menuitem label=菜单2 type=check toggled=true/ menuitem label=菜单3 type=check toggled=false/ menuitem type=separator/ menuitem label=菜单4 menuitem label=子菜单4-1 type=radio groupName=A/ menuitem label=子菜单4-2 type=radio groupName=A toggled=true/ 7.2.2 Collections Collections可以看作数据的集合，例如array和arrayCollection。下面是一个以array作为数据的例子，效果与上面XML一致。 public var menuData:Array = [ {label: 菜单1, children: [ {label: 菜单1-1, enabled: false