Friday, November 18, 2011

Spark DataGrid Support for Copy selected cell

This article describes how to add support for copy  the Flex DataGrid component.  It enables one to copy the datagrid column from  applications, notably spreadsheet apps like Excel.

The implementation enables copying the selected cell value using Custom Itemrender. That itemrender is the label component.


Here is the code:


CopyDatgridCell.mxml



<?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">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
<s:ArrayCollection id="userColl">
<fx:Object key="1000" name="Abrasive" price="100.11" call="false"/>
<s:DataItem key="1405" name="File" price="150.05" call="true"/>
<s:DataItem key="1606" name="Gouge" price="160.06" call="false"/>
<s:DataItem key="1007" name="Hook" price="170.07" call="true"/>
<s:DataItem key="1708" name="Ink" price="180.08" call="false"/>
<s:DataItem key="1009" name="Jack" price="190.09" call="true"/> 
<s:DataItem key="1801" name="Brush" price="110.01" call="true"/>
<s:DataItem key="1002" name="Clamp" price="120.02" call="false"/>
<s:DataItem key="1303" name="Drill" price="130.03" call="true"/>
<s:DataItem key="1604" name="Epoxy" price="140.04" call="false"/>
</s:ArrayCollection>
</fx:Declarations>
<s:Label x="71" y="24" fontFamily="Verdana" fontSize="26"
text="Adobe Flex 4.5 Spark DataGrid single cell copy"/>
<s:DataGrid id="copyCellData" x="71" y="58" width="350" dataProvider="{userColl}"
selectionMode="singleCell"> 
<s:columns> 
<s:ArrayList>
<s:GridColumn dataField="key" headerText="KEY" itemRenderer="Renders.LabelRender" />
<s:GridColumn dataField="name" headerText="NAME" itemRenderer="Renders.LabelRender"/>
<s:GridColumn dataField="price" headerText="PRICE"/>
<s:GridColumn dataField="call" headerText="CALL"/>
</s:ArrayList>
</s:columns> 
</s:DataGrid> 
</s:Application>


Here is the code for  Itemrender:

LabelRender.mxml


<?xml version="1.0" encoding="utf-8"?>
<s:GridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx" clipAndEnableScrolling="true" >
<fx:Script>
<![CDATA[
override public function prepare(hasBeenRecycled:Boolean):void {
lblData.text = data[column.dataField]
}
]]>
</fx:Script>
<mx:Label id="lblData" left="7" top="9"  selectable="true" />
</s:GridItemRenderer>









No comments:

Post a Comment