Sunday, April 19, 2009

Drawing a 2d image (sprite)

If you compile the default windows game you'll get a blank screen. Woo hoo! But if you show that to someone they will say big deal.

Lets start by just moving a 2D image around on the screen.

Ok so first thing first draw a 2D image.
If you downloaded TheGimp you should create a new image on a transparent background. I suggest you create an image that's 240x240 pixels large.
I'm no artist so my first picture sucked. If you want just download a 2D image or use your favorite image from a 2D game from the SNES (you can easily find these online for free).
Save your file as a tiff or TGA.

Here's the basic stuff you have to do:

1.> Create member level variable of the type AlignedSpriteBatch
AlignedSpriteBatch spriteBatch;
The spriteBatch class is the class that will load all graphics in a batch style (one after the other) into the graphics device that will output to the screen.

2.> Create a member level variable of the type Texture2D
Texture2D carTexture;
A texture is just an image. In a 2D world the word texture doesn't make much sense. The term used to be sprite. In a 3D world a 2D image stamped onto the surface of a 3D image can be used to simulate texture. (Don't belive me? Think about a cube with these two images stamped on different sides- one side looks like wood and the other side looks smooth like plastic).

2.> In the LoadContent method of your game class initialize the spriteBatch object:
spriteBatch = new AlignedSpriteBatch(GraphicsDevice);
See I told you! the alignedspritebatch uses the graphis device

3.> In the LoadContent method initialize the texture content.
catTexture = Content.Load("Cat");

The reason this looks so wierd is that this code will instruct the virtual machine to load the texture named Cat. An important point here- you imported Cat.tga or Cat.png- how the hell did the compiler know which of these two to load? Simple you CAN'T import both Cat.tga and Cat.png into your project. The XNA Content PipeLine changes your content into a propriatary format. I have no idea what that format is but evidently using DirectX this propriatary format is optimized for drawing, scaling, rotateing, and tinting.

4.>
3.>

Setup

First I downloaded and installed some software:
  • C# - Microsoft gives away thier Express versions of thier IDEs. This is great b/c lets face it you were just going to pirate this anyway (or move to a free IDE).
  • XNA -This is simply the templates to let you easily program XBox Live and Games for Windows Games
  • TheGIMP - This is an open source freeware is the equivalent of Photoshop. I know you probably have experience with Photoshop but you can't put something you created with pirated software up for sale. Get used to and start using the GIMP.
If you are wondering about my machine- worry no more- I didn't bother upgrading my machine! It's actually not a very powerful machine. I use a 10.7" Samsung Laptop. (I bought it from CostCo). Her's a pic!:

You simply don't need that powerful of a computer to program even games. I have a desktop incase this gets too powerful but right now I think being able to program on a plane is more important.

XNA

I'm developing an xbox game for fun.
This blog is to chronicle my way through everything.

About two years ago Microsoft created XNA. I started to mess around with creating a game but I stopped to concentrate on work. With all the crisis talk- I've got more time at home so I thought to work on a new game.

My background is I'm a biomedical engineer with experience in J2EE programming. I've worked with a few other languages but most of my experience in J2EE.

This blog is just to chronicle my difficulties and experiences as I move to my goal of publishing a quality game on XBox live.

I hope you can use this as tutorial of sorts as you create an XNA game