Click here to Skip to main content
13,354,605 members (57,131 online)
Click here to Skip to main content
Add your own
alternative version


1 bookmarked
Posted 16 Aug 2012

Numeric Pattern Painter

, 16 Aug 2012
Rate this:
Please Sign up or sign in to vote.
Draws a sequence of ascending numbers evenly spaced on a grid system for use on game maps and such.


Creates an image of evenly spaced numeric characters in ascending order following a grid pattern. I created this quick program while designing a game map that needed each box to be identified by a number. This program allowed me to quickly and easily change the numbers that were included, where they were located, and their font, all of which were constantly changing as the map was updated.


Just involves a simple GUI using basic visual studio controls such as ColorDialog and FontDialog. It takes the user's input to calculate the size of the final image document so that every number is evenly spaced on each row and column after taking into account the font style being used and measuring the number as a string.

Using the code

The only input necessary before hitting the "Create Image" button is to set how many columns & rows there are and their width/height in the NumericUpDown boxes. Based on this input and the default values that can be changed for the background color, font color, and the font of the numbers to be drawn, the image will be created and shown to the user in a new form where the user can save the image using the file dropdown from the form's menu.

The bulk of where everything takes place is in the CreateImage method, found in the Form1.cs file, which is called by hitting the CreateImageBtn.

Bitmap CreateImage()
    int totalNumbers = (int)(ColumnNbox.Value * RowNbox.Value);
    int numCounter = 0;
    int width = (int)(ColumnNbox.Value * ColumnWidthNbox.Value);
    int height = (int)(RowNbox.Value * RowHeightNbox.Value);
    Bitmap newImage = new Bitmap(width, height);
    Graphics g = Graphics.FromImage(newImage);
    SolidBrush numBrush = new SolidBrush(FontColorPbox.BackColor);
    SizeF numSize = new SizeF();
    PointF numPt = new PointF();
    for (int r = 0; r < RowNbox.Value; r++)
        for (int c = 0; c < ColumnNbox.Value; c++)
            numSize = g.MeasureString(numCounter.ToString(), characterFont);
            numPt = new PointF((float)((c * ColumnWidthNbox.Value) + (ColumnWidthNbox.Value / 2)),
                (float)((r * RowHeightNbox.Value) + (RowHeightNbox.Value / 2)));
            g.DrawString(numCounter.ToString(), characterFont, numBrush,
                new PointF(numPt.X - numSize.Width/2, numPt.Y - numSize.Height/2));
    return newImage;

Points of Interest

I hadn't had to use the ColorDialog before so I was surprised to find that it doesn't allow the user to set the alpha value of the color. Because of this, I ended up adding a NumericUpDown box used for setting the alpha value separately from selecting the base color from the ColorDialog.


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

United States United States
No Biography provided

You may also be interested in...

Comments and Discussions

-- There are no messages in this forum --
Permalink | Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.180111.1 | Last Updated 16 Aug 2012
Article Copyright 2012 by marshalDavout
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid