Draw text to image change bug

Question

I want to create program that draws text on image. For that purpose I used this method:

private static Image DrawText(String text, Font font, Color textColor, Color backColor)
{
    //first, create a dummy bitmap just to get a graphics object
    Image img = new Bitmap(1, 1);
    Graphics drawing = Graphics.FromImage(img);

    //measure the string to see how big the image needs to be
    SizeF textSize = drawing.MeasureString(text, font);

    //free up the dummy image and old graphics object
    img.Dispose();
    drawing.Dispose();

    //create a new image of the right size
    img = new Bitmap((int)textSize.Width, (int)textSize.Height);

    drawing = Graphics.FromImage(img);

    //paint the background
    drawing.Clear(backColor);

    //create a brush for the text
    Brush textBrush = new SolidBrush(textColor);

    drawing.DrawString(text, font, textBrush, 0, 0);

    drawing.Save();

    textBrush.Dispose();
    drawing.Dispose();

    return img;

}

My problem is that I want to draw table in the image, so the table should look like:

I used this library for drawing table And code looks like this method from above

    var table = new ConsoleTable("one", "two", "three")
                 .AddRow("random text';", "random text", "random text")
                 .Configure(o => o.NumberAlignment = Alignment.Left)
                 .ToString();

DrawText(table, new Font("Verdana", 20), Color.Black, Color.White);

And i got this kind of image

Rows are really changed and it doesn't look like table above. I think method DrawText changed something but I don't know what exactly it is? So I need help. Sorry for my bad English

It probably has to do with you drawing it with Verdana. Verdana isn't monospaced so your alignment isn't "guaranteed" like it is when you create that table. — Broots Waymb, May 12 '21 at 20:14
If you really need to draw a table into an image, you can use whatever font you like, but you have to calculate each column's width based on _all_ of the text in that column, and each row's height based on _all_ of the text in that row. See first duplicate. If you are doing this in Winforms and just need to display a table, use `DataGridView` (other duplicate). Of course, you can kludge the result by using a monospaced font, but that doesn't fix the underlying problem with your approach. — Peter Duniho, May 12 '21 at 21:46

score 2 · Accepted Answer · answered May 12 '21 at 20:18

If you don't need Verdana (which isn't a monospaced font), you should be able to fix this by slightly altering your call to DrawText like so:

DrawText(table, new Font(FontFamily.GenericMonospace, 20), Color.Black, Color.White);

I'm not actually super familiar with working with fonts, so using FontFamily.GenericMonospace is sort of my best guess. You should be able to use others though. Wikipedia has a list of them.

Draw text to image change bug

1 Answers1