4-Test Diagram Grid

This post shows how to create a background "grid" on the drawing surface. Right click on the TestDiagram window to switch from Design to Code (RC Form > View Code). You can toggle back to the Designer from the Code window using RC Code > View Designer.

First define an attribute for the grid_gap or spacing between grid points and set its value to 10. Add the following code above the form constructor:

// The grid spacing.
public const int grid_gap = 10;

The grid is a BitMap with points draw over its xy coordinates. The schematicCanvas (pictureBox) has a graphics capability which can be accessed from its Paint and Resize events.

Add the following method after the form constructor:

/* **************************** Grid & Snap Methods **************************** */
private void DrawBackgroundGrid()
{
    Bitmap bm = new Bitmap(
        2000,
        2000);
    for (int x = 0; x < 2000; x += grid_gap)
    {
        for (int y = 0; y < 2000; y += grid_gap)
        {
            bm.SetPixel(x, y, Color.DarkGray); //Color.DarkGray);
        }
    }
   
schematicCanvas.BackgroundImage = bm;
}

First a new Bitmap of size 2000x2000 is created. Then, the code loops over the x and y dimensions of the bitmap in steps of grid_gap (10) and uses the SetPixel method to draw each grid point. If you run the code, nothing happens. The DrawBackgroundGrid() method must be called from the Resize() event. From the TestDiagramMainForm design window, select events in the properties window. Double click on the empty space to the right of the Resize event. The code window is opened and a method has been created for the Resize event. Call the DrawBackgroundGrid() method from the new method:

private void MainForm_Resize(object sender, EventArgs e)
{
    DrawBackgroundGrid();
}

Run the program to see the grid on the TestDiagram window.