Formatting the Windows Forms DataGrid Control in VB.NET

Posted in VB.NET | WINDOWS FORMS IN VB.NET November 07, 2019
Tags: Data Grid Control, Formatting the Windows Forms DataGrid Control, vb.net, .NET
Applying different colors to various parts of a DataGrid control can help to make the information in it easier to read and interpret.
  • 4778

Applying different colors to various parts of a DataGrid control can help to make the information in it easier to read and interpret. Color can be applied to rows and columns. Rows and columns can also be hidden or shown at your discretion.

There are three basic aspects of formatting the DataGrid control. You can set properties to establish a default style in which data is displayed. From that base, you can then customize the way certain tables are displayed at run time. Finally, you can modify which columns are displayed in the data grid as well as the colors and other formatting that is shown.

Setting Format Properties at Design Time

As an initial step in formatting a data grid, you can set the properties of the DataGrid itself. These color and format choices form a base from which you can then make changes depending on the data tables and columns displayed.

To establish a default style for the DataGrid control

  • Set the following properties as appropriate:
     
    Property Description
    AlternatingBackColor The BackColor property defines the color of the even-numbered rows of the grid. When you set the AlternatingBackColor property to a different color, every other row is set to this new color (rows 1, 3, 5, and so on).
    BackColor The background color of the even-numbered rows of the grid (rows 0, 2, 4, 6, and so on).
    BackgroundColor Whereas the BackColor and AlternatingBackColor properties determines the color of rows in the grid, the BackgroundColor property determines the color of the nonrow area, which is only visible when the grid is scrolled to the bottom, or if only a few rows are contained in the grid.
    BorderStyle The grid's border style, one of the BorderStyle enumeration values.
    CaptionBackColor The background color of the grid's window caption which appears immediately above the grid.
    CaptionFont The font of the caption at the top of the grid.
    CaptionForeColor The background color of the grid's window caption.
    Font The font used to display the text in the grid.
    ForeColor The color of the font displayed by the data in the rows of the data grid.
    GridLineColor The color of the grid lines of the data grid.
    GridLineStyle The style of the lines separating the cells of the grid, one of the DataGridLineStyle enumeration values.
    HeaderBackColor The background color of row and column headers.
    HeaderFont The font used for the column headers.
    HeaderForeColor The foreground color of the grid's column headers, including the column header text and the plus/minus glyphs (to expand rows when multiple related tables are displayed).
    LinkColor The color of text of all the links in the data grid, including links to child tables, the relation name, and so on.
    ParentRowsBackColor In a child table, this is the background color of the parent rows.
    ParentRowsForeColor In a child table, this is the foreground color of the parent rows.
    ParentRowsLabelStyle Determines whether the table and column names are displayed in the parent row, by means of the DataGridParentRowsLabelStyle enumeration.
    PreferredColumnWidth The default width (in pixels) of columns in the grid. Set this property before resetting the DataSource and DataMember properties (either separately, or through the SetDataBinding method), or the property will have no effect.
    The property cannot be set to a value less than 0.
    PreferredRowHeight The row height (in pixels) of rows in the grid. Set this property before resetting the DataSource and DataMember properties (either separately, or through the SetDataBinding method), or the property will have no effect.
    The property cannot be set to a value less than 0.
    RowHeaderWidth The width of the row headers of the grid.
    SelectionBackColor When a row or cell is selected, this is the background color.
    SelectionForeColor When a row or cell is selected, this is the foreground color.
Note   Keep in mind, when customizing the colors of controls, that it is possible to make the control inaccessible, due to poor color choice (for example, red and green). Use the colors available on the System Colors palette to avoid this issue.

Table Styles and Column Styles


 Once you have established the default format of the DataGrid control, you can customize the colors that will be used when certain tables are displayed within the data grid.
This is achieved through creating instances of the DataGridTableStyles class. Table styles specify the formatting of specific tables, distinct from the default formatting of the DataGrid control itself. Each table may have only one table style defined for it at a time.
Sometimes, you will want to have a specific column look different than the rest of the columns of a given data table. You can achieve this by means of the GridColumnStyles class, which allows you to create a customized set of column styles.
Column styles are related to columns in a dataset in the same way that table styles are related to data tables. Just as each table may only have one table style defined for it at a time, so too can each column only have one column style defined for it, in a given table style - this relationship is defined in the column's MappingName property.
Be aware that if you have created a table style with no column styles added to it, Visual Studio will add default column styles when the form and grid are created at run time. However, if you have created a table style and added any column styles to it, Visual Studio will not create any column styles (and you will need to define column styles and assign them with the mapping name to have the desired columns appear in the grid.)

Since you specify which columns are included in the data grid (by assigning them a column style), it is possible to include columns of data in the dataset that are not displayed in the grid because no column style has been assigned to them. However, keep in mind that, because the data column is included in the dataset, it is possible for a user to programmatically edit the data that is not displayed.
Note   In general, create column styles and add them to the column styles collection before adding table styles to the table styles collection. When you add an empty table style to the collection, column styles are automatically generated for you. Consequently, an exception will be thrown if you try to add new column styles with duplicate MappingName values to the column styles collection.
In some cases, you will want to just tweak one column among a large number of columns (for example, the dataset contains 50 columns and you only want 49 of them). In this case, it is easier to import all 50 columns and programmatically remove one, rather than programmatically adding each of the 49 individual columns you want.

The following procedures assume your form has a DataGrid control bound to a data table. For more information, see Binding the Windows Forms DataGrid Control to a Data Source.

To set the table and column style of a data table at design time

  1. Select the data grid control on your form.
  2. In the Properties window, select the TableStyles property and click the ellipsis button ().
    The DataGridTableStyle Collection Editor opens. In this dialog box you can add and remove table styles, set display and layout properties, and set the mapping name for the table styles.
  3. Add a table style to the collection by clicking the Add button.
  4. Set the mapping name for the table styles in the MappingName property. The mapping name is used to specify which table style should be used with which table.
  5. Add column styles to the table styles you create. To do so, within the DataGridTableStyle Collection Editor, select the GridColumnStyle property and click the ellipsis button ().
    The DataGridColumnStyle Collection Editor opens. In this dialog box, you can add and remove column styles, set display and layout properties, and set the mapping name and formatting strings for the data columns.
    Note   For more information about formatting strings, see Formatting Types.

To set the table and column style of a data table programmatically

  1. Create a new table style and set its properties.
  2. Create a column style and set its properties.
  3. Add the column style to the table style's column styles collection.
  4. Add the table style to the data grid's table styles collection.
  5. In the example below, create an instance of a new DataGridTableStyle and set its MappingName property.
  6. Create a new instance of a GridColumnStyle and set its MappingName (and some other layout and display properties).
  7. Repeat steps 2 through 6 for each column style you want to create.
    The following example illustrates how a DataGridTextBoxColumn is created, because a name is to be displayed in the column. Additionally, you add the column style to the GridColumnStylesCollection of the table style, and you add the table style to the GridTableStylesCollection of the data grid.

Categories

More Articles

    © 2020 DotNetHeaven. All rights reserved.