Dynamically Adding Text And/Or A Logo To An Image

This example will only show a small taster of what is possible with the .NET Framework GDI+ (Graphic Device Interface).

Why would we want to add text or images to an exisiting image? Well a few uses would be to add our company logo to all images. Maybe we need to add copyright information to some images or even to include our website address on images. Dynamically adding this information to images rather than editing them would be the preferred solution.

In the example below the code that handles the dynamic generation of graphics is held in a seperate GenerateImage.aspx file. This file contains nothing except the first line that links it to its code-behind file which is where the code for dynamically adding our text and logo are. The code has been commented soo have a look through it; dont worry it's very short.

To connect images that are generated dynamically we simply set the ImageUrl property of the Image control (if we're using the <img> tag we set the src property). In the example below we are passing 2 parameters in the query string to our GenerateImage.aspx file. The first is the filename of the image we are going to alter and the second is the text we want added to the image. The page load code would be:

ImageMonoLisa.ImageUrl = "GenerateImage.aspx?Filename=Monolisa.jpg&Text=" + TextBoxML.Text;
ImageVanGogh.ImageUrl = "GenerateImage.aspx?Filename=VanGogh.jpg&Text=" + TextBoxVG.Text;

Within the GenerateImage.aspx we also add our logo to the bottom-right of every image that is dynamically generated.

You can add your own text using the text boxes provided and hitting refresh.