Windows Phone 7 Game Design: Placing the image in a specific point

Now you have an image with no background or alpha channel, well that’s nice. What are you going to do with it? If it sits in your picture folder, not doing much.

All right, let’s take a look at placing a specific image in a point certain location. No software telling the image to move, and so forth. This is a blog with many images which requires that you scroll down. The code is attached in zip file at the bottom of blog.

Super exciting goal:

Starting

First open your version of Visual Studio, in my case I am using Visual Studio Express for Windows Phone (VSESP), normally I use Visual Studio 2010 Ultimate, but to keep this simple, I will make use of the VSEWP. Open a new project, and create a Windows Phone 4.0 project, name the project whatever you want.

Once the new project opens you will see the Visual Studio IDE:

Pick Windows Phone 7.1 and then OK

Make sure Solution Explorer is open:

Adding an Image

Add an image to the, use Existing Item after right clicking

Browse to the image you want to use, mine is the fish from the previous blog:

Variables

You will need to add the following variables, find the top of the class and add the two new lines via cut and paste, the t_ and v_ in front of the variables are something that I do to help me remember that one is for texture and one for vectors. The better practice would be to not use the underscore, I used to the underscore in this scenario.

Code Snippet

publicclassGame1 : Microsoft.Xna.Framework.Game

{

GraphicsDeviceManager graphics;

SpriteBatch spriteBatch;

Texture2D t_Fish;

Vector2 v_Fish;

Vectors

The vector needs to be initialized, in the case I selected the “override” as shown in the image:

Here is my code:

Code Snippet

protectedoverridevoid Initialize()

{

// TODO: Add your initialization logic here

v_Fish = newVector2(100, 100);

base.Initialize();

}

Drawing the Fish

Now we need to draw the fish, since you won’t move the fish, you can simply place it into a spriteBatch cycle as shown in the code, for the spriteBatch. Draw, I used the override as shown in the image:

Here is the code:

Code Snippet

protectedoverridevoid Draw(GameTime gameTime)

{

GraphicsDevice.Clear(Color.CornflowerBlue);

// TODO: Add your drawing code here

spriteBatch.Begin();

spriteBatch.Draw(t_Fish,v_Fish,Color.White);

spriteBatch.End();

base.Draw(gameTime);

}

Finally

If both of us got everything right then you should see, and if you are part of the theological practice that uses fish to indicate that you are member this might be pretty exciting, otherwise, for the others reading this, it might be boring. However you should be proud that you have seen how to draw an image in XNA.