|
|
| <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white"> <mx:Script> <![CDATA[ import mx.events.ListEvent; import mx.controls.Alert; private function dataGrid_change(evt:ListEvent):void { Alert.show(evt.itemRenderer.data.label, evt.type); } ]]> </mx:Script> <mx:Array id="arr"> <mx:Object label="Alert" /> <mx:Object label="Button" /> <mx:Object label="ButtonBar" /> <mx:Object label="CheckBox" /> <mx:Object label="ColorPicker" /> <mx:Object label="ComboBox" /> </mx:Array> <mx:ApplicationControlBar dock="true"> <mx:CheckBox id="checkBox" label="useRollOver:" labelPlacement="left" selected="true" /> </mx:ApplicationControlBar> <mx:DataGrid id="dataGrid" dataProvider="{arr}" useRollOver="{checkBox.selected}" rowCount="4" width="200" change="dataGrid_change(event);"> <mx:columns> <mx:DataGridColumn dataField="label" /> </mx:columns> </mx:DataGrid> </mx:Application> As you can see, when the useRollOver style is set to false , the item row highlight is not drawn when moving your mouse over an item in the DataGrid, but the background color is drawn if you select an item. If the useRollOver style is set to true , the item row highlight is drawn when hovering over a list item. Since useRollOver is a style, you can also set it in an external .CSS file, or in an <mx:Style /> block, as shown in the following snippet: <mx:Style> DataGrid { useRollOver: false; } </mx:Style> Or, you can set the useRollOver style in ActionScript, as seen in the following snippet: <mx:Script> <![CDATA[ private function init():void { dataGrid.setStyle("useRollOver", false); } ]]> </mx:Script> |
