Skip to main content

C# Snippet Tutorial - How to Draw Text on an Image [Beginner]


In this snippet tutorial we're going to be adding on to our series of C# image editing tutorials. This tutorial is going to provide the code required to do basic text drawing including anti-aliasing and text alignment.

For more information on C# image editing, check out our previous two tutorials: C# Tutorial - Image Editing: Saving, Cropping, and Resizing and C# Tutorial - Image Editing:Rotate.

Ok, let's get started. The first thing we need to do is get a Bitmap object from an image file.
Bitmap myBitmap = new Bitmap("C:\\\\myImage.jpg");
 
Now that we have a Bitmap object we can get a Graphics object from it. The Graphics object will be doing all of our text drawing.
Bitmap myBitmap = new Bitmap("C:\\myImage.jpg");
Graphics g = Graphics.FromImage(myBitmap);
 
We can now use this Graphics object to perform all of our drawing. Let's start by simply placing some text in the upper left corner.
g.DrawString("My\nText", new Font("Tahoma", 40), Brushes.White, new PointF(0, 0));

This call will place white text in the upper left corner of your image.

Image Width Text Drawn On
It

C# Tutorial - Image Editing: Saving, Cropping, andResizing has lots of information on how to resize and save your new image. It's kind of hard to see in the above example but the edges on that text are a little rough. Let's look at how to anti-alias the text to make it look a little smoother.
g.TextRenderingHint = System.Drawing.Text.TextRenderingHint.AntiAlias;
g.DrawString("My\nText", new Font("Tahoma", 20), Brushes.White, new PointF(0, 0));

Here we set the TextRenderingHint to AntiAlias before we draw the text. Now all consecutive calls to DrawString will output anti-aliased text. Now that we have the basics down for putting text on the image, let's look at how to do some text aligning. We'll start with some horizontal alignment.
StringFormat strFormat = new StringFormat();
strFormat.Alignment = StringAlignment.Center;
g.DrawString("My\nText", new Font("Tahoma", 20), Brushes.White,
    new RectangleF(0, 0, 500, 500), strFormat);
 
The StringFormat class has lots of options for formatting strings, but we're going to be focusing on the ones that control alignment. The Alignment property controls the horizontal alignment and I set it to StringAlignment.Center, which will center the text at the top of the image. I also modified the DrawString function to take a Rectangle, which for simplicity I just set to the entire size of the image. The last argument is the StringFormat object.

Image With Text Centered
Horizontally

So now that we have the text centered horizontally, let's center it vertically. Now the text will be put right in the center of the image.
StringFormat strFormat = new StringFormat();
strFormat.Alignment = StringAlignment.Center;
strFormat.LineAlignment = StringAlignment.Center;
g.DrawString("My\nText", new Font("Tahoma", 20), Brushes.White,
    new RectangleF(0, 0, 500, 500), strFormat);
 
The only thing I added to make this happen was setting the StringFormat.LineAlignment property to StringAlignment.Center.

Image with text in the
center

That's it for drawing text on an image. You can of course make all sorts of neat text effects using Brushes and Formats, but I'll leave all of that up to you. Remember to check out C# Tutorial - Image Editing:Saving, Cropping, and Resizing and C# Tutorial - Image Editing:Rotate for lots of other information on images and C#.

Comments

  1. It's now easy with Textgram- an photo editing app designed to make adding text to photos quick and simple, and as its name suggests, to enable you to share photos that contain text to Instagram. The app offers a large selection of backgrounds, stickers, and filters that only add to the visual attractiveness of the images processed with Textgram.

    ReplyDelete
  2. You Doodle is the best image editing app on Android to create art and draw on photos, text and draw on pictures. Doodling on a friend, or marking up a picture or adding text has never been easier. With it's powerful text tool and simple brush tool, you can draw on photos and add text quickly and easily.

    ReplyDelete

Post a Comment

Popular posts from this blog

C# Snippet - Shuffling a Dictionary [Beginner]

Randomizing something can be a daunting task, especially with all the algorithms out there. However, sometimes you just need to shuffle things up, in a simple, yet effective manner. Today we are going to take a quick look at an easy and simple way to randomize a dictionary, which is most likely something that you may be using in a complex application. The tricky thing about ordering dictionaries is that...well they are not ordered to begin with. Typically they are a chaotic collection of key/value pairs. There is no first element or last element, just elements. This is why it is a little tricky to randomize them. Before we get started, we need to build a quick dictionary. For this tutorial, we will be doing an extremely simple string/int dictionary, but rest assured the steps we take can be used for any kind of dictionary you can come up with, no matter what object types you use. Dictionary < String , int > origin = new Dictionary < string , int >();

C# Snippet - The Many Uses Of The Using Keyword [Beginner]

What is the first thing that pops into your mind when you think of the using keyword for C#? Probably those lines that always appear at the top of C# code files - the lines that import types from other namespaces into your code. But while that is the most common use of the using keyword, it is not the only one. Today we are going to take a look at the different uses of the using keyword and what they are useful for. The Using Directive There are two main categories of use for the using keyword - as a "Using Directive" and as a "Using Statement". The lines at the top of a C# file are directives, but that is not the only place they can go. They can also go inside of a namespace block, but they have to be before any other elements declared in the namespace (i.e., you can't add a using statement after a class declaration). Namespace Importing This is by far the most common use of the keyword - it is rare that you see a C# file that does not h

C# WPF Printing Part 2 - Pagination [Intermediate]

About two weeks ago, we had a tutorial here at SOTC on the basics of printing in WPF . It covered the standard stuff, like popping the print dialog, and what you needed to do to print visuals (both created in XAML and on the fly). But really, that's barely scratching the surface - any decent printing system in pretty much any application needs to be able to do a lot more than that. So today, we are going to take one more baby step forward into the world of printing - we are going to take a look at pagination. The main class that we will need to do pagination is the DocumentPaginator . I mentioned this class very briefly in the previous tutorial, but only in the context of the printing methods on PrintDialog , PrintVisual (which we focused on last time) and PrintDocument (which we will be focusing on today). This PrintDocument function takes a DocumentPaginator to print - and this is why we need to create one. Unfortunately, making a DocumentPaginator is not as easy as