Changing the appearance of a grid element

The overall appearance of the grid as well as the appearance of each element in the grid can be modified using either stylesheets or via each grid element's properties.

Changing appearance

The Grid Designer allows the overall appearance of the grid to be modified by using one of the predefined stylesheets and also allows every element in the grid to be selected individually in order to change its appearance via the property grid. For example, in the image below, the background color of the ColumnManagerRow is changed to purple via the property grid.

In code, the appearance of each grid element as well as the overall appearance of the grid can be modified using various properties. For example, a column's background color can be changed by setting its BackColor property.

VB.NET	Copy Code
`GridControl1.Columns( 0 ).BackColor = Color.Pink`

C#	Copy Code
`gridControl1.Columns[ 0 ].BackColor = Color.Pink;`

The above code will change the background color of the first column in the grid to pink thus also changing the background color of every cell contained within the column to pink. If the background color of some of the cells in the first column already had their background color modified, the fact of setting the BackColor property of the column would not have affected those cells because their own BackColor property has been explicitly set. Only cells whose visual properties are left at their default values will be affected (see Ambient Properties topic).

For example, the following code will result in the first two cells of the column to have a background color of blue while all the other cells in the column will have a background color of pink.

VB.NET	Copy Code
`GridControl1.DataRows( 0 ).Cells( 0 ).BackColor = Color.Blue GridControl1.DataRows( 1 ).Cells( 0 ).BackColor = Color.Blue GridControl1.Columns( 0 ).BackColor = Color.Pink`

C#	Copy Code
`gridControl1.DataRows[ 0 ].Cells[ 0 ].BackColor = Color.Blue; gridControl1.DataRows[ 1 ].Cells[ 0 ].BackColor = Color.Blue; gridControl1.Columns[ 0 ].BackColor = Color.Pink;`

The BackColor and ForeColor of each grid element can also have a level of transparency when using the Grid Designer, this is done by adding the level of transparency desired to the RGB of the color as demonstrated in the image below.

UIStyle property

The appearance of the grid control can also be determined by the value of the UIStyle property. By default, when the grid is dropped on the form, it will take on the appearance of the system's theme. To change the appearance of the control, the UIStyle property can be set to Xceed.UI.UIStyle.WindowsXP, Xceed.UI.UIStyle.System (default), Xceed.UI.UIStyle.WindowsClassic, or Xceed.UI.UIStyle.ResourceAssembly.

When the UIStyle property is set to Xceed.UI.UIStyle.System (default), the grid will follow the theme currently being used. If UIStyle is set to Xceed.UI.UIStyle.WindowsXP on non-Windows XP machines, the blue XP theme style will be used. On Windows XP machines, if a classic Windows theme is used, the blue XP theme style will be applied; otherwise, the current XP theme will be used. To force either the blue, olive green, or silver Windows XP theme regardless of the OS, the UIStyle property must be set to Xceed.UI.UIStyle.ResourceAssembly.

When the UIStyle property is set to Xceed.UI.UIStyle.ResourceAssembly, the ResourceAssembly property of the grid must be set to the assembly resource from which the UI style will be loaded.

In the case where the WindowsXP theme is applied to the grid, the values of certain properties, such as BackColor, will not be applied to themed elements such as the ColumnManagerRow and RowSelectorPane.

Things you should consider

Do you want to change the manner in which the foreground of the cell is painted? Handle the cell's Paint event.
Do you want to change the manner in which all aspects (background, foreground and borders) of the cell are painted? Jump to the Custom Painting topic.