Mobile games can be a challenge. Developing games that can take can operate on many platforms is even more difficult.
That is, unless you are using Silverlight and Expression 4!
WOW! Oh, wait a minute, does Silverlight work with the “current’ Internet Mobile Browser (the one in the Win Phone Emulator), I have been told: No.
So, how does Silverlight work in the current Win Phone Emulator? Ummmm? As an out of browser experience.
Out of browser? Wow, is that like out of body? Sort of.
But no matter lets have some fun with Silverlight on the Mobile devices. (Click images to enlarge.)
|Let’s create a rotating triangle, in this simple example (which will take a couple of blog posts to cover), we will draw a triangle using a process that will allow you to use as many of these triangles as the memory will support on the Windows Phone.|
|First, open Visual Studio 2010 that has the Win Phone tools, I am using the Visual Studio 2010 Express for Windows Phone, which is a completely free download for all!
Name your project Geometry to track with this blog
Add a new item and then select the
Do this by right clicking on the Solution (in this case Geometry, but might be different for your project/solution)
Once you are done, click Add and then a xaml and class will be built.
This is the User Control type of xaml.
First of all you will see that there are two files:
Usually it is a good practice to change the names to reflect your project, especially usually you will be living with the name for a long time.
This is what your MainPage.xaml will look like when you start Visual Studio 2010 Express for Windows Phone
There are variations if you are using one of the other Visual Studio 2010 versions.
(Click to enlarge image and Don’t worry, the code will be in a manner that you can copy
|In the triangle.xaml file, replace the code built by default with the code shown in the next cell
This xaml sets up your triangle for rotation
If you looked at the default code, you will see that we have switched from Grid to Canvas.
Think of Canvas for games and art
<— Paste this code into triangle.xaml —>
|Select and delete the default code in the file triangle.cs|
public double RotationAngle
|In the MainPage.CS
Delete the default code and copy the code in the following cell:
loopGame = new Storyboard();
SupportedOrientations = SupportedPageOrientation.Portrait |
void loopGame_Completed(object sender, EventArgs e)
|In the MainPage.xaml
Delete the default code and paste the code in next cell into MainPage.xaml
|Run the code and you will see a triangle rotating on the page
If you get errors, check that you deleted and added the correct code.
What did we learn here?
- That it is easy to create a reusable user control, in this case we made a triangle.
- Connect XAML and C# code (it could be Visual Basic)
- Rotate an object around a point
I will use this example over the next few blog entries so if you put it together, make sure to keep it!
What’s next? Review of the code.