Monday, November 14, 2011

Spark Datagrid

Adobe Flex 4.5 has some really exciting new things in it. Among them my favorite is the new Spark DataGrid component.




The Spark DataGrid control provides the following features:
  • Interactive column width resizing
  • Control of column visibility
  • Cell and row selection
  • Single item and multiple item selection modes
  • Customizable column headers
  • Cell editing
  • Column sorting
    Adobe Flex 4.5 Spark Datagrid
    Here is the Code for Spark Datagrid

    <?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:Declarations>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
    <s:ArrayCollection id="userColl"> 
    <fx:Object  SNO="1" USERNAME="FLEX" EMAIL="flex@gmail.com"/> 
    <fx:Object  SNO="2" USERNAME="PHOTO SHOP" EMAIL="photoshop@gmail.com"/>
    <fx:Object  SNO="3" USERNAME="CSS" EMAIL="css@gmail.com"/>
    <fx:Object  SNO="4" USERNAME="JAVA" EMAIL="java@gmail.com"/>
    <fx:Object  SNO="5" USERNAME="PHP" EMAIL="php@gmail.com"/>
    <fx:Object  SNO="6" USERNAME="COLD FUSION" EMAIL="coldfusion@gmail.com"/>
    </s:ArrayCollection> 
    </fx:Declarations>
    <s:Label width="441" height="42" fontFamily="Verdana" fontSize="26"
    text="Adobe Flex 4.5 Spark DataGrid"/>
    <s:DataGrid id="mySparkDatagrid" width="350" dataProvider="{userColl}"> 
    <s:columns> 
    <s:ArrayList>
    <s:GridColumn  dataField="SNO" />
    <s:GridColumn dataField="USERNAME"/>
    <s:GridColumn dataField="EMAIL"/>
    </s:ArrayList>
    </s:columns> 
    </s:DataGrid> 
    </s:Application>








No comments:

Post a Comment