http://img25.imageshack.us/img25/5109/datagrid.png
I want it to show the IMAGE <Skill_Name>
Like instead of the label being on the bottom, is it possible to be on
the right side of the image?
-=-=--------=-=-=-=-=-=-------------------------------------------------\
---
<mx:DataGrid width="200" height="100%" enabled="false"
left="120" top="10" rowCount="30" dataProvider="{skillArray}">
<mx:columns>
<mx:DataGridColumn headerText=""
dataField="skill">
<mx:itemRenderer>
<mx:Component>
<mx:VBox width="40" height="40"
horizontalGap="1" horizontalAlign="left" verticalAlign="middle">
<mx:Image source="{data.image}"
verticalAlign="left" horizontalAlign="left" scaleContent="false"
maintainAspectRatio="true" />
<mx:Label text="{data.skill}"
verticalCenter="right" />
</mx:VBox>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
----------------------------------------
private var skillArray:Array = [
{skill:'Attack', image:'images/attack.png'},
{skill:'Defence', image:'images/defence.png'},
{skill:'Strength', image:'images/strength.png'},
{skill:'Hitpoints', image:'images/hitpoints.png'},
{skill:'Ranged', image:'images/ranged.png'},
{skill:'Prayer', image:'images/prayer.png'},
{skill:'Magic', image:'images/magic.png'},
{skill:'Cooking', image:'images/cooking.png'},
{skill:'Woodcutting', image:'images/woodcutting.png'},
{skill:'Fletching', image:'images/fletching.png'},
{skill:'Fishing', image:'images/fishing.png'},
{skill:'Firemaking', image:'images/firemaking.png'},
{skill:'Crafting', image:'images/crafting.png'},
{skill:'Smithing', image:'images/smithing.png'},
{skill:'Mining', image:'images/mining.png'},
{skill:'Herblore', image:'images/herblore.png'},
{skill:'Agility', image:'images/agility.png'},
{skill:'Thieving', image:'images/thieving.png'},
{skill:'Slayer', image:'images/slayer.png'},
{skill:'Farming', image:'images/farming.png'},
{skill:'Runecraft', image:'images/runecraft.png'}];
-------------------------