Click here to Skip to main content
12,819,538 members (29,731 online)
Click here to Skip to main content
Add your own
alternative version


2 bookmarked
Posted 22 May 2013

Use XNA in Sliverlight, WPXNA (1)

, 22 May 2013 CPOL
Rate this:
Please Sign up or sign in to vote.
How to use XNA in Silverlight

The original post can be found at


I have developed some games on Windows Phone. Here, I'll share my experiences and gradually upload some classes, no good name, I just call it WPXNA. (Some example code may not be stringent enough.)

  • XNA
  • Modify WMAppManifest.xml
  • Modify Namespace
  • World Class
  • Loop
  • Draw
  • Hello


Well, WP8 game developers are already using DirectX/C++ now, if you are looking for a new way of programming, please close this page.

Why use Sliverlight+XNA? Because some people prefer Windows Phone controls, such as Button, or AD plugin does not support XNA.

Of course, in WP7SDK, you can create a Sliverlight+XNA project. I established a World class (also contains some code in the default template), to contain some commonly used code, as shown in the following figure:

Before this class, there are some issues.

Modify WMAppManifest.xml

In this example, NavigationPage property in WMAppManifest.xml file is modified to World.xaml, so World.xaml will be the startup page of the game.

Modify Namespace

Modify the namespace of World.xaml to

World Class

This class will manage all screens, such as: main menu screen, top screen. Of course, it also includes a number of other global functions. Today, this article contains only a portion of the code.


Each game requires a loop, used to update the game data and draw the texture, so here we use the GameTimer class.

private readonly GameTimer timer = new GameTimer ( );

public World ( Color backgroundColor )
: base ( )
  // ...

  this.timer.UpdateInterval = TimeSpan.FromSeconds ( 1.0 / 30 );
  timer.Update += OnUpdate;
  timer.Draw += OnDraw;

  // ...

protected override void OnNavigatedTo ( NavigationEventArgs e )
  // ...

  this.timer.Start ( );

  base.OnNavigatedTo ( e );

UpdateInterval property of GameTimer indicates the update interval. While in OnUpdate and OnDraw method, we can write the code to update and draw. OnNavigatedTo said the World.xaml had been loaded, so Start method of GameTimer is called.


We need to get the GraphicsDevice, we can create a SpriteBatch through the GraphicsDevice, then use the SpriteBatch to draw text and graphics.

private SpriteBatch spiritBatch;
internal readonly Color BackgroundColor;
internal readonly ServiceProvider Services = new ServiceProvider ( Application.Current );
internal readonly GraphicsDevice GraphicsDevice;

public World ( Color backgroundColor )
: base ( )
  // ...

  SharedGraphicsDeviceManager graph = SharedGraphicsDeviceManager.Current;
  this.GraphicsDevice = graph.GraphicsDevice;

  this.BackgroundColor = backgroundColor;
  // ...

protected override void OnNavigatedTo ( NavigationEventArgs e )
  SharedGraphicsDeviceManager.Current.GraphicsDevice.SetSharingMode ( true );
  this.spiritBatch = new SpriteBatch ( this.GraphicsDevice );
  this.Services.AddService ( typeof ( SpriteBatch ), this.spiritBatch );

  // ...

  base.OnNavigatedTo ( e );

In the constructor, we get current GraphicsDevice, and put it in a field. We use the GraphicsDevice to create a SpriteBatch, and save the SpriteBatch to service which is for other classes easier to use (but this example does not use it).

We call the method SetSharingMode in the constructor, the device is set to shared, otherwise SpriteBatch will have no effect.


Now, we try to draw a string. First of all, we need to obtain a font. We use the DrawString method of SpriteBatch to draw the string.
private SpriteFont myfont;

protected override void OnNavigatedTo ( NavigationEventArgs e )
  // ...

  ContentManager content = new ContentManager ( this.Services, "Content" );
  this.myfont = content.Load<SpriteFont> ( @"font\myfont" );

  base.OnNavigatedTo ( e );

private void OnDraw ( object sender, GameTimerEventArgs e )
  this.GraphicsDevice.Clear ( this.BackgroundColor );

  this.spiritBatch.Begin ( );
  this.spiritBatch.DrawString ( this.myfont, "Hello!", new Vector2 ( 10, 10 ), Color.White );
  this.spiritBatch.End ( );

In the above code, you need to call the Unload method of ContentManager to release the resources. Also, you need a ServiceProvider class in the example, but there's no show.

Get the code here, for more contents, please visit WPXNA.


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

United States United States
No Biography provided

You may also be interested in...


Comments and Discussions

-- There are no messages in this forum --
Permalink | Advertise | Privacy | Terms of Use | Mobile
Web02 | 2.8.170308.1 | Last Updated 22 May 2013
Article Copyright 2013 by zoyobar
Everything else Copyright © CodeProject, 1999-2017
Layout: fixed | fluid