Write Text on Image ( Specified width )

Question

current example

I am generating ICards for employees. I have to write address of the employee on the ICard.

            Image blankICard = Image.FromFile(@"C:\Users\admin\Pictures\filename.jpg");

            Bitmap outputImage = new Bitmap(blankICard.Width, blankICard.Height, System.Drawing.Imaging.PixelFormat.Format32bppArgb);
            System.Drawing.SolidBrush b = new SolidBrush(Color.FromArgb(255, 88, 89, 91));
            using (Graphics graphics = Graphics.FromImage(outputImage))
            {
                graphics.DrawImage(blankICard, new Rectangle(0, 0, blankICard.Width, blankICard.Height),
                new Rectangle(new Point(), blankICard.Size), GraphicsUnit.Pixel);

                Font stringFont = new Font("FreightSans Medium", 20, FontStyle.Regular);

                string address = "Address goes here";

                graphics.DrawString(address, new Font("FreightSans Medium", 20, FontStyle.Regular), b, new Point(621, 234));
                graphics.DrawString("Employee Code:12345678", new Font("FreightSans Medium", 26, FontStyle.Regular), b, new Point(350, 407));
            }

Current Output is shown in the left side of the image. Here what happens that my string goes out of the box.

I want to bind it in the fix size box.

Example is shown in the right side of the Image.

use this overload of drawstring: http://msdn.microsoft.com/en-us/library/21kdfbzs.aspx — Rotem, Mar 16 '12 at 10:36

score 6 · Accepted Answer · answered Mar 16 '12 at 11:11

Use Graphics.DrawString overload that takes Rectangle instead of a point. That way you'll wrap text to fit within specified width.

using (Graphics graphics = Graphics.FromImage(outputImage)){
  // Draw whatever you need first
  // ....
  // Create font...
  graphics.DrawString(employeeCode, font, Brushes.Black,
                       new Rectangle(0, 25, maxWidth, maxHeight);
}

Simple as that :)

score 3 · Answer 2 · edited Aug 19 '22 at 17:39

I made some changes to your code, commenting 2 lines - I did not have the file C:\Users\admin\Pictures\filename.jpg on my pc - That's why blankICard was disabled and so was its Rectangle:

You must set maxWidth in order to wrap your employee code, for example.

//  Image blankICard = Image.FromFile(@"C:\Users\admin\Pictures\filename.jpg");
int width = 500;
int height = 500;
Bitmap outputImage = new Bitmap(width, height,PixelFormat.Format32bppArgb);

SolidBrush b = new SolidBrush(Color.FromArgb(255, 88, 89, 91));
SolidBrush blackBrush = new SolidBrush(Color.Black);

using (Graphics graphics = Graphics.FromImage(outputImage))
{
    graphics.DrawRectangle(new Pen(blackBrush), new Rectangle(0, 0, width, height));
    //  new Rectangle(new Point(), blankICard.Size), GraphicsUnit.Pixel);

    Font stringFont = new Font("FreightSans Medium", 20, FontStyle.Regular);
    string address = "Address goes here";
    string employeeCode = "Employee Code:12345678";

    int maxWidth = 30;
    SizeF sf = graphics.MeasureString(employeeCode, new Font(new FontFamily("FreightSans Medium"), 26), maxWidth);

    graphics.DrawString(address, new Font("FreightSans Medium", 20, FontStyle.Regular), b, new Point(0, 0));
    graphics.DrawString(employeeCode, new Font(new FontFamily("FreightSans Medium"), 26), Brushes.Black,new RectangleF(new PointF(0, 25), sf),StringFormat.GenericTypographic);
    //graphics.DrawString(, new Font("FreightSans Medium", 26, FontStyle.Regular), b, new Point(10, 20));
}

Width is working fine..but the rest of the data has been discarded , i want that data(rest of the data) should come in the down row. — Kishan Gajjar, Mar 16 '12 at 11:42
Sorry , what kind of data are you talking about? In the example I set the maxWidth as 30, but if you increase probably you'll find the rest of the string. PS: I could not test with FreightSans for I did not have this font on my PC. I tested with ARIAL. — ClayKaboom, Mar 16 '12 at 12:33

Write Text on Image ( Specified width )

2 Answers2