<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
<!--
popup弹出式
Flex framework includes three controls that present hierarchical data in a cascading menu format.
All menu controls can have icons and labels for each menu item,
and dispatch events of the mx.events.MenuEvent class in response to user actions.
You can use the following menu-based controls
flex 包含3个control,每个控制器的子菜单都可以有icon,label,发送事件MenuEvent,响应用户的动作
你可以使用Menu MenuBar PopMenu
-->
<!--
Menu control
A visual menu that can have cascading submenus.
You typically display a menu control in response to some user action, such as clicking a button.
You cannot define a Menu control by using an MXML tag; you must define it, display it, and hide it by using ActionScript
一个menu可以有级联的 子菜单,你现实 a menu 响应用户的某些动作 比如点击一个Button
你不能用mxml 标签(如:<mx:Menu>)这样来定义它,你必须用ActionScript定义它,显示,隐藏
-->
<!--MenuBar control
A horizontal bar of menu items. Each item in the menu bar can have a submenu that displays
when you click the MenuBar item. The MenuBar control is effectively a static (non-pop-up)
menu that displays the top level of the menu as the bar items
一个菜单项的水平Bar ,当你点击这个menuBar中某个item时,在这个MenuBar中的每个item有一个子menu会显示
the MenuBar实际上时一个 静态的Menu (非弹出式)的顶级菜单(实际上是一个顶级菜单)
-->
<!--
PopUpMenuButton control
A subclass of the PopUpButton control that displays a Menu control when you click the secondary button.
The primary button label changes when you select an item from the pop-up menu.
PopUpMenuButton 是PopUpButton的一个字类 (当你点击一个Button)显示一个Menu
当你从一个Pop-up(弹出式)点击一个子项时,这个主要的Button labels会改变?、
-->
<!--Menu MenuBar PopUpMenuButton这些需要数据提供者,所以下边两种方式
Menu items can specify several attributes that determine how the item is displayed and behaves.
Menu items可以指定几个属性来确定这个item的显示和样式 如下array 当 data Provider
如:enabled
groupName:只有对radio有意义,仅对 radio 类型有意义并且是必需的)
用于关联单选组中的单选按钮项目的标识符。如果使用默认数据描述符,
则数据提供程序必须使用 groupNameXML 属性或对象字段来指定此特征。
icon,
label
toggled :指定选择复选项目还是单选项目
type:指定菜单项的类型。有意义的值为 separator、check 或 radio
-->
<!--使用数组当数据提供者
-->
<!--
使用object数组访问一个元素或者标签
To access properties and fields of an object-based menu item, you specify the menu item field name, as follows:
ta1.text = event.item.label
使用xml访问一个元素或者标签
To access attributes of an E4X XML-based menu item, you specify the menu item attribute name in E4X syntax, as follows:
ta1.text = event.item.@label
-->
<mx:Script>
<![CDATA[
import mx.controls.Menu;
// Method to create an Array-based menu.
private function createAndShow():void {
// The third parameter sets the showRoot property to false.
// You must set this property in the createMenu method,
// not later.
var myMenu:Menu = Menu.createMenu(null, menuData, true);
myMenu.show(10, 10);
}
// The Array data provider
[Bindable]
public var menuData:Array = [
{label: "MenuItem A", children: [
{label: "SubMenuItem A-1", enabled: false},
{label: "SubMenuItem A-2", type: "normal"}
]},
{label: "MenuItem B", type: "check", toggled: true},
{label: "MenuItem C", type: "check", toggled: false},
{type: "separator"},
{label: "MenuItem D", children: [
{label: "SubMenuItem D-1", type: "radio",
groupName: "g1"},
{label: "SubMenuItem D-2", type: "radio",
groupName: "g1", toggled: true},
{label: "SubMenuItem D-3", type: "radio",
groupName: "g1"}
]}
];
]]>
</mx:Script>
<!-- Button control to create and open the menu. -->
<mx:Button x="300" y="10"
label="Open Menu"
click="createAndShow();"/>
<!--使用xml对象当数据提供者并且可以指定每个item的icon-->
<mx:Script>
<![CDATA[
// Import the Menu control.
import mx.controls.Menu;
[Bindable]
// [Embed(source="assets/topIcon.jpg")]
public var myTopIcon:Class;
[Bindable]
// [Embed(source="assets/radioIcon.jpg")]
public var myRadioIcon:Class;
[Bindable]
// [Embed(source="assets/checkIcon.gif")]
public var myCheckIcon:Class;
// Create and display the Menu control.
private function createAndShow1():void {
var myMenu:Menu = Menu.createMenu(null, myMenuData, false);
myMenu.labelField="@label";
// Specify the check icon.
myMenu.setStyle('checkIcon', myCheckIcon);
// Specify the radio button icon.
myMenu.setStyle('radioIcon', myRadioIcon);
// Specify the icon for the topmenu items.
myMenu.iconField="@icon";
myMenu.show(10, 10);
}
]]>
</mx:Script>
<!-- Define the menu data. -->
<mx:XML format="e4x" id="myMenuData">
<root>
<menuitem label="MenuItem A" icon="myTopIcon">
<menuitem label="SubMenuItem A-1" enabled="false"/>
<menuitem label="SubMenuItem A-2"/>
</menuitem>
<menuitem label="MenuItem B" type="check" toggled="true"/>
<menuitem label="MenuItem C" type="check" toggled="false"
icon="myTopIcon"/>
<menuitem type="separator"/>
<menuitem label="MenuItem D" icon="myTopIcon">
<menuitem label="SubMenuItem D-1" type="radio"
groupName="one"/>
<menuitem label="SubMenuItem D-2" type="radio"
groupName="one" toggled="true"/>
<menuitem label="SubMenuItem D-3" type="radio"
groupName="one"/>
</menuitem>
</root>
</mx:XML>
<mx:VBox>
<!-- Define a Button control to open the menu -->
<mx:Button id="myButton1"
label="Open Menu"
click="createAndShow1();"/>
</mx:VBox>
<!--Menu samples-->
<!--
Create an instance of the Menu control by calling the static ActionScript Menu.createMenu()
method and passing the method an instance of the data provider that contains the information that
populates the control as the second parameter; for example:
使用静态方法创建,myMenudata是个data Provider
var myMenu:Menu = Menu.createMenu(null, myMenuData);
false是否使用data provider的根节点
var myMenu:Menu = Menu.createMenu(null, myMenuData,false);
-->
<mx:Script>
<![CDATA[
// Import the Menu control.
import mx.controls.Menu;
// Create and display the Menu control.
private function createAndShow2():void {
var myMenu:Menu = Menu.createMenu(null, myMenuData, false);
myMenu.labelField="@label";//xml赋值方式
myMenu.show(10, 10);//在那个坐标点显示
}
]]>
</mx:Script>
<!-- Define the menu data. -->
<mx:XML format="e4x" id="myMenuData2">
<root>
<menuitem label="MenuItem A" >
<menuitem label="SubMenuItem A-1" enabled="false"/>
<menuitem label="SubMenuItem A-2"/>
</menuitem>
<menuitem label="MenuItem B" type="check" toggled="true"/>
<menuitem label="MenuItem C" type="check" toggled="false"/>
<menuitem type="separator"/>
<menuitem label="MenuItem D" >
<menuitem label="SubMenuItem D-1" type="radio"
groupName="one"/>
<menuitem label="SubMenuItem D-2" type="radio"
groupName="one" toggled="true"/>
<menuitem label="SubMenuItem D-3" type="radio"
groupName="one"/>
</menuitem>
</root>
</mx:XML>
<mx:VBox>
<!-- Define a Button control to open the menu -->
<mx:Button id="myButton2"
label="Open Menu"
click="createAndShow2();"/>
</mx:VBox>
<!--Menu Bar samples-->
<!--
Unlike the Menu control, a MenuBar control is static;
that is, it does not function as a pop-up menu,
but is always visible in your application. Because the MenuBar is static, you can define it directly in MXML.
与Menu不同 MenuBar是静态的,它没有作为一个弹出式菜单,他总是显示在你的应用中,因为是静态的,可以之间在mxml中定义
-->
<!--注意
With the <mx:XML> tag you must have a single root node,
and you set the showRoot property of the MenuBar control to false.
(otherwise, your MenuBar would have only the root as a button).
With the <mx:XMLList> tag you define a list of XML nodes, and the top level nodes define the bar buttons.
If your data provider has a label attribute (even if it is called "label"),
you must set the MenuBar control's labelField property and use the E4X @ notation for the label; for example:
使用<mx:XML>你只能有一个根节点,你设置showRoot属性为flase (否则,你只有一个button作为根节点)
使用<mx:XMLList>你定义一个list 根节点, 如果你的数据提供者是有个label属性 即使是"label"
你必须为这个label 设置标签属性和 @表示
-->
<!-- Define the menu; dataProvider is the default MenuBar property.
Because this uses an XML data provider, specify the labelField and
showRoot properties. -->
<mx:MenuBar id="myMenuBar" labelField="@label">
<mx:XMLList>
<menuitem label="MenuItem A">
<menuitem label="SubMenuItem A-1" enabled="false"/>
<menuitem label="SubMenuItem A-2"/>
</menuitem>
<menuitem label="MenuItem B"/>
<menuitem label="MenuItem C"/>
<menuitem label="MenuItem D">
<menuitem label="SubMenuItem D-1"
type="radio" groupName="one"/>
<menuitem label="SubMenuItem D-2"
type="radio" groupName="one"
selected="true"/>
<menuitem label="SubMenuItem D-3"
type="radio" groupName="one"/>
</menuitem>
</mx:XMLList>
</mx:MenuBar>
<!--PopupMenuButton-->
<!--
Unlike the Menu and MenuBar controls, the PopUpMenuButton supports only a single-level menu
与menu,menubar 不同的地方是,它支持只有一级菜单
You define a PopUpMenuButton control in MXML by using the <mx:PopUpMenuButton> tag
可以用mxml标签
-->
<!--
1 When you click the smaller button,
which by default displays a v icon, the control displays a pop-up menu below the button.
2. When you select an item from the pop-up menu, the main PopUpMenuButton button label changes to show the selected item's label and
the PopUpMenuButton control dispatches a MenuEvent.CHANGE event.
3 When you click the main button, the PopUpMenuButton control dispatches a MenuEvent.CHANGE event and a MouseEvent.ITEM_CLICK event
1.如果你按下一个按钮 默认显示一个小图标,显示在弹出式菜单下边???
2如果你从menu选择一个item,这个main PopUpMenuButton label改变,还有the popupMenuButton发出一个MenuEvent.CHANGE事件
3 如果你点击一个主button,popupMenuButton发出一个menuEvent.CHange,和MouseEvent.ItemClick事件
You must use the PopUpMenuButton's creationComplete event, not the initialize event,
to set the main button label from the data provider
所以,你必须使用PopUpmenuButton 的creationComplete事件,不是Application的 初始化事件,设置这个主button,label从 data Provider;
如 Menu(MyPopUpControl.popUp).selectedIndex=2;
-->
<!--使用xml的方式-->
<mx:Script>
<![CDATA[
import mx.controls.Menu
// The initData function sets the initial value of the button
// label by setting the Menu subcontrol's selectedIndex property.
// You must cast the popUp property to a Menu.
private function initData():void {
Menu(pb2.popUp).selectedIndex=2;
}
]]>
</mx:Script>
<mx:XML format="e4x" id="dp2">
<root>
<editItem label="Cut"/>
<editItem label="Copy"/>
<editItem label="Paste"/>
<separator type="separator"/>
<editItem label="Delete"/>
</root>
</mx:XML>
<mx:PopUpMenuButton id="pb2"
dataProvider="{dp2}"
labelField="@label"
showRoot="false"
creationComplete="initData();"/>
<!--使用数组label方式-->
<mx:Script>
<![CDATA[
import mx.events.MenuEvent;
public function itemClickHandler(event:MenuEvent):void {
event.currentTarget.label= "Send to: " + event.label;
}
[Bindable]
public var menuData1:Array = [
{label: "Inbox", data: "inbox"},
{label: "Calendar", data: "calendar"},
{label: "Sent", data: "sent"},
{label: "Deleted Items", data: "deleted"},
{label: "Spam", data: "spam"}
];
]]>
</mx:Script>
<mx:PopUpMenuButton id="p1"
showRoot="true"
dataProvider="{menuData1}"
label="Send to: Inbox"
itemClick="itemClickHandler(event);"/>
</mx:Application>
分享到:
相关推荐
在实际应用中,为了实现跨浏览器兼容性和优化性能,开发者可能需要结合使用最新的Web技术,如Flexbox或Grid布局来替代传统的CSS定位方法,并利用事件监听器来改进JavaScript代码。同时,考虑添加ARIA属性以提高无...
GRUB4DOS是一款强大的引导装载程序,它允许用户在多操作系统环境中轻松选择要启动的操作系统。GRUB4DOS的内置菜单功能是其核心特性之一,为用户...同时,了解相关命令和工具的使用方法对于维护和优化系统启动至关重要。
可以使用`<noscript>`标签提供备用的静态菜单,同时确保键盘导航和屏幕阅读器兼容性。 6. **模块化与组件化** 当今Web开发中,模块化和组件化是趋势。可以将JavaScript菜单封装成独立的组件,方便在不同项目中复用...
1. **事件监听**:使用`.hover()`方法监听用户的鼠标进入和离开事件,来控制二级菜单的显示和隐藏。例如: ```javascript $('.menu-item').hover(function() { $(this).children('.sub-menu').stop().slideToggle...
变频器在日常使用中,有时会遇到被加密的情况,导致无法进行参数修改,这对于设备的调试和维护带来困扰。本文汇总了多个品牌变频器的解密方法,旨在帮助遇到此类问题的用户解决问题。 1. 西门子6SE70书本型变频器:...
在这种情况下,我们可以使用渐变图像作为备用方案,以确保在不支持 CSS3 的浏览器中也能呈现良好的视觉效果。 - **渐变图像**: 由于浏览器对 CSS3 渐变支持不一,使用一个白色透明的渐变图像作为背景,可以确保在...
为了保证兼容性,可以使用JavaScript作为备用方案,或者使用渐进增强的策略,先为支持`position: sticky`的浏览器提供粘性菜单,再为不支持的浏览器添加JavaScript补丁。 此外,粘性菜单可能会影响页面性能,特别是...
menu.lst中的每一行都代表一个菜单项,通过指定不同的命令和参数,可以引导不同的操作系统或者执行特定的操作。 此外,压缩包中还包括了一些与下载、安装和使用相关的文档: - **Linux公社下载说明.htm**:这可能...
【grub4dos标准工具】是一个在IT领域中用于引导管理的重要工具,尤其在系统安装和修复过程中扮演着关键角色。grub4dos是GRUB(Grand Unified ...了解和掌握grub4dos的使用方法,对于IT专业人士来说是非常有价值的技能。
6.1.8 ext.domquery的使用方法 / 249 6.1.9 ext js选择器的总结 / 252 6.2 获取单一元素:ext.dom.element / 252 6.2.1 从错误开始 / 252 6.2.2 使用ext.get获取元素 / 253 6.2.3 使用ext.fly获取元素 / 256 ...
7)每个模块的每个栏目对应一个目录, 栏目的权限默认抽象分为(查看/新增/修改/删除/排序/打印/备用A/备用B),每栏目权限可最多扩展为20个自定义权限. 8)可通过目录中web.config来进行目录文件权限配置,可直接将某个...
- **定义**:空闲区域使用菜单提供了对 NAND Flash 中未分配空间的管理选项。 - **操作**:用户可以通过此菜单选择如何利用这些空闲空间,例如将其用于 ECC 数据存储或其他特定用途。 综上所述,NAND Flash 技术以...
7)每个模块的每个栏目对应一个目录, 栏目的权限默认抽象分为(查看/新增/修改/删除/排序/打印/备用A/备用B),每栏目权限可最多扩展为20个自定义权限. 8)可通过目录中web.config来进行目录文件权限配置,可直接将某个...
7)每个模块的每个栏目对应一个目录, 栏目的权限默认抽象分为(查看/新增/修改/删除/排序/打印/备用A/备用B),每栏目权限可最多扩展为20个自定义权限. 8)可通过目录中web.config来进行目录文件权限配置,可直接将某个...
通过本教程的学习,读者可以掌握基本的字体颜色修改方法,为自己的设备带来个性化的视觉体验。 #### 二、所需工具及准备 在进行字体颜色的修改之前,我们需要准备以下工具: - **APKTool**:一款强大的Android...
* `menu`:菜单列表元素,用于显示菜单列表 * `noframes`: frames 可选内容元素,用于在不支持 frames 的浏览器中显示备用内容 * `noscript`:可选脚本内容元素,用于在不支持脚本的浏览器中显示备用内容 * `ol`:...
- 首先,在开始菜单找到Outlook的快捷方式,并将其复制到桌面上备用。 - 接着,在开始菜单中找到“启动”文件夹。 - 将桌面上的Outlook快捷方式拖入“启动”文件夹内。 ##### 2. Win8/10下的设置步骤 - 同样地,...
2. 配置文件:如“menu.lst”或“grub.cfg”,用于定义启动菜单和各个操作系统的引导选项。 3. 工具和实用程序:可能包括用于创建、修改或管理GRUB配置的工具,例如“grubinst.exe”用于将GRUB安装到硬盘上。 4. ...