Flex中如何利用selectable属性阻止用户选中DataGrid项目的例子

By Minidxer | March 17, 2009

接下来的例子演示了Flex中如何利用selectable属性,阻止用户选中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:Script>
  8.         <![CDATA[
  9.             import mx.events.ListEvent;
  10.             import mx.controls.Alert;
  11.  
  12.             private function dataGrid_itemClick(evt:ListEvent):void {
  13.                 Alert.show(evt.itemRenderer.data.label, evt.type);
  14.             }
  15.         ]]>
  16.     </mx:Script>
  17.  
  18.     <mx:Array id="arr">
  19.         <mx:Object label="Alert" />
  20.         <mx:Object label="Button" />
  21.         <mx:Object label="ButtonBar" />
  22.         <mx:Object label="CheckBox" />
  23.         <mx:Object label="ColorPicker" />
  24.         <mx:Object label="ComboBox" />
  25.     </mx:Array>
  26.  
  27.     <mx:ApplicationControlBar dock="true">
  28.         <mx:CheckBox id="checkBox"
  29.                 label="selectable:"
  30.                 labelPlacement="left"
  31.                 selected="true" />
  32.     </mx:ApplicationControlBar>
  33.  
  34.     <mx:DataGrid id="dataGrid"
  35.             dataProvider="{arr}"
  36.             selectable="{checkBox.selected}"
  37.             rowCount="4"
  38.             width="200"
  39.             change="dataGrid_itemClick(event);"
  40.             itemClick="dataGrid_itemClick(event);">
  41.         <mx:columns>
  42.             <mx:DataGridColumn dataField="label" />
  43.         </mx:columns>
  44.     </mx:DataGrid>
  45.  
  46. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: DataGrid | No Comments » | 1,398 views Tags: , ,

Search Posts