Flex 3.0 offers a strong foundation of user interface (UI) controls by which users can harness a great deal of power to create beautiful UIs without having to toil in the details of low level functionality. Of these controls, the DataGrid sets itself apart by offering characteristics similar to a list or tree control (which are also listBase controls), but going further to offer an easy way of displaying columnar data without a complicated interface. In this article, I focus on creating a basic DataGrid and populating it with XML data by using only MXML tags.
Our current DataGrid uses the "of" dataField to name the columns. This may work in many cases, but you'll probably want to name your columns something that may be more descriptive or concise. To modify the column headers, you'll want to use the 'headerText' attribute of the DataGridColumn. So, to set our column names to 'First Name,' 'Last Name' and 'Date of Birth,' we'll modify the DataGridColums to look like this:
Customizing Column Widths
Actionscript does the work of giving our columns a default size. Unfortunately, it has no idea of how wide the column should be in order to give the user the best view. The DataGridColumn tag once again comes to our rescue. In order to set column widths, use the 'width' attribute.
