Porting a simple Silverlight game loop to Windows Phone 8

  • Article

We’re going to have a Game Hackathon tomorrow at the Microsoft Office here in Tampa. For a little diversion, during this Hackathon I’m going to create a little Windows Phone 8 game. All I need is a game loop sample to get me started.

I thought about it for a second tonight, and it hit me: why not port the Silverlight game loop program I've been playing with over to the phone. It should be a snap! (https://blogs.msdn.com/b/jimblizzard/archive/2012/12/13/silverlight-game-loop-revisited-for-windows-8-and-visual-studio-2012-rtm.aspx)

Screen shot

 

Here were the steps I took:

I downloaded my Windows 8 Store app version of the source code from TFService and opened it in Visual Studio 2012. (If you haven't tried TFService yet, you've gotta give it a try. Take a look at https://tfs.visualstudio.com/.)

In another copy of Visual Studio I created a new Windows Phone App project.

Images

I copied the scene.jpg and snowflake.png files from the Windows 8 project into the phone project’s Assets folder.

 

MainPage.xaml and MainPage.xaml.cs

I copied the XAML from MainPage.xaml in the Windows 8 app to MainPage.xaml in the Windows Phone app, starting and ending with the <Canvas></Canvas> tags.

Since the screen sizes are a bit different between Windows 8 and Windows Phone, I adjusted the location of the image to put the lighted tree in the frame. And I moved the controls for Total Snowflakes, Volume, and Wind into the viewing area.

For the code behind file, I simply copied the contents from the Windows 8 app beginning with the List<Snowflake> line to the closing brace for the class.

I added using statements for System.Windows.Media and System.Windows.Media.Animation.

Then I changed both of the RangeBaseValueChangedEventArgs to RoutedPropertyChangedEventArgs<double>

 

Snowflake.xaml and Snowflake.xaml.cs

I added a new user control, calling it Snowflake.xaml, then copied the XAML starting and ending with the <Image></Image> tags.

For the code behind file, I simply copied the contents from the Windows 8 app beginning with double _posLeft = 0.0; line to the closing brace for the class. I didn’t have to make any other code changes in that file.

 

That’s all I had to do. And if you’re copying from the original Silverlight sample code, you probably won’t even have to do that much.

It was super easy and took less than five minutes. Good times. Bring on the Hackathon!