Formatting DataGridView Cells

Formatting DataGridView Cells

To customize the appearance of your dataset on a form, you can control the look and orientation of several DataGridView characteristics by setting properties at design time. For example, you can change the default width of cells in the grid, add or remove column headers, change the grid or header background colors, and change the color of the gridlines. The exercise on the next page steps you through some of these useful property settings.

Set data grid view properties at design time

1. Display the form, click the data grid view object (if it is not already selected), and then highlight the Properties window.

2. Click the Columns property, and then click the ellipsis button to open the Columns collection in the Edit Columns dialog box.

   You used this dialog box earlier to delete the Extension column from the Instructors table. (It is used to set property settings for individual columns.) Now you'll use the Edit Columns dialog box to change the default width of the InstructorID column.

   NOTE
   Because InstructorID is currently selected (it is the highlighted column in the Selected Columns list box), you don't need to click it again. However, always remember to select the desired column before you adjust a column property.

3. Set the Width property to 70.

   A width of 70 (measured in pixels) will provide plenty of room for the integer values in the InstructorID column.

4. Click OK to close the Edit Columns dialog box.

   Now you'll set properties that control the appearance of all the columns in the table.

   NOTE
   You use the Edit Columns dialog box to configure individual columns. To modify properties that apply to all the columns in a table, you adjust property settings for the data grid view object in the Properties window.

5. In the Properties window, set the ColumnHeadersVisible property to False.

   Although the column names are somewhat useful in this particular database, sometimes column names don't clearly identify their contents or they contain abbreviations or words that you want to hide from your users. Setting this property removes the column names from the table.

6. Click the AlternatingRowsDefaultCellStyle property, and then click the ellipses button.

   The AlternatingRowsDefaultCellStyle property controls the color that appears in the background of grid cells in alternating rows. Changing this setting produces an alternating effect (white and the color you select) from row to row in the grid. In my opinion, this effect makes it easy to read records in longer tables.

   Visual Studio displays the CellStyle Builder dialog box, a tool used to set the properties of column cells in data grid view tables.

7. Click the BackColor property, click its arrow, then click the Custom tab, and click the light yellow color.

   Your dialog box looks like this:

   

8. Click OK to close the dialog box.

   When you run the program, the rows in the grid will be displayed in alternating white and yellow colors.

   NOTE
   The color that appears around the edges of the cell grid is controlled by the BackgroundColor property. To change the color of all the cells in a grid, you can adjust the DefaultCellStyle property. To change the background color used for the header cells (if you display them), you can modify the ColumnHeadersDefaultCellStyle property.

9. Click the GridColor property, click its arrow, click the Custom tab, and then click Navy (the darkest blue color).

   This property setting controls the color of the gridlines. If you change the background color of the cells, you might also want to modify the gridline color.

   Now you'll run the program to see the effect of your formatting changes.

10. Click the Start Debugging button.

    After a few moments, the grid appears with information from the Instructors table. Your screen looks similar to the one shown on the next page.

    

    Notice that the column headers are missing now and that the first column is a little narrower. Notice also the alternating white and yellow row pattern and the blue gridlines (not discernible in this book, alas, but on the screen).

11. Click the Close button on the form to stop the program.

You might want to scan the Properties window for additional property settings and customizations. There are several possibilities if you look closely at the list of formatting options. Remember, these property settings affect all the columns in a table, not just individual columns.