Home arrow XML arrow Page 3 - Working with Flex and Datagrids

Customizing the Column Headers - XML

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.

  1. Working with Flex and Datagrids
  2. Adding Data
  3. Customizing the Column Headers
  4. Hiding Columns
By: Keith Lee
Rating: starstarstarstarstar / 6
June 30, 2009

print this article



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.

<mx:DataGridColumn width="45" dataField="firstName"/>


>>> More XML Articles          >>> More By Keith Lee

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort


- Google Docs and Xpath Data Functions
- Flex Array Collection Sort and Filtering
- The Flex Tree Control
- Flex List Controls
- Working with Flex and Datagrids
- How to Set Up Podcasting and Vodcasting
- Creating an RSS Reader Application
- Building an RSS File
- An Introduction to XUL Part 6
- An Introduction to XUL Part 5
- An Introduction to XUL Part 4
- An Introduction to XUL Part 3
- An Introduction to XUL Part 2
- An Introduction to XUL Part 1
- XML Matters: Practical XML Data Design and M...

Developer Shed Affiliates


Dev Shed Tutorial Topics: