Thursday 27 March 2008

Pacman Silverlight

Ive have recently been following Ben Coleys article on how to create an XNA pacman game, the first two articles of the series can be found here:



Reading this post got me thinking of how good it would be to create a similar game using Silverlight, so I've decided to try and follow along with Ben's tutorials implementing the game using Silverlight instead of XNA. Hopefully this will work out well.

To develop the game I will be using Silverlight 2.0 Beta and Blend 2.5 Preview, not to forget glorious C# code. :D

So I first started out using the images provided in Ben's article to create the game enviroment and Mr Pacman himself, using the short XAML Code below.






One thing to note here is the "KeyDown" event handler on the UserControl, this is the event that will be handeling all the movement of player.
The inital variables for spriteX, spriteY, moveX, moveY were all set up as in Bens code at the top of the class, so that they can all be used in multiple methods. Along with a creatoutofbounds method, that will create the objects for collision detection.

This createoutofbounds method just creates 46 different rectangles that will act as the walls in the game enviroment and each time the player moves we will then check to see if they have been hit.
I mentioned previously about the KeyDown event, this is virtually the same as how Bens was implemented, except passing in the event args and comparing this to a key value, which would then check the player position and update it if possiable.

To update the position of the image we need to set the XAML Canvas.Top and Canvas.Left attributes to new values, this can be done using the setValue method assosiated with the image, named pacman for obvious reasons.


Before we update the position of the player however a check is done to see if the image will intersect any of the rects we previously created. Rects were used instead of normal rectangles as they have a Intersect method which checks to see if two Rects have intersected on another. So as with bens code a Rect was created in the direction of the player movement and then checked to see if an intersect occours.


Unfortunatly the Intersect method in Silverlight doesnt return boolean values it returns a number of points (i think) if a collision occours, so we contrinually check to see if there are any values assigned to the collision, if so return false.

A counter was also added to the game to act as the timer, an incremented each time the player movers which is then used to replace the image of pacman between having his mouth open and closed so he can gobble down those lovely dots.



Using this code we have been able to create the game board below, with a moving image of packman, with collision detection. I will try to update the game next time Ben releases some code and keep you all updated on the progress.



Unfortuanatly I couldnt figure out how to host the app with it using C# so that will have to wait till later in the week.

1 comment:

Unknown said...

That's a very creative of you! I would like to try it if it's finished ^^ Anyway, nice to know your blog. If you have time, take a visit to my Free Games website.