Recently I’ve decided to publish everything that I consider interesting from my everyday programming life. So this is my first article on this blog, first of many I hope.
What is Graphics object and what is it used for
Before you can draw lines and shapes, render text, or display and manipulate images with GDI+, you need to create a Graphics object. The Graphics object represents a GDI+ drawing surface, and is the object that is used to create graphical images. Following lines of code demonstrate how you can create Graphics object and how to create automatically calculate Image dimensions from the font and the size length.
// Create graphics for rendering Graphics retBitmapGraphics = Graphics.FromImage(new Bitmap(1, 1)); // measure needed width for the image var bitmapWidth = (int)retBitmapGraphics.MeasureString(text, Font).Width; // measure needed height for the image var bitmapHeight = (int)retBitmapGraphics.MeasureString(text, Font).Height; // Create the bitmap with the correct size and add padding Bitmap retBitmap = new Bitmap(bitmapWidth + Padding, bitmapHeight + Padding);
Note that the Font is of type System.Drawing.Font, and the Padding variable is integer variable that we use for padding setting around the text because we don’t want the text to be attached to the borders of the image.
After it is created, a Graphics object may be used to draw lines and shapes, render text, or display and manipulate images. The principal objects that are used with the Graphics object are:
- The Pen class—Used for drawing lines, outlining shapes, or rendering other geometric representations.
- The Brush class—Used for filling areas of graphics, such as filled shapes, images, or text.
- The Font class—Provides a description of what shapes to use when rendering text.
- The Color structure—Represents the different colors to display.
In the next sample of code is demonstrated how can we use the Graphics object to fill the background color, set the smoothing mode, set text rendering hint and how to actually draw the string on the image.
// Set Background color retBitmapGraphics.Clear(BackgroundColor); retBitmapGraphics.SmoothingMode = SmoothingMode.AntiAlias; retBitmapGraphics.TextRenderingHint = TextRenderingHint.ClearTypeGridFit; retBitmapGraphics.DrawString(text, Font, new SolidBrush(TextColor), Padding / 2, Padding / 2); // flush the changes retBitmapGraphics.Flush();
How to use TextImageGenerator
TextImageGenerator is a simple class for easy creating images from text. With TextImageGenerator you can set Font, FontSize, TextColor, BackgroundColor and Padding. The usage is very simple and you can save your images as Jpeg, Bmp, Png, Gif or as a Base64 string which can be very useful if you like to send the image data in JSON object in your MVC project. In the following code snippet it’s demonstrated how to create TextImageGenerator object and use it to create text in image and save it in different formats.
var imageGenerator = new TextImageGenerator(Color.Orange, Color.Black, "Arial", 20, 25); var imageText = "In dwelling, live close to the ground.\nIn thinking, keep to the simple.\nIn conflict, be fair and generous.\nIn governing, don't try to control.\nIn work, do what you enjoy.\nIn family life, be completely present."; imageGenerator.SaveAsJpg("imageJPEG.jpeg", imageText); imageGenerator.SaveAsPng("imagePNG.png", imageText); imageGenerator.SaveAsGif("imageGIF.gif", imageText); imageGenerator.SaveAsBmp("imageBMP.bmp", imageText);
This is the result image: