[RESOLVED] Need Help Aligning Text in Image

[Krenshau]

I am making my own captcha image and I have it pretty much working, but I can't figure out how to align the text in the image. I tried using a stringformat, but I can't quite get it lined up right. If someone could tell me where I am going wrong, it would help me out a lot.

Here is the code I am working with.

    Private Sub CreateImage()

        Dim equation As String = GetEquation()
        Dim bitMap As New Bitmap(150, 30, Imaging.PixelFormat.Format32bppArgb)
        Dim font As New Font("Arial", 22, FontStyle.Bold, GraphicsUnit.Pixel)
        Dim rect As New Rectangle(0, 0, 150, 30)
        Dim sf As New StringFormat(StringFormatFlags.NoWrap)

        sf.Alignment = StringAlignment.Center
        sf.LineAlignment = StringAlignment.Center

        Dim g As Graphics = Graphics.FromImage(bitMap)

        Dim b As New SolidBrush(Color.LightBlue)
        Dim pen As New Pen(Color.Black)

        g.SmoothingMode = Drawing2D.SmoothingMode.AntiAlias
        g.FillRectangle(Brushes.Beige, rect)
        g.DrawRectangle(pen, rect)

        g.DrawString(equation, font, Brushes.Blue, 0, 0, sf)

        Response.ContentType = "image/jpeg"
        bitMap.Save(Response.OutputStream, Imaging.ImageFormat.Jpeg)

        g.Dispose()
        bitMap.Dispose()

    End Sub

Thank you.

[ForumAccount]

Can you provide a bit more details on what you are trying to achieve in terms of lining up the text? Where? What is your code doing wrong? What should it be doing? What have you tried?

[Krenshau]

Thank you for your reply.

This is basically a custom captcha method. It creates an image with two random numbers and a plus sign so that the user adds the two numbers and enters it into the textbox. The equation is created in the GetEquation() method.

The code above creates the image correctly and the two numbers, but when I first put the code together from various tutorials it showed the equation in the upper left hand corner of the image. I want the equation to be centered so I did some googling and found that I should be able to use a stringformat to align the equation. Unfortunately, instead of centering the equation it puts it above and to the left of the image so it only shows a little bit of the end. Obviously, this is the wrong direction from where I wanted to go, but I haven't been able to find anything to show me how to correct the problem.

That's why I am posting here. Messing with graphics is not something I have done, so I am kind of at a loss for what to do.

[jmcilhinney]

If you expect the string to be centred then you have to tell it what to be centred to. You're only specifying an X and Y position so presumably that is using that point as the centre. If you want text to be centred on an Image then you should specify the entire bounding Rectangle of the Image as the area for the text and then it will be centred within that Rectangle.

[Krenshau]

Thank you jmcilhinney.

I understood what you said, but I wasn't sure how to make it happen. Your second sentence clued me in, though. Here is the correct code.

    Private Sub CreateImage()

        Dim equation As String = GetEquation()
        Dim bitMap As New Bitmap(150, 30, Imaging.PixelFormat.Format32bppArgb)
        Dim font As New Font("Arial", 22, FontStyle.Bold, GraphicsUnit.Pixel)
        Dim rect As New Rectangle(0, 0, 150, 30)
        Dim sf As New StringFormat(StringFormatFlags.NoWrap)

        sf.Alignment = StringAlignment.Center
        sf.LineAlignment = StringAlignment.Center

        Dim g As Graphics = Graphics.FromImage(bitMap)

        Dim b As New SolidBrush(Color.LightBlue)
        Dim pen As New Pen(Color.Blue)

        g.SmoothingMode = Drawing2D.SmoothingMode.AntiAlias
        g.FillRectangle(b, rect)
        g.DrawRectangle(pen, rect)

        g.DrawString(equation, font, Brushes.Black, rect, sf)

        Response.ContentType = "image/jpeg"
        bitMap.Save(Response.OutputStream, Imaging.ImageFormat.Jpeg)

        g.Dispose()
        bitMap.Dispose()

    End Sub

Notice in the g.DrawString method I have rect instead of just the X, Y parameters. I didn't know that I could do that.

Thank you for your help.

[jmcilhinney]

I would suggest that the more correct way to create your Rectangle would be:

Dim rect As New Rectangle(Point.Empty, bitMap.Size)

Now your Rectangle will simply be the bounds of the Image, no matter what. If you happen to change the size of the Image at some point you don't have to remember to change the size of the Rectangle too, which is good programming.

[Krenshau]

Thank you for that additional tip. I will change that.