Question

I developing a program like Word. For that I need to write strings into the same “line”, and I also want the ability to format each word/letter/sentence differently, controlling color, size, font, etc.

So I have to calculate the pixel length and height of a string, to put them into a line. But there is a problem with the function (Graphics) MeasureString, this function puts extra length infront/behind a string. This function has also has some problems with white space.

I tried a different StringFormater, but everytime they return too much length or not enough.

Does a function exist to write different formated strings on the Graphics object or a function to calculate the exact pixel length of a string?

Answer 1

First off, this is a fairly tricky problem to solve properly – you may be better off trying to find an existing control (e.g. the RichTextBox) that solves this for you.

That said if you do want to do this then this is more-or-less the correct way to solve this problem, however if you take a look at the MeasureString documentation you will note that the behaviour you are seeing is intentional

The MeasureString method is designed for use with individual strings
and includes a small amount of extra space before and after the string
to allow for overhanging glyphs. Also, the DrawString method adjusts
glyph points to optimize display quality and might display a string
narrower than reported by MeasureString. To obtain metrics suitable
for adjacent strings in layout (for example, when implementing
formatted text), use the MeasureCharacterRanges method or one of the
MeasureString methods that takes a StringFormat, and pass
GenericTypographic. Also, ensure the TextRenderingHint for the
Graphics is AntiAlias.

So it sounds to me like you should instead be using the Graphics.MeasureCharacterRanges Method instead.

Here is a sample I prepared that deals renders some text in two different colours. To try it out just paste it into a new form

protected override void OnPaint(PaintEventArgs e)
{
    // This is where we wish to print our string
    var region = new RectangleF(50, 50, 200, 50);

    // This is the font we wish to use
    var font = new Font("Times New Roman", 16.0F);

    // Draw a string for comparison
    DrawString(e.Graphics, "RedBlack", font, Brushes.Black, new RectangleF(50, 150, 200, 50));

    // Draw the first string and keep a track of the Region it was rendered in
    var first = DrawString(e.Graphics, "Red", font, Brushes.Red, region);

    // Adjust the region we wish to print 
    region = new RectangleF(region.X + first.GetBounds(e.Graphics).Width, region.Y, region.Width, region.Height);

    // Draw the second string
    DrawString(e.Graphics, "Black", font, Brushes.Black, region);

    base.OnPaint(e);
}

private Region DrawString(Graphics g, string s, Font font, Brush brush, RectangleF layoutRectangle)
{
    var format = new StringFormat();
    format.SetMeasurableCharacterRanges(new[] { new CharacterRange(0, s.Length) });

    g.DrawString(s, font, brush, layoutRectangle, format);
    return g.MeasureCharacterRanges(s, font, layoutRectangle, format)[0];
}

This is what it looks like

Note that you need to be careful with clipping – GDI will "wrap" rendered text onto new lines for you by default, however this wont work any more, you will end up with something like this

Also if you try and print out text with different fonts / font sizes then the "bottom" of each of those fonts won’t line up where you expect it to. Try taking a look at Formatting text on a common baseline for some hints on how to deal with that.