Click here to Skip to main content
Click here to Skip to main content

Creating a HUD In Direct3D / C#: Part 1 - Text

, 22 May 2006
Rate this:
Please Sign up or sign in to vote.
Teaches you how to create a HUD in Direct3D / C# - this first part goes through the basics of creating and rendering text

Introduction

In this series of tutorials, we will create a HUD (Heads-Up Display) in DirectX - this ranges from text, to statistics (FPS, time etc) and then onto more advanced controls such as buttons and textboxes.

Background

The code from these tutorials has been either taken from my Tac-Man game project or created specially for this siste

Using the code

You may use all of the code I provide as how you see fit, except to create another tutorial. You can use it as a sturdy(ish Wink | ;) ) framework for your own applications, or print loads of copies off so that when I'm rich and famous you can sell them for $100 each Wink | ;)

Prerequisites

To do this series of tutorials, you will need:

  • C# Compiler (preferably Visual C# 2005 Express)
  • Managed DirectX 9.0 October SDK

OK, you will need to have completed the base tutorial series or at least have framework capable of setting up Direct3D. It is strongly advised that you at least read the first couple of tutorials from the "Beginning 2D game programming" section to get an understanding of some of the concepts I assume you understand in this tutorial.

Displaying Information

.NET provides a plethoria of GUI objects such as buttons, checkboxes and even calendars etc. However, in DirectX applications, not only are these ugly in a game, but it is also impracticle if not impossible because of DirectX's inability to share... So, most game-developers create their own HUD's, specially designed and coded for that application. In this tutorial we will simply learn how to create a class to display a string to our screen.

First, we obviously need a new class to go in the engine.

In DirectX, we use a sprite to render text, using a font object to define how the string is displayed. We also have other variables defining the text's style (bold, italic etc), size (defined within a rectangle) and color.

So, our class must contain all of the data used to display one "message", and the methods to initialise and render it. In this way, it will be similar to our Sprite class (assuming you have done the 2D tutorials).

public class hMessage
{
//The text to be displayed by the message
public string Text;
// The 2D location (on screen) of the message
public System.Drawing.Point Location;
//The actual font object to use
public Font Style;
public System.Drawing.Color Color; // The color of the text
public hMessage ( Device dev, System.Drawing.Size size, 
                  FontWeight weight, string fontname, 
                  string text, System.Drawing.Point loc,
                  System.Drawing.Color col )
{
Style = new Font ( dev, size.Height, size.Width, weight, 0, false, 
        CharacterSet.Default, Precision.Default, FontQuality.Default, 
        PitchAndFamily.FamilyDoNotCare, fontname );
Text = text;
Location = new System.Drawing.Point ( loc.X, loc.Y );
Color = col;
}
public void Render ( Sprite spr )
{
  Style.DrawText ( spr, Text, Location, Color );
}
}


So, not an overly complicated class, we have the text to display, its location on the screen, the style of font to be used and the color. As you can see, the render function is a wrapper for the Font.DrawText() method, which simply uses a sprite object and other variables affecting a font and displays it, very similar to the Sprite.Draw2D method, except the sprite is taken as an argument instead of being the calling object.

With this class implemented, build your engine and create a new windows application called HUD_1. Do the usual stuff, delete the designer file, have the window class inherit from Engine.gameWindow instead of the standard System.Windows.Forms.Form and change the simple Application.Run() to: 

using (Form1 gameForm = new Form1())
{
  Application.Run(gameForm);
} 
Now, back in your form class, replace the body of it's constructor with a simple call to our Initialise() method, using the standard settings (windowed = true). Add an hMessage object to our class, this will naturally be the object used to display our text.
Attatch an Paint event handler, and add the generic D3D stuff to it, this is:
device.BeginScene ( );
device.Clear ( Microsoft.DirectX.Direct3D.ClearFlags.Target, 
               Color.Black, 1.0f, 0 );

device.EndScene ( );
device.Present ( );
this.Invalidate ( );
The purpose behind doing this has already been explained in previous tutorials, so I will not go into it in detail here (for more information look at Beginning 2D Game Programming, Tutorials 1-2). Now, after the Clear() call, we need to add a function to draw our text. Pop in a sprite object to our class definition (I will call mine aSprite, nice and unique), and add the following line after Clear():

aMessage.Render ( aSprite );

Now, the only thing we need to do is initialise these members. In the Main class' using body, before the call to Application.Run(), initialise our sprite, the only member here is a link to the form's inherited Microsoft.DirectX.Direct3D.Device object, and then initialise our font member. As we created this class, you should understand the process, but for an idea of sizing / location etc I will provide the call used in the sample below:
gameForm.aMessage = new hMessage ( gameForm.device, 
         new System.Drawing.Size ( 48, 40 ), 
         FontWeight.Normal, "Ariel", "HELLO \nWORLD", 
         new System.Drawing.Point ( 50, 400 ), 
         System.Drawing.Color.Yellow ); 

You should now be able to run the application. I advise you to use this as a base to start playing around with different locations / sizes to give you an idea of the call.

See you in Tutorial 2, where we will learn to use / modify our class to display an application's "Vital Statistics", such as elapsed time, lives, and even graphics card information.


 For more Managed DirectX Tutorials on HUDS, 2D and 3D game programming and heightmapping, please visit my site http://www.just-code-it.net

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

Share

About the Author

James Gupta
Web Developer
United States United States
I live in England, UK in a small town which only just got broadband...
 
In my spare time, I run a small website design, hosting and maintenance business at www.jamesgupta.com

Comments and Discussions

 
GeneralMy vote of 1 PinmemberPaul Soloveychik23-Sep-12 2:16 
Questionwhats up? PinmemberLamar Seifuddin29-Aug-11 13:50 
GeneralMy vote of 1 PinmemberMember 79867437-Jun-11 5:00 
GeneralMountain out of a mole hill Pinmemberbamboozle12-Jan-07 15:03 
GeneralRe: Mountain out of a mole hill PinmemberArthur M.20-Feb-08 13:08 
QuestionAny pre-built HUD images? PinmemberJun Du23-May-06 5:19 
AnswerRe: Any pre-built HUD images? PinmemberJames Gupta23-May-06 9:19 

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

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

| Advertise | Privacy | Mobile
Web03 | 2.8.140827.1 | Last Updated 22 May 2006
Article Copyright 2006 by James Gupta
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid