C# DataGridView visual settings

Question

I'm look for a way to make some changes to the DataGridview in C# shown in this picture:

It consists of two columns and in this case 6 rows.

It's supposed to be an checklist, you are reading: "Battery....ON" and so on. To get the dots between the Left and right column, I'm simply adding many dot's after and in front of each string.

The Battery string looks like this:

"BATTERY...............................".  

The "ON" string on the right column would look like this:

"..............ON"

As you can see, there is still a gap between the dots, how do I get rid of this? CellBorderStyle ist set to:

checklist_dataGridView.CellBorderStyle = DataGridViewCellBorderStyle.SingleHorizontal;

Additionally, there is a slight height difference between the left and right column, this is the result of

checklist_dataGridView.Columns[1].DefaultCellStyle.WrapMode = DataGridViewTriState.True;

This is supposed to to make the right column text go from right to left.

Without this, the right column would only show "..........................."

Is there any better way to align everything properly?

Thanks for your help

Axel R

Edit: I've solved the problem by making a single column and simply counting the width of the string. If the string has not reached the width of the column, there will be one dot added to the string. This works very well for me.

Answer 1

You could get close to the layout you want by using custom cell painting of the gridlines. You could custom paint the bottom gridlines as a green dotted line and skip adding the dots to the cell values. The only difference is that the lines would go across the entire grid horizontally.

First make sure the left column is bottom left aligned, and the right column is bottom right aligned:

checklist_dataGridView.Columns[0].DefaultCellStyle.Alignment = DataGridViewContentAlignment.BottomLeft;
checklist_dataGridView.Columns[0].DefaultCellStyle.ForeColor = System.Drawing.Color.LightGreen;

checklist_dataGridView.Columns[1].DefaultCellStyle.Alignment = DataGridViewContentAlignment.BottomRight;
checklist_dataGridView.Columns[1].DefaultCellStyle.ForeColor = System.Drawing.Color.LightGreen;

To custom paint the cells with a dotted green line on the bottom, you can implement a DataGridView CellPainting handler:

private void checklist_dataGridView_CellPainting(object sender, DataGridViewCellPaintingEventArgs e)
{
    if (e.RowIndex > -1 )
    {
        e.Handled = true;
        e.Graphics.FillRectangle(System.Drawing.Brushes.Black, e.CellBounds);                

        using (Pen p = new Pen(Brushes.LightGreen))
        {
            p.DashStyle = System.Drawing.Drawing2D.DashStyle.Dot;
            e.Graphics.DrawLine(p, new Point(0, e.CellBounds.Bottom - 1), new Point(e.CellBounds.Right, e.CellBounds.Bottom - 1));
        }

        e.PaintContent(e.ClipBounds);
    }
}

Answer 2

Sorry... you can't get rid of the gap because the checklist_dataGridView.DefaultCellStyle.Padding = new Padding(0, 0, 0, 0); doesn't take negative values.

Now to make your original code work I will just add a space dot space dot space dot like " . . . . . . . . ." This way you don't see just the dots on the cell and the text will get wrapped around. Also if you end with a dot on the left cell and start with a dot on the right cell then the gap will be close to the space distance and it will be less noticeable.

Don't forget this so your text wraps:

checklist_dataGridView.AutoSizeRowsMode = DataGridViewAutoSizeRowsMode.AllCells;
checklist_dataGridView.DefaultCellStyle.WrapMode = DataGridViewTriState.True;