【Flex3】AdvancedDataGrid的使用(二)

标签：

续第一部分，我们继续来讲AdvancedDataGrid的使用。

选择多个单元格及多行

所有基于List的控件都支持allowMultipleSelection属性。将allowMultipleSelection属性设置为True可以使得您在控件中一次选择不止一个条目。例如，DataGrid控件可以让您选择多行这样您就可以将他们拖放到另一个DataGrid中。

AdvancedDataGrid增加了可以让您选择多个单元格的新的特性，一旦已选择，您就可以将其拖放到另一个AdvancedDataGrid控件中、将它们拷贝到剪切板中或者在单元格数据进行某些其他的处理。

您可以使用AdvancedDataGrid控件的selectionMode和allowMultipleSelection配置多重选择。selectionMode的缺省属性是singleRow，这就是说您一次只能选择单行。要多重选择，需要将selectionMode属性设置为multipleRows或者multipleCells。

多个单元格的选择方式和表格处理软件中的用法相似，连续的使用Shift键，非连续的使用Control建。

选择控件中邻近的单元

1. 点击第一个单元，在某行或某列，选择它。
2. 在选择其他的单元时按下Shift键。如果selectionMode设置为multipleRows，点击任何其他行的单元格来选择多个时，将选择邻近的行。如果selectionMode设置为multipleCells，点击任何单元格，将选择邻近的单元格

选择控件中非邻近的单元

1. 点击第一个单元，在某行或某列，选择它。
2. 在选择其他的单元时按下Control键。如果selectionMode设置为multipleRows，点击任何其他行的单元格来选择多个时，将选择该单独的行。如果selectionMode设置为multipleCells，点击任何单元格，将选择该单独的单元格

一旦选择了AdvancedDataGrid控件的某行或列时，该控件将更新selectedCells属性来记录您的选择信息。selectedCells是一个对象数组，它包含的每个对象都有一个rowIndex和columnIndex属性来表示您选择的单元格在控件中的行列的位置。

selectionMode属性的值决定了rowIndex和columnIndex属性的值，如下表所示：

selectionMode属性
rowIndex和columnIndex属性值

none
控件不允许选择，并且selectedCells为null

singleRow
点击某行的任意单元来选择该行。
在选择后，selectedCells包含一个单独对象：

[{rowIndex:selectedRowIndex, columnIndex: -1}]

multipleRows
点击某行的任意单元来选择该行。
对于非邻近行，按下Control键时，点击其他行的单元格来选择其他行。
对于邻近行，按下Shfit键时，点击其他行的单元格来选择多个连续的行。
选择后，每行在selectedCells保存为一个对象：

[ {rowIndex: selectedRowIndex1, columnIndex: -1},  {rowIndex: selectedRowIndex2, columnIndex: -1},  ...  {rowIndex: selectedRowIndexN, columnIndex: -1}]

singleCell
点击任意单元来选择该单元格。
在选择后，selectedCells包含一个单独对象：
[{rowIndex: selectedRowIndex, columnIndex:selectedColIndex}]

multipleCells
点击任意单元来选择该单元格。
对于非邻近单元，按下Control键时，点击任意单元格来选择多个非连续的单元格。
对于邻近单元，按下Shfit键时，点击任意单元格来选择多个连续的单元格。
选择后，每行在selectedCells保存为一个对象：

[ {rowIndex: selectedRowIndex1, columnIndex: selectedColIndex1},  {rowIndex: selectedRowIndex2, columnIndex: selectedColIndex2},  ...  {rowIndex: selectedRowIndexN, columnIndex: selectedColIndexN}]

以下示例设置selectionMode属性为multipleCells使得您可以选择表格中的多个单元。该应用使用KeyUp事件处理器来识别Control-C组合键，如果监听到，将选择的多个单元格从AdvancedDataGrid控件复制到系统剪贴板中。

在拷贝单元格后，您可以将这些单元格粘贴到Flex应用的其他位置中，或者将它们粘贴到其他应用如微软Excel。您可以将它们粘贴到应用底部的TextArea中去。

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> 
    <mx:Script>  
        <![CDATA[   
            import mx.collections.ArrayCollection;   
            import flash.events.KeyboardEvent;   
            import flash.system.System;   
            include "StyleData.as"  
            // Event handler to recognize when Ctrl-C is pressed,   
            // and copy the selected cells to the system clipboard.  
            private function myKeyUpHandler(event:KeyboardEvent):void   
            {    var keycode_c:uint = 67;   
                if (event.ctrlKey && event.keyCode == keycode_c)    
                {    
                    
                } // Separator used between Strings sent to clipboard     
                // to separate selected cells.     
                var separator:String = ",";    
                // The String sent to the clipboard     
                var dataString:String = "";     
                // Loop over the selectedCells property.     
                // Data in selectedCells is ordered so that     
                // the last selected cell is at the head of the list.     
                // Process the data in reverse so     
                // that it appears in the correct order in the clipboard.     
                var n:int = event.currentTarget.selectedCells.length;    
                for (var i:int = 0; i < n; i++)     
                {      
                    
                }var cell:Object = event.currentTarget.selectedCells[i];      
                // Get the row for the selected cell.     
                var data:Object =      event.currentTarget.dataProvider[cell.rowIndex];      
                // Get the name of the field for the selected cell.     
                var dataField:String =      event.currentTarget.columns[cell.columnIndex].dataField;      
                // Get the cell data using the field name.     
                dataString = data[dataField] + separator + dataString;     }    
            // Remove trailing separator.     
            dataString =     dataString.substr(0, dataString.length - separator.length);    
            // Write dataString to the clipboard.     
            System.setClipboard(dataString);    }   }  ]]> 
    </mx:Script> 
    <mx:AdvancedDataGrid width="100%" height="100%"  dataProvider="{dpADG}"  selectionMode="multipleCells"  allowMultipleSelection="true"  keyUp="myKeyUpHandler(event);">  
        <mx:columns>  
            <mx:AdvancedDataGridColumn dataField="Artist"/>  
            <mx:AdvancedDataGridColumn dataField="Album"/> 
            <mx:AdvancedDataGridColumn dataField="Price"/> 
        </mx:columns>
    </mx:AdvancedDataGrid> 
    <mx:TextArea id="myTA"/>
</mx:Application>

运行示例 【Not Use】

分层和分组数据显示

AdvancedDataGrid支持分级和分组数据的显示，为了支持这样的显示，AdvancedDataGrid在第一列显示一个导航树以让您分级浏览数据。

分层数据（Hierarchical data）是一种以父子项目结构分层的数据，分组数据（Grouped data）是一开始就为平面的而无内在层次关系的数据。在将该数据传递给AdvancedDataGrid前，您可以指定一个或更多的数据字段将一组数据归组为同一层次。

以下文件中的代码演示分级数据示例：

//SimpleHierarchicalData.as:
 
[Bindable]
private var dpHierarchy:ArrayCollection = new ArrayCollection([
 {Region:"Southwest", children: [
  {Region:"Arizona", children: [
   {Territory_Rep:"Barbara Jennings", Actual:38865, Estimate:40000},
   {Territory_Rep:"Dana Binn", Actual:29885, Estimate:30000}]},
  {Region:"Central California", children: [
   {Territory_Rep:"Joe Smith", Actual:29134, Estimate:30000}]},
  {Region:"Nevada", children: [
   {Territory_Rep:"Bethany Pittman", Actual:52888, Estimate:45000}]},
  {Region:"Northern California", children: [
   {Territory_Rep:"Lauren Ipsum", Actual:38805, Estimate:40000},
   {Territory_Rep:"T.R. Smith", Actual:55498, Estimate:40000}]},
  {Region:"Southern California", children: [
   {Territory_Rep:"Alice Treu", Actual:44985, Estimate:45000},
   {Territory_Rep:"Jane Grove", Actual:44913, Estimate:45000}]}
 ]}
]);

注意该数据的顶层数据包含一个Region字段和多个第二层子对象，每个第二层子对象也包含一个Region字段和多个其他的子对象，以下示例演示AdvancedDataGrid控件对该数据的显示效果：

该示例的代码在“控制导航树”章节中。

要显示扁平数据，在将其传递给AdvancedDataGrid前您首先要对数据进行归组。以下代码包含的是前面示例中分层数据的变异版本，其将数据组织为以平面结构：

[Bindable]
private var dpFlat:ArrayCollection = new ArrayCollection([
 {Region:"Southwest", Territory:"Arizona",
  Territory_Rep:"Barbara Jennings", Actual:38865, Estimate:40000},
 {Region:"Southwest", Territory:"Arizona",
  Territory_Rep:"Dana Binn", Actual:29885, Estimate:30000},
 {Region:"Southwest", Territory:"Central California",
  Territory_Rep:"Joe Smith", Actual:29134, Estimate:30000},
 {Region:"Southwest", Territory:"Nevada",
  Territory_Rep:"Bethany Pittman", Actual:52888, Estimate:45000},
 {Region:"Southwest", Territory:"Northern California",
  Territory_Rep:"Lauren Ipsum", Actual:38805, Estimate:40000},
 {Region:"Southwest", Territory:"Northern California",
  Territory_Rep:"T.R. Smith", Actual:55498, Estimate:40000},
 {Region:"Southwest", Territory:"Southern California",
  Territory_Rep:"Alice Treu", Actual:44985, Estimate:45000},
 {Region:"Southwest", Territory:"Southern California",
  Territory_Rep:"Jane Grove", Actual:44913, Estimate:45000}
]);

在该示例中，数据只包含一个层面没有内在的层次的单独纪录,要归组该数据，您可以指定一个或更多的数据字段将该数据归组为同一层次。以下示例演示AdvancedDataGrid控件对平面数据通过Region字段进行的分组。

该示例代码在“显示分组数据“章节中

【Flex3】AdvancedDataGrid的使用(二)

标签：

原文地址：http://www.cnblogs.com/zhongxia/p/4661274.html