User Guide
DataGrid component (Flash Professional only) 253
Setting styles for an individual column
Color and text styles can be set for the grid as a whole or for a column. You can use the following
syntax to set a style for a particular column:
grid.getColumnAt(3).setStyle("backgroundColor", 0xFF00AA);
Setting header styles
You can set header styles through headerStyle, which is a style property itself. To do this, you
create an instance of
CSSStyleDeclaration, set the appropriate properties on that instance for
the header, and then assign the
CSSStyleDeclaration to the headerStyle property, as shown in
the following example.
import mx.styles.CSSStyleDeclaration;
var headerStyles = new CSSStyleDeclaration();
headerStyles.setStyle("fontStyle", "italic");
grid.setStyle("headerStyle", headerStyles);
Setting styles for all DataGrid components in a document
The DataGrid class inherits from the List class, which inherits from the ScrollSelectList class. The
default class-level style properties are defined on the ScrollSelectList class, which the Menu
component and all List-based components extend. You can set new default style values on this
class directly, and these new settings will be reflected in all affected components.
_global.styles.ScrollSelectList.setStyle("backgroundColor", 0xFF00AA);
To set a style property on the DataGrid components only, you can create a new instance of
CSSStyleDeclaration and store it in _global.styles.DataGrid.
import mx.styles.CSSStyleDeclaration;
if (_global.styles.DataGrid == undefined) {
_global.styles.DataGrid = new CSSStyleDeclaration();
}
_global.styles.DataGrid.setStyle("backgroundColor", 0xFF00AA);
When creating a new class-level style declaration, you will lose all default values provided by the
ScrollSelectList declaration, including backgroundColor, which is required for supporting
mouse events. To create a class-level style declaration and preserve defaults, use a
for..in loop to
copy the old settings to the new declaration.
var source = _global.styles.ScrollSelectList;
var target = _global.styles.DataGrid;
for (var style in source) {
hGridLines
Both A Boolean value that indicates whether to show horizontal
grid lines (
true) or not (false). The default value is false.
vGridLineColor
Both The color of the vertical grid lines. The default value is
0x666666 (medium gray).
hGridLineColor
Both The color of the horizontal grid lines. The default value is
0x666666 (medium gray).
Style Theme Description