Sub New

	Public Sub New(ByVal m_Image As Image, ByVal m_X As Integer, _
		ByVal m_Y As Integer, ByVal m_Width As Integer, _
		ByVal m_Height As Integer, ByVal m_Name As Integer)

		m_PuzzlePicture = m_Image
		m_DisplayRect = New Rectangle(m_X, m_Y, m_Width, m_Height)
		Location = New Point(m_X, m_Y)
		Size = New Size(m_Width, m_Height)
		Text = m_Name
		CurrentLoc = m_Name
	End Sub

As a form control, the Tile objects have a few extra properties than the ones you defined, such as Location, Size, and Text. These will come in handy when moving the tiles around the puzzle board, especially the Location and Size properties. Also note that in the code to follow, CurrentLoc always represents the tile's current location and Text, an object property, represents the tile's original location. An object property was used for the latter value in order to increase flexibility in referencing it elsewhere in the app.

This also exemplifies one of the many differences between .NET CF and .NET Framework. In a desktop application, Name is one of the properties that can be set programmatically. In a PDA application, however, Name can be read, but not set. So here, Text is being used instead. This is another good reason to start small and scale up.

The key to chopping up the image into small, moveable pieces is to override the Paint routine for the object. Use it to paint the specific portion of the overall image that relates to this particular tile.

	Protected Overrides Sub OnPaint(ByVal e As PaintEventArgs)
		MyBase.OnPaint(e)
		e.Graphics.DrawImage(m_PuzzlePicture, ClientRectangle, _
		m_DisplayRect, GraphicsUnit.Pixel)
	End Sub

To keep things simple, code has not been added to actually stretch or resize the puzzle. The code above merely shows more of the image, if available. If you want to get a little fancier, you can add some algorithms to the tile creation that resize the image, as well. (In fact, the sample code that comes with VS.NET includes a slide puzzle written for the Pocket PC in C#. It includes a few more features than I'm showing here, as well as some different techniques for creating the puzzle, though it doesn't lend itself quite as easily to multi-platform development.)

The complete code for Tile.vb can be found here.

Building the grid class
Most of the real work happens in the Grid Class, which represents the puzzle itself. It's essentially a collection of Tile objects, along with all of the methods necessary for basic game mechanics. Add a new Class to the project and call it Grid.vb.

First, member declarations. These should be self-explanatory.

Public TileSet As Tile()
 Private m_PuzzlePicture As Image
 Private m_TileRows, m_TileCols, m_BlankTile As Integer
 Private m_TileWidth As Integer
 Private m_TileHeight As Integer

Next, instantiation, which assigns values to all these new variables.

     Public Sub New(ByVal m_Picture As Image, _
          ByVal m_RowCount As Integer, ByVal m_ColCount As Integer, _
          ByVal m_Width As Integer, ByVal m_Height As Integer)

          m_PuzzlePicture = m_Picture
          m_TileRows = m_RowCount
          m_TileCols = m_ColCount
          m_TileWidth = m_Width
          m_TileHeight = m_Height

            Setup()
     End Sub

You'll notice a Setup() routine there at the end. Here's the code for it. This actually creates the puzzle board, with all of its tiles. Notice that no constants appear here.

	Private Sub Setup()

		Dim tileCount As Integer = (m_TileRows * m_TileCols)
		ReDim TileSet(tileCount - 1)
		m_BlankTile = tileCount - 1

		Dim thisX, thisY, thisRow, thisCol, thisTile As Integer
		For thisRow = 0 To m_TileRows - 1
			For thisCol = 0 To m_TileCols - 1
				thisTile = (thisRow * m_TileRows) + thisCol
				thisY = (thisRow * m_TileHeight)
				thisX = (thisCol * m_TileWidth)
				TileSet(thisTile) = New Tile(m_PuzzlePicture, _
					thisX, thisY, m_TileWidth, m_TileHeight, _
					thisTile)
			Next
		Next

		TileSet(m_BlankTile).Visible = False

	End Sub

One thing to notice about the Setup() routine is the last line: It sets the "blank" tile's Visible property to "False". This could just as easily have been added to the form instead of the Grid class. And you may want to do just that, depending on what new features you add to the UI. The reason I add it here is to demonstrate that this is one of those little opportunities for pulling code out of the UI when it works on multiple platforms.

» previous | next |  download | 787.04 KB | Intel Software Network resource center