GTCS1Lib:
Tutorial 5: Working With Sprite Sheets

By Ronald and Samuel Cook

back to the main tutorial guide page .

Reference: This is the fifth tutorial on how to work with the GTCS1Lib library. It is assumed you have read and understand the previous four tutorials:

• First Tutorial : GTCS1Lib application structure;
• Second Tutorial: Working with primitives; and
• Third Tutorial : Working with PrimitiveSet
• Fourth Tutorial : Working With Audio

Goals : This tutorial concentrates on describing how to work with Sprite Sheets: 

1. Obtain the example code

• Here is the zip file to the source files and compiled executable of this example.
• Here is the keyboard mapping for the XBOX 360 controller.  
• Here is the main tutorial page for working with GTCS1Lib, and here is the complete documentation of the library: html-page.

Download and unzip the zip file and you will see an ExampleProgram folder. Open the ExampleProgram folder, the EXE folder contains the compiled program and you can double click on the .sln file to work with the source code.

If you double click and run the executable program, you will observe:

However, the sprite will actually be moving, and you can use the dpad on a controller to change the direction he walks in.

2. The Source Code Files/Structure

Take a look at the ExampleProgram folder that you have unzipped and you will see a structure identicle to that of the previous tutorials.

3. The Solution Explorer:

Now double click on the *.sln file in the ExampleProgram folder, to start the project in the IDE. Notice the structure of the SolutionExplorer follows the source code folder structure we have examined:

As illustrated in the above figure, you will notice the Textures folder and the Sprites.png file. The process of including the *.png files into the project works identical to that of *.jpg Texture files, where you would right-mouse-button click on the Resources folder and add the existing Textures folder. Any *.png files can be included in this folder (and thus into your project). 

As in the case for any assets, do not forget to open the associated properties and change the Build Action to Content, and Copy to Output Directory to Copy if newer.

 

Particles: in the
        XNACS1Rectangle.SetTextureSpriteSheet(String SpriteSheetTexture,...)
method, the SpriteSheetTexture refers to names of these *.png files. Notice that as in the case of .jpg image files where we identify the images by their names without the extension, we will also refer the Sprite Sheets by their file names without the .png extension.

4. Examine the Predefined Emitters:

We are finally ready to examine our source code for Sprite Sheets.  To declare a Spirte Sheet use the following code:

public class Game1 : XNACS1Base {             XNACS1Rectangle Sprite;       protected override void InitializeWorld()             {                      Sprite = new XNACS1Rectangle(new Vector2(50,25), 10, 10);           Sprite.SetTextureSpriteSheet("Sprites", 13, 16, 0);           Sprite.UseSpriteSheet = true ;           Sprite.SetTextureSpriteAnimationFrames(0, 0, 1, 0, 5, SpriteSheetAnimationMode.AnimateForward);           Sprite.UseSpriteSheetAnimation = true;      } }

The XNACS1Rectangle.SetTextureSpriteSheet(String SpriteSheetTexture, int numColumns, int numRows, int padding) arguments are pretty straightforward.

• SpriteSheetTexture is the name of the sprite sheet you are going to be using
• numColumns is the number of columns your sprite sheet has
• numRows is the number of rows your sprite sheet has
• padding is the width of the padding between images in pixels

You may also notice this line of code, "Sprite.SetTextureSpriteAnimationFrames(0, 0, 1, 0, 5, SpriteSheetAnimationMode.AnimateForward);" The first five parameters sets the current animation of your Sprite object to a sprite from the sprite sheet, the last parameter enables the Sprite object to animate, forward in this case.

The XNACS1Rectangle.SetTextureSpriteAnimationFrames(int beginX, int beginY, int endX, int endY, int ticksPerFrame, SpriteSheetAnimationMode mode) arguments are a little more confusing.

• beginX is the column you want your animation to start in
• begin Y is the row you want your animation to start in
• endX is the column you want your animation to stop
• endY is the row you want your animation to stop
• ticksPerFrame is how many ticks occur, before frames are switched
• mode is how you want your animations to occur (start to end, end to start, start to end to start)

The following is the code that causes the sprite to change directions when a direction on the dpad is pressed.  It is one example of how you can use the sprite sheet animations.

protected override void UpdateWorld()        {                 if (GamePad.Dpad.Up == ButtonState.Pressed && (Sprite.CurrentSpriteSheetFrameX < 0 || Sprite.CurrentSpriteSheetFrameX > 1))                          Sprite.SetTextureSpriteAnimationFrames(0, 0, 1, 0, 5, SpriteSheetAnimationMode.AnimateForward);                 else if (GamePad.Dpad.Down == ButtonState.Pressed && (Sprite.CurrentSpriteSheetFrameX < 3 || Sprite.CurrentSpriteSheetFrameX > 4))                          Sprite.SetTextureSpriteAnimationFrames(3, 0, 4, 0, 5, SpriteSheetAnimationMode.AnimateForward);                 else if (GamePad.Dpad.Left == ButtonState.Pressed && (Sprite.CurrentSpriteSheetFrameX < 6 || Sprite.CurrentSpriteSheetFrameX > 7))                          Sprite.SetTextureSpriteAnimationFrames(6, 0, 7, 0, 5, SpriteSheetAnimationMode.AnimateForward);                 else if (GamePad.Dpad.Right == ButtonState.Pressed && (Sprite.CurrentSpriteSheetFrameX < 9 || Sprite.CurrentSpriteSheetFrameX > 10))                          Sprite.SetTextureSpriteAnimationFrames(9, 0, 10, 0, 5, SpriteSheetAnimationMode.AnimateForward);        }

Project home page>: The Game-Themed Introductory Programming Project.

Kelvin Sung Computing and Software Systems University of Washington, Bothell ksung@u.washington.edu

Michael Panitz Business And Information Technology Cascadia Community College mpanitz@cascadia.eduu

	This work is supported in part by a grant from Microsoft Research under the Computer Gaming Curriculum in Computer Science RFP, Award Number 15871 and 16531.