`
niulanshan
  • 浏览: 564122 次
文章分类
社区版块
存档分类
最新评论

Flex之AdvancedDataGrid用法

 
阅读更多

一、新建一个Flex项目,命名为AdvanceDataGrid;


二、在src默认包下,新建一个MXML应用程序,名为AdvanceDataGrid.mxml,源码如下:

<?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" 
			   width="100%" height="100%">
	
	<fx:Style>
		@namespace s "library://ns.adobe.com/flex/spark";
		@namespace mx "library://ns.adobe.com/flex/mx";
		.advanceDataGrid{
			font-size:12px;
			color:FFFFFF;
		}
	</fx:Style>
	
	<fx:Script>
		<![CDATA[
			import mx.collections.ArrayCollection;
			
			[Bindable]
			private var collegeArray:ArrayCollection = new ArrayCollection([
				{Grade:"大学一年级", Classes:"计算机学院", Teacher:"王宇", Number:38865, Calling:40000}, 
				{Grade:"大学一年级", Classes:"软件工程学院", Teacher:"李华", Number:29885, Calling:30000},  
				{Grade:"大学一年级", Classes:"物流学院", Teacher:"赵小刚", Number:29134, Calling:30000},  
				{Grade:"大学一年级", Classes:"政治与行政学院", Teacher:"孙雪", Number:52888, Calling:45000},  
				{Grade:"大学一年级", Classes:"外国语学院", Teacher:"李煌", Number:38805, Calling:40000}, 
				{Grade:"大学一年级", Classes:"航海学院", Teacher:"石理", Number:55498, Calling:40000},  
				{Grade:"大学一年级", Classes:"文学学院", Teacher:"钱无", Number:44985, Calling:45000}, 
				{Grade:"大学一年级", Classes:"生物学院", Teacher:"赵八", Number:44913, Calling:45000},
				{Grade:"大学二年级", Classes:"计算机学院", Teacher:"王宇", Number:38865, Calling:40000}, 
				{Grade:"大学二年级", Classes:"软件工程学院", Teacher:"李华", Number:29885, Calling:30000},  
				{Grade:"大学二年级", Classes:"物流学院", Teacher:"赵小刚", Number:29134, Calling:30000},  
				{Grade:"大学二年级", Classes:"政治与行政学院", Teacher:"孙雪", Number:52888, Calling:45000},  
				{Grade:"大学二年级", Classes:"外国语学院", Teacher:"李煌", Number:38805, Calling:40000}, 
				{Grade:"大学二年级", Classes:"航海学院", Teacher:"石理", Number:55498, Calling:40000},  
				{Grade:"大学二年级", Classes:"文学学院", Teacher:"钱无", Number:44985, Calling:45000}, 
				{Grade:"大学二年级", Classes:"生物学院", Teacher:"赵八", Number:44913, Calling:45000},
				{Grade:"大学三年级", Classes:"计算机学院", Teacher:"王宇", Number:38865, Calling:40000}, 
				{Grade:"大学三年级", Classes:"软件工程学院", Teacher:"李华", Number:29885, Calling:30000},  
				{Grade:"大学三年级", Classes:"物流学院", Teacher:"赵小刚", Number:29134, Calling:30000},  
				{Grade:"大学三年级", Classes:"政治与行政学院", Teacher:"孙雪", Number:52888, Calling:45000},  
				{Grade:"大学三年级", Classes:"外国语学院", Teacher:"李煌", Number:38805, Calling:40000}, 
				{Grade:"大学三年级", Classes:"航海学院", Teacher:"石理", Number:55498, Calling:40000},  
				{Grade:"大学三年级", Classes:"文学学院", Teacher:"钱无", Number:44985, Calling:45000}, 
				{Grade:"大学三年级", Classes:"生物学院", Teacher:"赵八", Number:44913, Calling:45000},
				{Grade:"大学四年级", Classes:"计算机学院", Teacher:"王宇", Number:38865, Calling:40000}, 
				{Grade:"大学四年级", Classes:"软件工程学院", Teacher:"李华", Number:29885, Calling:30000},  
				{Grade:"大学四年级", Classes:"物流学院", Teacher:"赵小刚", Number:29134, Calling:30000},  
				{Grade:"大学四年级", Classes:"政治与行政学院", Teacher:"孙雪", Number:52888, Calling:45000},  
				{Grade:"大学四年级", Classes:"外国语学院", Teacher:"李煌", Number:38805, Calling:40000}, 
				{Grade:"大学四年级", Classes:"航海学院", Teacher:"石理", Number:55498, Calling:40000},  
				{Grade:"大学四年级", Classes:"文学学院", Teacher:"钱无", Number:44985, Calling:45000}, 
				{Grade:"大学四年级", Classes:"生物学院", Teacher:"赵八", Number:44913, Calling:45000}
			]);
		]]>
	</fx:Script>
	
	<mx:Panel title="AdvancedDataGrid样例"
			  height="100%" width="100%" layout="horizontal"
			  paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10" textAlign="center">
		
		<mx:AdvancedDataGrid id="myADG" width="100%" height="100%" initialize="ca.refresh();" headerColors="0xcccccc" styleName="advanceDataGrid">        
			<mx:dataProvider>
				<mx:GroupingCollection2 id="ca" source="{collegeArray}">
					<mx:grouping>
						<mx:Grouping>
							<mx:GroupingField name="Grade"/>
							<mx:GroupingField name="Classes"/>
						</mx:Grouping>
					</mx:grouping>
				</mx:GroupingCollection2>
			</mx:dataProvider>        
			
			<mx:columns>
				<mx:AdvancedDataGridColumn dataField="Grade" headerText="年级"/>
				<mx:AdvancedDataGridColumn dataField="Classes" headerText="班级"/>
				<mx:AdvancedDataGridColumn dataField="Teacher" headerText="指导员"/>
				<mx:AdvancedDataGridColumn dataField="Number" headerText="人数"/>
				<mx:AdvancedDataGridColumn dataField="Calling" headerText="联系方式"/>
			</mx:columns>
		</mx:AdvancedDataGrid>
	</mx:Panel>

	
</s:Application>

三、鼠标右键,点击“运行方式”中的“Web应用程序”,运行结果如下:



分享到:
评论

相关推荐

    Flex技术中AdvancedDataGrid使用方法

    ### Flex技术中AdvancedDataGrid使用方法 #### 一、多列排序 在默认情况下,`AdvancedDataGrid`组件会按照数据被添加至其`DataProvider`的顺序来展示数据。与`DataGrid`组件类似,`AdvancedDataGrid`也支持用户在...

    flex advancedDataGrid 中如何实现带checkbox的树

    综上所述,实现Flex AdvancedDataGrid中带复选框的树形结构涉及数据模型的设计、HierarchicalData的使用、AdvancedDataGrid的配置以及事件处理等多个方面。通过灵活应用这些技术,我们可以创建出功能强大且易于操作...

    Flex中AdvancedDataGrid的用法示例介绍

    开发人员如果想要更深入地了解和掌握AdvancedDataGrid的用法,应该参考官方文档,学习更多关于其属性、方法以及事件处理机制的详细信息。同时,通过实际的编码实践来熟悉和掌握这些知识点是非常必要的。

    AdvancedDataGrid综合应用

    《AdvancedDataGrid综合应用》 在Flex开发中,...综上所述,AdvancedDataGrid是Flex开发中处理复杂数据展示的得力工具,通过深入了解其特性和使用方法,开发者可以创建出功能强大且用户友好的数据管理界面。

    flex DataGrid 表头分组

    在提供的文档《Flex_AdvancedDataGrid的使用.doc》中,可能包含了更多关于如何使用和配置`AdvancedDataGrid`以实现表头分组的详细信息,包括示例代码和最佳实践。建议详细阅读文档以深入理解和应用这个功能。 总的...

    AdvancedDataGrid动态加载.rar

    7. **loadMoreItems()方法**:在Flex 3中,你可能需要编写一个方法来处理加载更多数据的逻辑,这个方法会在用户接近数据集末尾时被调用。 8. **数据绑定和事件处理**:确保正确地绑定数据源,并处理好数据加载、...

    flex 合并单元格

    在Flex中,我们通常使用MX组件库中的DataGrid或Spark组件库中的List和AdvancedDataGrid来展示数据。对于合并单元格的需求,AdvancedDataGrid是更合适的选择,因为它提供了更丰富的功能,包括单元格和列的合并。 1. ...

    AdvancedDataGrid 对sdk3.5不支持,对3.2支持方案(合并单元格)

    然而,针对Adobe Flex SDK 3.5版本,AdvancedDataGrid存在一些兼容性问题,这使得在该版本下无法正常使用某些特性,特别是像“合并单元格”这样的高级功能。这篇博客文章(链接已给出:...

    DataGrid和AdvancedDataGrid CheckBox全选功能1.1

    在本文中,我们将深入探讨如何在Flex中实现DataGrid和AdvancedDataGrid组件的CheckBox全选功能。这个功能在数据展示和交互式操作中非常常见,它允许用户通过一个主CheckBox来选择或取消选择所有行数据。 首先,我们...

    开源DataGrid和AdvancedDataGrid复制到Excel工具类

    在描述中提到的博客链接(已省略)可能提供了更多关于这个工具类的实现细节、使用方法以及示例代码。通过阅读博客,开发者可以学习如何集成这个工具到自己的项目中,或者了解其背后的实现原理,这有助于提升对Flex和...

    advancedDataGrid单击逐级展开的例子

    在本文中,我们将深入探讨`advancedDataGrid`的逐级展开功能,这是一个在Flex或Adobe AIR应用程序中广泛使用的高级数据网格组件。`advancedDataGrid`提供了丰富的数据展示和交互能力,特别适合处理多层次的数据结构...

    Flex4.5常见问题总结

    数据绑定是Flex的核心特性之一,允许源属性的变化自动反映到目标属性上。Flex提供了三种绑定方式: 1. 在mxml中使用大括号`{}`直接绑定属性。 2. 使用`&lt;fx:Binding&gt;`标签在mxml中绑定属性。 3. 在as中使用`...

    flex 页面增删改以及柱形数据变化

    例如,使用DataGrid或AdvancedDataGrid组件可以方便地展示和编辑数据。我们可以监听这些组件的事件,如itemClick、commitChanges等,来执行相应的业务逻辑。增、删、改的操作通常涉及对ArrayCollection或其他数据...

    flex开发实例

    根据给定文件的信息,我们可以提炼出一系列关于Flex开发的关键知识点,包括Flex的基础概念、MXML与ActionScript的基本用法以及一些具体的控件和功能实现。下面将详细展开这些知识点: ### Flex简介 Flex是一种用于...

    DataGrid和AdvancedDataGrid CheckBox全选功能

    你可以使用`dataProvider`的`refresh()`方法来避免不必要的渲染,或者使用`ICollectionView`接口的`refresh()`和`filterFunction`来只处理可见数据。 6. **自定义类**: 如果你正在使用`AdvancedDataGrid`,可能还...

    Flex Demo XML JSON

    此外,对于大型数据集,可以使用数据网格控件(如`DataGrid`或`AdvancedDataGrid`)进行分页和排序。 6. **安全性考虑**:处理XML和JSON时,应确保数据的安全性,避免XSS(跨站脚本攻击)和XXE(XML外部实体注入)...

    Flex4 带checkbox的DataGrid

    其中包含一个三种状态的checkbox,DataGrid代码中引用了 带多选框的DataGrid(AdvancedDataGrid) ...使用方法参考“示例参考.txt” ------------------------------ 目前数据源只能用ArrayCollection

    Flex开发实例.pdf

    根据提供的文档信息,我们可以深入探讨Flex开发中的关键概念和技术细节,包括MXML与ActionScript的基础用法、常用UI组件的应用以及GIS开发等高级主题。 ### Flex简介 Flex是一种开源框架,用于构建高质量的Web应用...

    Flex中让鼠标移至AdvancedDataGrid的行上不自动修改显示效果

    在Flex开发中,AdvancedDataGrid控件是一种强大的数据网格组件,用于展示大量结构化数据。相较于mx:Repeater,AdvancedDataGrid在处理大数据集时提供了更好的性能和用户体验,包括分页、排序、过滤等功能。然而,它...

Global site tag (gtag.js) - Google Analytics