<?xml version="1.0" encoding="utf-8"?>
<mx:Module xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" layout="absolute" backgroundColor="#FFFFFF">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.controls.Alert;
[Bindable]
public var myAC:ArrayCollection = new ArrayCollection([
{a1:"集中器",type:"0",children:[
{a1:'采集器1',type:'1',children:[
{type:"2",a1:"电表1",a2:"东花苑3栋4单元202",a3:"nx18021",a4:"1239",a5:"已下发",a6:1,a7:"男"}
]},
{a1:'采集器2',type:'1',children:[
{type:"2",a1:"电表2",a2:"东花苑4栋2单元101",a3:"nx20021",a4:"3232",a5:"未下发",a6:1,a7:"男"},
{type:"2",a1:"电表3",a2:"东花苑4栋2单元201",a3:"nx22021",a4:"3233",a5:"未下发",a6:2,a7:"女"},
{type:"2",a1:"电表4",a2:"东花苑4栋2单元301",a3:"nx23021",a4:"3234",a5:"未下发",a6:3,a7:"男"},
{type:"2",a1:"电表5",a2:"东花苑4栋2单元401",a3:"nx24021",a4:"3235",a5:"未下发",a6:2,a7:"女"},
{type:"2",a1:"电表6",a2:"东花苑4栋2单元501",a3:"nx25021",a4:"3236",a5:"未下发",a6:3,a7:"男"},
{type:"2",a1:"电表7",a2:"东花苑4栋2单元601",a3:"nx26021",a4:"3237",a5:"未下发",a6:4,a7:"男"},
{type:"2",a1:"电表8",a2:"东花苑4栋2单元102",a3:"nx27021",a4:"3238",a5:"未下发",a6:1,a7:"女"},
{type:"2",a1:"电表9",a2:"东花苑4栋2单元202",a3:"nx28021",a4:"3239",a5:"已下发",a6:5,a7:"男"}
]},
{type:"2",a1:"电表10",a2:"东花苑1栋1单元202",a3:"nx28028",a4:"3239",a5:"已下发",a6:1,a7:"男"}]}
]);
/**
* 设置用户双击击行后,打开、关闭子表格渲染器
**/
private function doubleClickHandler(itemOpenEvent:MouseEvent):void
{
var itemObj:Object = this.adgrid.selectedItem;
if(itemObj.a6 == null)
{//展开树
//设置点击打开或者关闭渲染器,
this.adgrid.expandItem(itemObj, !this.adgrid.isItemOpen(itemObj));
}else{//打开子节点详情事件
Alert.show("0");
}
}
/**
* 通过值不同改变其颜色
**/
private function prorityStyleHandler(data:Object, column:AdvancedDataGridColumn):Object{
if (data["a6"] > 3)
return {color:0xFF0000};
else if (data["a6"] < 2)
return {color:0x000FF0};
return null;
}
]]>
</mx:Script>
<mx:HierarchicalData source="{myAC}" id="myHD" />
<mx:AdvancedDataGrid color="black" id="adgrid"
defaultLeafIcon="{null}" folderOpenIcon="@Embed(source='style/icon/ico (9).png')"
folderClosedIcon="@Embed(source='style/icon/ico (8).png')" allowMultipleSelection="true"
treeColumn="{treeColumn}" doubleClickEnabled="true" doubleClick="doubleClickHandler(event)"
variableRowHeight="true" editable="true" dataProvider="{myHD}" width="100%" height="100%" >
<!--
<mx:dataProvider>
<mx:GroupingCollection id="gc" source="{relatedMeters}">
<mx:grouping>
<mx:Grouping>
<mx:GroupingField name="a1" />
<mx:GroupingField name="a2" />
</mx:Grouping>
</mx:grouping>
</mx:GroupingCollection>
</mx:dataProvider>
-->
<mx:groupedColumns>
<mx:AdvancedDataGridColumn width="25" sortable="false" headerText="" />
<mx:AdvancedDataGridColumn id="treeColumn" headerText="设备" editable="false" dataField="a1" />
<mx:AdvancedDataGridColumn headerText="用电地址" dataField="a2" editable="false"/>
<mx:AdvancedDataGridColumnGroup headerText="Area">
<mx:AdvancedDataGridColumn headerText="电表编号" textAlign="right" editable="false" dataField="a3"/>
<mx:AdvancedDataGridColumn headerText="电表地址" dataField="a4" editable="false"/>
</mx:AdvancedDataGridColumnGroup>
<mx:AdvancedDataGridColumn headerText="下发标志" dataField="a5"/>
<mx:AdvancedDataGridColumn styleFunction="prorityStyleHandler" headerText="优先级" dataField="a6" editorDataField="value">
<mx:itemEditor>
<mx:Component>
<mx:NumericStepper stepSize="1" maximum="100"/>
</mx:Component>
</mx:itemEditor>
<mx:formatter>
<mx:CurrencyFormatter/>
</mx:formatter>
</mx:AdvancedDataGridColumn>
<mx:AdvancedDataGridColumn headerText="性别" dataField="a7" textAlign="center" editorDataField="text" >
<mx:itemEditor>
<mx:Component>
<mx:ComboBox>
<mx:dataProvider>
<mx:String>男</mx:String>
<mx:String>女</mx:String>
</mx:dataProvider>
</mx:ComboBox>
</mx:Component>
</mx:itemEditor>
</mx:AdvancedDataGridColumn>
</mx:groupedColumns>
</mx:AdvancedDataGrid>
</mx:Module>
分享到:
相关推荐
与简单的DataGrid相比,AdvancedDataGrid提供了更多高级特性,包括分层数据视图、多列排序、自定义布局和样式、拖放功能以及对大数据集的支持。 2. **分层数据视图** AdvancedDataGrid支持树形结构数据,可以显示...
在Flex开发中,AdvancedDataGrid是一款强大的数据网格组件,它提供了丰富的数据展示和交互功能,如排序、分组、过滤等。在实际应用中,我们经常需要为用户提供选择多条数据的能力,这时CheckBox的选择功能就显得尤为...
AdvancedDataGrid的表头皮肤是用户界面的重要组成部分,它决定了表头的外观和交互体验。表头皮肤不仅包括了列标题的显示样式,还包括了排序指示器、分组折叠按钮等元素。在Flex中,我们可以使用Spark皮肤机制来定制...
通过以上步骤,你可以为`DataGrid`和`AdvancedDataGrid`组件实现全选功能,使用户能更方便地操作大量数据。在实际项目中,你可能还需要考虑其他因素,如多线程处理、UI响应速度以及与其他功能的集成,以提供最佳的...
全选功能通常涉及到两个主要部分:主CheckBox控件和DataGrid/AdvancedDataGrid中的数据项。当主CheckBox被选中时,所有的子CheckBox应被设置为选中状态;反之,当主CheckBox被取消选中时,所有子CheckBox应被设置为...
AdvancedDataGrid或datagrid导出到excel.rar AdvancedDataGrid或datagrid导出到excel.rar AdvancedDataGrid或datagrid导出到excel.rar
最新的AdvancedDataGrid行嵌套AdvancedDataGrid实现,该例子只是实现AdvancedDataGrid利用AdvancedDataGridRendererProvider在行中渲染另外一个AdvancedDataGrid,当然也可以渲染其它任何想渲染的界面或者组件,价值...
### Flex技术中AdvancedDataGrid使用方法 #### 一、多列排序 在默认情况下,`AdvancedDataGrid`组件会按照数据被添加至其`DataProvider`...这些特性极大地增强了`AdvancedDataGrid`在数据展示方面的灵活性和功能性。
非常好用的 felx AdvancedDataGrid 多选框 单选框支持渲染器,不需改到AdvancedDataGrid 代码; 支持 xml 数据源的网上可查到一些, 但这个可是 支持 Array 类型数据源的。
在Flex编程领域,数据网格(DataGrid)是用于展示大量结构化数据的组件,而AdvancedDataGrid则是DataGrid的一个增强版,提供了更为丰富的功能和更高级的定制能力。本示例"flex-datagrid-advancedDataGrid-demo"显然...
在Flex开发中,AdvancedDataGrid是一个强大的组件,用于展示大量数据并进行复杂的数据操作,如分组、排序和过滤。这个组件特别适用于构建数据密集型的用户界面,尤其是在需要显示层次结构数据时。本篇文章将深入探讨...
实现AdvancedDataGrid中的复选框功能,开发者通常需要自定义数据项渲染器。`AdvancedDataGridGroupItemRendererEx.as`可能就是一个自定义的组项渲染器,专门用于在AdvancedDataGrid的分组行中显示复选框。组项渲染器...
在高级特性中,AdvancedDataGrid的Drag-and-Drop功能使得用户能自由地调整数据项的位置,这对于需要动态调整任务顺序的项目管理应用非常有用。开发者可以通过监听dragDrop和dragStart等事件来控制拖放行为。 另外,...
在本文中,我们将深入探讨`advancedDataGrid`的逐级展开功能,这是一个在Flex或Adobe AIR应用程序中广泛使用的高级数据网格组件。`advancedDataGrid`提供了丰富的数据展示和交互能力,特别适合处理多层次的数据结构...
2. **虚拟化**:Flex 3的AdvancedDataGrid支持数据虚拟化,意味着只有当前可视的数据行会被渲染,这样可以极大地提高性能,尤其是在处理数千甚至上万条记录时。 3. **dataProvider属性**:设置AdvancedDataGrid的...
AdvancedDataGrid相比于普通的DataGrid,提供了更多的功能和自定义选项,如: 1. 多级分组:可以对数据进行多级分类和分组,使数据结构更加清晰。 2. 复杂排序:支持对列进行多种排序方式,包括升序、降序以及多个...
SparkTree_AdvancedDataGrid是基于Adobe Flex SDK 4.5的一个高级组件,它在Flex应用中提供了强大的树形数据展示功能。Flex是一个用于创建富互联网应用程序(RIA)的开放源代码框架,广泛应用于Web开发,特别适合构建...
flex datavisualization.swc flex 3 AdvancedDataGrid