BindObjectToDataGrid.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundColor="#EFEFEF" backgroundImage="">

	<mx:Script>
		<![CDATA[
		import mx.collections.ArrayCollection;
		import mx.utils.ArrayUtil;
		
		/**
		 * - Create a custom object ( this could be a custom class object )
		 * - Bind to the two grids
		 */		
		private function bindit():void
		{
			// fill up a mega class
			var myCustomObj:Object = {
				apple : "A fruit",
				banana: "B fruit",
				cherry: "C fruit",
				grape : "G fruit",
				kiwi  : "K fruit",
				lemon : "L fruit"
			};
					
			// bind it horizontally
			var dp_horizontal:Array = ArrayUtil.toArray( myCustomObj );
			grid_1.dataProvider = dp_horizontal.valueOf();
			
			// bind it Name / Value style
			grid_2.dataProvider = objectToDataProvider( myCustomObj );
		}
		
		/**
		 * Convert a class object into an ArrayCollection to be used
		 * as a DataProvider
		 */ 
		private function objectToDataProvider( obj:Object ):ArrayCollection
		{
			// our DataProvider
			var dp:ArrayCollection = new ArrayCollection();
			// get object class info
			var info:Object = mx.utils.ObjectUtil.getClassInfo( obj );	// vo
			// split the class property list into Array
			var propsA:Array = String( info.properties ).split(',');
			// loop over class properties grabbing value and filling up dp
			for( var xx:int = 0; xx <= propsA.length-1; xx++)
			{
				dp.addItem( { name : propsA[ xx ], value : obj[ propsA[ xx ] ] } );
			}
			
			return dp;
		}
		]]>
	</mx:Script>

	<mx:Button x="10" y="10" label="bind class to grids" id="goBtn" click="bindit()" />
	<mx:DataGrid x="10" y="40" id="grid_1"  height="100" width="400"/>
	<mx:DataGrid x="10" y="176" id="grid_2"  width="400" height="100"/>
	
</mx:Application>