Posted on: May 31, 2010 at 12:00 AM
DataGrid control in Flex4:
The DataGrid control is a MX component. There is no
spark component. DataGrid Control is like a Table in html. The DataGrid control
has following features.
1. You can Re-Size, Sort and customize the column layout.
2. It has customizable column and row headers(optional).
3. It supports for paging.
You can use ArrayList or AvtionScript for creating a DataGrid Control. You will
provide the data to DataGrid control by dataprovider property. The DataGrid is
basically used for showing a data in table format.
The tag of DataGrid control is <mx:DataGrid>.
Example:
|
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"xmlns:s=" library://ns.adobe.com/flex/spark"xmlns:mx=" library://ns.adobe.com/flex/mx"minWidth=" 955" minHeight="600"> <s:layout> <s:VerticalLayout/> </s:layout> <fx:Script><![CDATA[ private function gridinitialize():void {data.dataProvider = [ {aName: 'Bikrant', DOB:'01/01/1986',City: 'Delhi', State:'NewDelhi'},{aName: 'Brijesh', DOB:'15/07/1984',City: 'Noida', State:'Uttar Pradesh'},{aName: 'Gaurav', DOB:'27/06/1989',City: 'Mumbai', State:'Maharashtra'}]; } ]]]> </fx:Script> <s:Panel title="DataGrid Control Example" width="/font>428" height="409"> <mx:DataGrid id="data"initialize="gridinitialize()" x=" 12" y="12"borderColor=" #000000"borderStyle=" solid"chromeColor=" #000000"color=" #90BB2A"fontFamily=" verdana"fontGridFitType=" pixel"symbolColor=" #FFFFFF"textAlign=" center"/&/> <!-- using ArrayList --> <x:DataGrid x="12" y="195"borderColor=" #000000"borderStyle=" solid"chromeColor=" #790303"color=" #000000"fontFamily=" verdana"fontGridFitType=" pixel"symbolColor=" #FFFFFF"textAlign=" center"> <mx:ArrayList> <fx:Object> <fx:aName>Birant</fx:aName> <fx:DOB>01/01/1986</fx:DOB> <fx:City>Delhi</fx:City> <fx:State>New Delhi</fx:State> </fx:Object> <fx:Object> <fx:aName>Brijesh</fx:aName> <fx:DOB>15/07/84</fx:DOB> <fx:City>Noida</fx:City> <fx:State>Uttar Pradesh</fx:State> </fx:Object> <fx:Object> <fx:aName>Gaurav</fx:aName> <fx:DOB>26/06/1989</fx:DOB> <fx:City>Mumbai</fx:City> <fx:State>Maharashtra</fx:State> </fx:Object> </mx:ArrayList> </mx:DataGrid> </s:Panel><</s:Application> |
Output:
Running Application:
To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.
