`
msyspacer
  • 浏览: 9920 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

Flex4 菜单导航数据源配置

 
阅读更多

方法如下,主要注意Array,Model和XML引用数据方法的区别

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   creationComplete="init()">
	
	<fx:Script>
		<![CDATA[
			import events.ContentEvent;
			
			import mx.collections.ArrayCollection;
			import mx.controls.Alert;
			import mx.controls.Menu;
			
			import net.DataLoader;
			
			// 使用Actionscript创建menu
			//protected var menu:Menu;
			// as 使用嵌套数组创建数据源
			protected var menu1:Array = [{label:'File',
				children:[{label:'Open'},{label:'New'},{label:'Save'},{label:'Colse'}]},
				{label:'Edit',
					children:[{label:'Undo'},{label:'Cut'},{label:'Copy'},{label:'Paste'}]}
			];
			// as 使用ArrayCollection包装嵌套数组创建数据源
			var menu2:ArrayCollection = new ArrayCollection(menu1);			
			// as使用XMl创建数据源
			protected var menu4:XML=<menuitems>
				<menuitem label="File">
					<children label="Open"/>
					<children label="New"/>
					<children label="Save"/>
					<children label="Colse"/>
				</menuitem>
				<menuitem label="Edit">
					<children label="Undo"/>
					<children label="Cut"/>
					<children label="Copy"/>
					<children label="Paste"/>
				</menuitem>
			</menuitems>;

			protected function init():void
			{
				// 使用Actionscript创建menu
				//menu = Menu.createMenu(null,menu1,false);
				cmd_show.addEventListener(MouseEvent.CLICK,Cmd_Show_Clicked);
			}
			
			protected function Cmd_Show_Clicked(event:Event)
			{
				menu.show();
			}
			
		]]>
	</fx:Script>
	<fx:Declarations>
		
		<fx:XML id="config" source="config.xml" />
		
		<!--mxml 使用嵌套数组创建数据源-->
		<fx:Array id="menu1_1">
			<fx:Object label="File">
				<fx:children>
					<fx:Array>
						<fx:Object label="Open"/>
						<fx:Object label="New"/>
						<fx:Object label="Save"/>
						<fx:Object label="Colse"/>
					</fx:Array>
				</fx:children>
			</fx:Object>
			<fx:Object label="Edit">
				<fx:children>
					<fx:Array>
						<fx:Object label="Undo"/>
						<fx:Object label="Cut"/>
						<fx:Object label="Copy"/>
						<fx:Object label="Paste"/>
					</fx:Array>
				</fx:children>
			</fx:Object>
		</fx:Array>
		
		<!--mxml 使用ArrayCollection包装嵌套数组创建数据源-->
		<s:ArrayCollection id="menu2_1">
			<fx:Array>
				<fx:Object label="File">
					<fx:children>
						<fx:Array>
							<fx:Object label="Open"/>
							<fx:Object label="New"/>
							<fx:Object label="Save"/>
							<fx:Object label="Colse"/>
						</fx:Array>
					</fx:children>
				</fx:Object>
				<fx:Object label="Edit">
					<fx:children>
						<fx:Array>
							<fx:Object label="Undo"/>
							<fx:Object label="Cut"/>
							<fx:Object label="Copy"/>
							<fx:Object label="Paste"/>
						</fx:Array>
					</fx:children>
				</fx:Object>
			</fx:Array>
		</s:ArrayCollection>
		
		<!--mxml 使用模型创建数据源-->
		<fx:Model id="menu3">
			<menuitems>
				<menuitem label="File">
					<children label="Open"/>
					<children label="New"/>
					<children label="Save"/>
					<children label="Colse"/>
				</menuitem>
				<menuitem label="Edit">
					<children label="Undo"/>
					<children label="Cut"/>
					<children label="Copy"/>
					<children label="Paste"/>
				</menuitem>
			</menuitems>
		</fx:Model>
		
		<!--mxml 使用XML创建数据源 除了XML相关配置,其他设定方法必须包含children项,XML,XMLList,XMLListCollection可以不必设定-->
		<fx:XML id="menu4_1">
			<menuitems>
				<menuitem label="File">
					<children label="Open"/>
					<children label="New"/>
					<children label="Save"/>
					<children label="Colse"/>
				</menuitem>
				<menuitem label="Edit">
					<children label="Undo"/>
					<children label="Cut"/>
					<children label="Copy"/>
					<children label="Paste"/>
				</menuitem>
			</menuitems>
		</fx:XML>
		
		<!--mxml 使用XMLList创建数据源 除了XML相关配置,其他设定方法必须包含children项,XML,XMLList,XMLListCollection可以不必设定-->
		<fx:XMLList id="menu5">
			<menuitem label="File">
				<children label="Open"/>
				<children label="New"/>
				<children label="Save"/>
				<children label="Colse"/>
			</menuitem>
			<menuitem label="Edit">
				<children label="Undo"/>
				<children label="Cut"/>
				<children label="Copy"/>
				<children label="Paste"/>
			</menuitem>
		</fx:XMLList>
		
		<!--mxml 使用XMLListCollection创建数据源 除了XML相关配置,其他设定方法必须包含children项,XML,XMLList,XMLListCollection可以不必设定-->
		<s:XMLListCollection id="menu6" source="{menu4_1.menuitem}"/>
		
		<!--mxml 使用外部XML文件用XMLListCollection创建数据源 除了XML相关配置,其他设定方法必须包含children项,XML,XMLList,XMLListCollection可以不必设定-->
		<s:XMLListCollection id="menu7" source="{config.menuitem}"/>
	</fx:Declarations>
	<s:Panel id="mix" verticalCenter="0" horizontalCenter="0" title="Mix" width="450" height="300">
		<s:layout>
			<s:VerticalLayout gap="0"/>
		</s:layout>
		<s:Button id="cmd_show" label="Show Menu" />
		<!--使用Array创建数据源-->
		<!--<mx:Menu id="menu" showRoot="true" labelField="label" dataProvider="{menu1}"/>-->
		<!--使用ArrayList创建数据源-->
		<!--<mx:Menu id="menu" showRoot="true" labelField="label" dataProvider="{menu2}"/>-->
		<!--使用fx:Model创建数据源-->
		<!--<mx:Menu id="menu" showRoot="true" labelField="label" dataProvider="{menu3.menuitem}"/>-->
		<!--使用XML创建数据源-->
		<!--<mx:Menu id="menu" showRoot="true" labelField="@label" dataProvider="{menu4.menuitem}"/>-->
		<!--使用XMLList创建数据源-->
		<!--<mx:Menu id="menu" showRoot="true" labelField="@label" dataProvider="{menu5}"/>-->
		<!--使用XMLListCollection创建数据源-->
		<mx:Menu id="menu" showRoot="true" labelField="@label" dataProvider="{menu7}"/>
	</s:Panel>
</s:Application>

 以下为传入的XML文件

<?xml version="1.0" encoding="utf-8"?>
				<menuitems>
				<menuitem label="File">
					<children label="Open"/>
					<children label="New"/>
					<children label="Save"/>
					<children label="Colse"/>
				</menuitem>
				<menuitem label="Edit">
					<children label="Undo"/>
					<children label="Cut"/>
					<children label="Copy"/>
					<children label="Paste"/>
				</menuitem>
			</menuitems>

 

 

分享到:
评论

相关推荐

    Flex4 滑动菜单案例

    2. **创建MenuBar**:声明一个MenuBar组件,设置其数据源,通常是XML或ArrayCollection,包含菜单项的文本和链接。 ```xml 菜单1"/&gt; 菜单2"/&gt; &lt;!-- 添加更多菜单项 --&gt; ``` 3. **添加特效**:为每个...

    Flex导航菜单

    【Flex导航菜单】是一种在基于Adobe Flex框架开发的Web应用程序中常见的用户界面组件。它主要用于提供应用程序的主要功能入口,帮助用户轻松浏览和访问各种页面或功能。Flex是使用ActionScript编程语言和MXML标记...

    Flex控件折叠效果

    - **导航菜单**:在复杂的应用中,折叠效果可以用于创建层次结构的导航菜单,使用户能够逐步探索内容。 - **设置面板**:在配置或设置界面中,折叠效果可以隐藏不常用或高级的选项,保持界面整洁。 - **内容展示*...

    flex英文帮助文档(非常详细)

    - **数据绑定**:解释了数据绑定的概念,并展示了如何在 Flex 中实现数据绑定。 - **容器简介**:概述了容器的作用及不同类型的容器选择。 - **布局组件**:讲解了如何使用不同的布局策略来组织界面元素。 - **应用...

    flexbuilder3training.rar

    通过这个示例,学习者可以了解到如何绑定数据源到DataGrid,设置列定义,以及实现交互性,如点击事件处理。 2. **Effect_integration.zip** 这个案例涉及到效果和动画的集成。在Flex中,可以使用Effects类库来创建...

    ESRI+Flex+Viewer框架的ArcGIS+Server开发

    7. **优势**:Flex Viewer框架简化了Web GIS应用的开发,降低了对地图服务、导航和数据管理的编程需求,让开发者更专注于业务流程和用户体验。同时,其组件化设计促进了代码的可维护性和定制性。 综上所述,【ESRI ...

    flex3 cookbook 英文版pdf

    - **使组件的属性可绑定**:解释如何让组件属性支持数据绑定,从而简化UI与数据源之间的同步。 - **使用自定义事件和事件分发数据**:教导如何定义和使用自定义事件,以及如何在事件触发时传递额外的数据。 - **...

    基于ESRI Flex Viewer框架的ArcGIS Server开发

    5. **Services and Data Feeds**:其他服务和数据源,如WMS、KML等,可以集成到应用中提供额外的数据支持。 **Flex Viewer应用生命周期** 1. **启动阶段**:Flash Player加载并运行容器SWF,启动Flex Viewer应用...

    Flex_Viewer解析

    这部分提供了地图和其他数据源的接入。虽然在Flex_Viewer中并未明确区分出数据层,但它实际上贯穿于整个系统之中。本层负责处理所有与数据获取和处理相关的任务。 #### 二、文件组织详解 为了更好地理解Flex_...

    flex3_plugin+mysql+myeclipse

    这通常需要在后端进行数据的分块查询,并在Flex前端实现分页控件和导航逻辑。 9. **立即更新**:描述中的“立即更新”指的是在修改信息后,无需刷新整个页面就能看到变化。这依赖于实时的数据绑定和事件驱动机制,...

    Flex 基于数据源的Menu Tree实现代码

    1. **数据源**:在Flex中,数据源通常是XML、ArrayCollection或其他可迭代的数据结构,用于提供菜单树的数据。在这个例子中,数据源可能是XML文件,通过`flashvars`参数传递文件位置或render链接。 2. **Menu Tree*...

    eclipse flex flashplayer debug安装

    5. **配置调试器**:在项目属性中,还有一个“Flex Compiler”(Flex编译器)部分,找到“Flash Player Debugger”(Flash Player调试器)下拉菜单,选择你刚才安装的调试器版本。 6. **设置浏览器**:为了使调试器...

Global site tag (gtag.js) - Google Analytics