ARTICLE

Using SpriteFont In Windows Phone 7

Posted by Mahak Gupta Articles | Windows Phone August 14, 2012
In this article, we will be discuss how to use the SpriteFont class in Windows Phone 7.
Reader Level:
Download Files:
 

In this article, we will be discuss how to use the SpriteFont class in Windows Phone 7. For this follow these steps:

Step 1

First we create a new project in Windows Phone 7:

New Project  -> XNA Game Studio 4.0 -> Windows Phone Game (4.0)

After that we select a name for the project.

Step 2

Now we add a SpriteFont Class to our project. For this first we right-click on the WindowsPhoneGame1Content (Content) like this:

WP7Sprt1.jpg

Add -> New Item -> Sprite Font

We give it a name, in my case TNR.spritefont.

Step 3

 After that we set the property of the Font name and other features in the TNR.spritefont file:

<FontName>Times New Roman</FontName>

Step 4

Now we write the following code in the Game1.cs file:

GraphicsDeviceManager graphics;
SpriteBatch spriteBatch;
string MyText = "My Name Is Mahak Gupta";
SpriteFont timesnewroman;
Vector2 MyTextSize;
Vector2 MyTextPosition;

Here we declare the GraphicsDeviceManager and spriteBatch object. After that we declare the variable MyText and give a value to that variable. Vector 2 has basically two types of coordinates X and Y, and it is used to display the text.

public
Game1()

{

    graphics = new GraphicsDeviceManager(this);

    Content.RootDirectory = "Content";

 

    // Allow portrait mode as well

    graphics.SupportedOrientations = DisplayOrientation.Portrait;

                                 

 

    // Frame rate is 30 fps by default for Windows Phone.

    TargetElapsedTime = TimeSpan.FromTicks(333333);

 

}

Here Content is a property of Game which is as equal as Content Manager and the RootDirectory is the property of the class. In the next line we set the orientation to portrait. So our result is something like that:

WP7Sprt2.jpg

Step 5

Now we write the following code:
spriteBatch = new SpriteBatch(GraphicsDevice);
timesnewroman = this.Content.Load<SpriteFont>("TNR");
MyTextSize = timesnewroman.MeasureString(MyText);


Here we load the content of the program, in my case the content type is SpriteFont and the name TNR is the asset name.

timesnewroman = this.Content.Load<SpriteFont>("TNR");


In this code, MeasureString is the method of the SpriteFont Class. It is used to specify the size of the particular text in pixels.

Step 6

Now we write the following code:

protected override void Update(GameTime gameTime)

{

  

  

    Viewport viewport1 = this.GraphicsDevice.Viewport;

    MyTextPosition = new Vector2((viewport1.Width - MyTextSize.X) / 5,

                               (viewport1.Height - MyTextSize.Y) / 2);

    base.Update(gameTime);

}


We can get the size of the screen with the help of Viewport, which is the property of the GraphicsDevice Class. It provides the width and height property.

Step 7

Now we write the following code:

protected override void Draw(GameTime gameTime)

{

    GraphicsDevice.Clear(Color.PowderBlue);

 

    spriteBatch.Begin();

    spriteBatch.DrawString(timesnewroman, MyText, MyTextPosition, Color.Black);

    spriteBatch.End();

 

    base.Draw(gameTime);

}


With the help of this code the background will be PowderBlue. Here we set the foreground color of the text, upper-left position of the text and the SpriteFont of the text.

The output will be:

WP7Sprt3.jpg


 

COMMENT USING

Trending up