Tutorial: View and Column Appearance
- 3 minutes to read
This walkthrough is a transcript of the View and Column Appearance video, available on the DevExpress YouTube Channel.
In this tutorial, you’ll learn about appearance settings used to change the look of grid elements, where to find these settings for Views or individual columns and how to change the View’s paint style so that you can customize theme-drawn elements.
Each View type provides a set of appearance settings objects that specify how to paint its elements. To access the list, expand the View’s GridView.Appearance property in the Properties window. Every sub-property corresponds to a particular element and has the same type, which allows you to specify background and foreground colors, font style and so on.
Specify the grid row background color. Click a row in the preview section and change the corresponding appearance setting in the Property grid. The preview section immediately reflects the changes.
Change appearance settings for data cells in even rows and the changes aren’t reflected by the preview. To enable this style, switch the Enable Appearance EvenRow check box.
You can preview the grid’s data by switching to the Layout Page and clicking the Preview Data button. Even and odd rows are painted using the specified colors.
Return to the Appearance page and select the Empty property in the list box. Fill the View’s empty space with a linear gradient.
The GridControl allows you to specify appearance settings for data cells and headers of individual columns. Change the background color of data cells in the Name column using the GridColumn.AppearanceCell property. Note that the column appearance settings have a higher priority than row appearance settings applied at the grid View level.
Header Panel Appearance
Specify the background and foreground colors and font settings for the header panel.
The AppearanceObject.ForeColor property’s value and AppearanceObject.Font settings are applied to all column headers while the background color is ignored. The reason for this is that column headers are themed elements, painted according to the currently selected look and feel. To enable background color settings, you can change the View’s BaseView.PaintStyleName property to Flat.
After that, you can also change the group panel’s background color. Run the application to see the appearance customization results at runtime.