Flex中利用DataGrid类的draggableColumns属性和DataGridColumn类的draggable属性设置DataGrid控件是否可拖拽的例子

By Minidxer | August 18, 2008

接下来的例子演示了Flex中如何利用DataGrid类的draggableColumns属性和DataGridColumn类的draggable属性，设置DataGrid控件是否可拖拽。

让我们先来看一下Demo（可以右键View Source或点击这里察看源代码）：


下面是完整代码(或点击这里察看)：

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  3.         layout="vertical"
  4.         verticalAlign="middle"
  5.         backgroundColor="white">
  6.  
  7.     <mx:Array id="arr">
  8.         <mx:Object label="User 1" data="1" />
  9.         <mx:Object label="User 2" data="2" />
  10.         <mx:Object label="User 3" data="3" />
  11.         <mx:Object label="User 4" data="4" />
  12.         <mx:Object label="User 5" data="5" />
  13.         <mx:Object label="User 6" data="6" />
  14.         <mx:Object label="User 7" data="7" />
  15.         <mx:Object label="User 8" data="8" />
  16.     </mx:Array>
  17.  
  18.     <mx:ApplicationControlBar dock="true">
  19.         <mx:CheckBox id="draggableColumnsCh"
  20.                 label="draggableColumns"
  21.                 selected="true" />
  22.  
  23.         <mx:CheckBox id="labelDraggableCh"
  24.                 label="label.draggable"
  25.                 selected="true" />
  26.  
  27.         <mx:CheckBox id="dataDraggableCh"
  28.                 label="data.draggable"
  29.                 selected="true" />
  30.     </mx:ApplicationControlBar>
  31.  
  32.     <mx:DataGrid id="dataGrid"
  33.             draggableColumns="{draggableColumnsCh.selected}"
  34.             dataProvider="{arr}">
  35.         <mx:columns>
  36.             <mx:DataGridColumn dataField="label"
  37.                     draggable="{labelDraggableCh.selected}" />
  38.             <mx:DataGridColumn dataField="data"
  39.                     draggable="{dataDraggableCh.selected}" />
  40.         </mx:columns>
  41.     </mx:DataGrid>
  42.  
  43. </mx:Application>
代码：Peter deHaan 翻译/整理/编译：中文Flex例子

Topics: Flex | Tags: , ,

Related Post

Leave a Comment

Name(*):

E-Mail(*) :

Website :

Comments :

Search Posts

Categories

Archives

Blogroll

Sponsored Ads