Click here to Skip to main content
15,885,546 members
Articles / Web Development / ASP.NET
Article

Another Dynamic ASP.NET Text Image

Rate me:
Please Sign up or sign in to vote.
4.77/5 (13 votes)
3 Mar 20041 min read 127.8K   1.4K   44   11
Another article which shows you how to dynamically create an image from text in ASP.NET.

Main page image.

Dynamically drawn text image.

Introduction

I've seen a couple of submissions which address how one can create an image from a text string. These submissions seem to be much more complicated then they need to be. To create an image from a text string, all you have to do is call the function below passing in the string which will be drawn in the image. That's all there is to it.

Background

This was something I stumbled upon and I thought other Code Project readers may find useful.

Using the code

The only function you need is the CreateImage() function below. Just add this function body to your class or application, then call it wherever you want to use it. It's that easy.

C#
// Call the CreateImage() function to save the text entered
// into the text box to a stream which will be
// drawn in the CreateImage() function.
CreateImage( txt_Image.Text ).Save( Response.OutputStream, 
                     System.Drawing.Imaging.ImageFormat.Gif );
C#
// This is the CreateImage() function body.
private static Bitmap CreateImage( string sImageText ) 
{
    Bitmap bmpImage = new Bitmap( 1, 1 );

    int iWidth = 0;
    int iHeight = 0;

    // Create the Font object for the image text drawing.
    Font MyFont = new Font( "Verdana", 24, 
                       System.Drawing.FontStyle.Bold, 
                       System.Drawing.GraphicsUnit.Point );

    // Create a graphics object to measure the text's width and height.
    Graphics MyGraphics = Graphics.FromImage( bmpImage );

    // This is where the bitmap size is determined.
    iWidth = (int)MyGraphics.MeasureString( sImageText, MyFont ).Width;
    iHeight = (int)MyGraphics.MeasureString( sImageText, MyFont ).Height;

    // Create the bmpImage again with the correct size for the text and font.
    bmpImage = new Bitmap( bmpImage, new Size( iWidth, iHeight ) );

    // Add the colors to the new bitmap.
    MyGraphics = Graphics.FromImage( bmpImage );
    MyGraphics.Clear( Color.Navy );
    MyGraphics.TextRenderingHint = TextRenderingHint.AntiAlias;
    MyGraphics.DrawString( sImageText, MyFont, 
                        new SolidBrush( Color.Red ), 0, 0 );
    MyGraphics.Flush();

    return( bmpImage );
}

Make sure you add this assembly reference to the top of your page.

C#
using System.Drawing.Text;

Points of Interest

I added the code for a user to connect to a database (MS Access), so they can pull a string from the database and have it dynamically drawn as an image. You'll have to add the Northwind.mdb or your own database to the project directory and adjust the connection string and query string accordingly. This information can be found in the Button1_Click() function.

Once you have your application drawing images dynamically, you have lots of flexibility to display images and pass information to the user. Some interesting articles on how to pass information inside an image were written by John Corinna.

History

Initial version - 1.0 - 2/26/04.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


Written By
Web Developer
United States United States
Doug graduated college in 2000 with a degree in
Computer Information Systems. Since then Doug
has been working on software engineering projects
mostly for government consulting companies.
The majority of Doug's programming experience is in
windows development using C# and visual C++ with MFC.
Since October 2002, Doug has been using C# and has
been creating C# windows applications and ASP.NET web applications.

Comments and Discussions

 
QuestionWhy same design every time? Pin
HiteshSharma26-Dec-09 6:00
HiteshSharma26-Dec-09 6:00 
GeneralAnother approach Pin
alex2320-Oct-08 1:58
alex2320-Oct-08 1:58 
GeneralPrinting Pin
jcpowell26-Mar-08 13:52
jcpowell26-Mar-08 13:52 
GeneralText image with transparent background Pin
Brokken12-Sep-07 10:51
Brokken12-Sep-07 10:51 
GeneralDynamically generate images in ASP.NET walkthrough tutorial Pin
OmegaCD26-May-06 3:38
OmegaCD26-May-06 3:38 
GeneralClean up Resources Pin
Anonymous4-Aug-05 12:54
Anonymous4-Aug-05 12:54 
GeneralHTML Tags Pin
Rana Imran24-Jul-05 22:47
Rana Imran24-Jul-05 22:47 
Generalcode to dispaly image dynamically in datagrid Pin
sravani21-Sep-04 23:16
sravani21-Sep-04 23:16 
QuestionHow To Show Image In Image Control Pin
Mubi | www.mrmubi.com24-Jun-04 21:35
professionalMubi | www.mrmubi.com24-Jun-04 21:35 
AnswerRe: How To Show Image In Image Control Pin
Manster28-Jun-04 7:59
Manster28-Jun-04 7:59 
AnswerRe: How To Show Image In Image Control Pin
Peter Molnar6-Sep-04 13:31
Peter Molnar6-Sep-04 13:31 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.