2D Graphics in XNA Game Studio Express (Plus, Random numbers in C#)

1. 2D Graphics in XNA Game Studio Express(Plus, Random numbers in C#) Game Design Experience Professor Jim Whitehead January 16, 2009 Creative Commons Attribution 3.0creativecommons.org/licenses/by/3.0

2. Announcements • Second class section has been scheduled • Friday, 12:30-1:40pm • Natural Sciences Annex, room 102 • You can choose to attend either section (or both, if you need more help in a given week) • Tutor help section • Tuesdays, 2-3pm, Jack’s Lounge (Baskin whiteboards) • Drop-in help with homework, project • Homework #1 (Hunt the Wumpus) • Due Wednesday, January 21 • If you haven’t started yet, you are behind • Monday is an academic holiday • Martin Luther King, Jr.

3. Submitting Hunt the Wumpus assignment • For next Wednesday’s class, you need to submit • A printed hardcopy of all your source code for the Hunt the Wumpus game • A printout of a gameplay session of you playing your version of Wumpus • Electronic submission of your source code • Need to submit a ZIP file of your project code • Under Vista • Documents\{user name}\Visual Studio 2008\Projects\{name of your project} • Right click, Send To > Compressed (zipped) Folder • Under XP, may need to install a ZIP program • 7-Zip, http://www.7-zip.org/ • Go to www.wdmanegold.com/class/ • Username/password will be emailed to you shortly, to the email address UCSC has on record • Your @ucsc.edu address, most likely • Click on “Submit homework” • Click “Browse” to find file on your machine • Click “Submit” when ready • Email Bill Manegold if you run into trouble • wdmanegold@gmail.com • Put CMPS 20 in subject line please

4. Global Game Jam • Global Game Jam • www.globalgamejam.org • A worldwide gathering of people to create games • Friday, January 30 (4:30pm)-Sunday, February 1, 7pm • Work in teams to create a game over 48hours • Food provided, free to participate • UCSC is one of the (many worldwide) sites for the jam • Go to ayandeh.cse.ucsc.edu/ggj09/ to register • Space is limited

5. Ungrouped students • According to our records, the following students are not currently in a group • Douglas Carpenter • Brian Diaz • Edwin Franco • Dustin Gay • Adam Hawley • David Jonas • Sean Lynch • Leland Owens • Daniel Valdez • John Wilson • Either find a partner by the end of class, or we will assign you a partner

6. Imagine Cup • Worldwide competition • Microsoft sponsored • Many categories, including game development • Multiple rounds – first round ends March 1 • Games must use XNA Game Studio 3.0 • Games need to address contest theme: • Imagine a world where technology helps solve the toughest problems facing us today. • Would be possible to take your project for CS 20, and enter it into the contest • $25,000 first prize, $10,000 second prize, $5,000 third prize • http://imaginecup.com/

7. Random numbers in C# • Several aspects of Hunt the Wumpus require random numbers • In C#, the Random class creates these • Two steps: • Create an instance of class Random • Random random = new Random(); • System clock millisecond value used for random number seed when no parameters are passed to constructor. • Call Next() on the instance • my_random = random.Next(); • Can place an upper bound on random number by passing parameter to Next() • my_random = random.Next(20); • A random number less than 20

8. Random number code example • A C# program that generates and prints 20 random integers • Show example in Visual C# 2008 static void Main(string[] args) { Random random = new Random(); int my_random; int i; System.Console.WriteLine("Here are 20 random integers, each less than 20."); for (i = 0; i <= 20; i++) { my_random = random.Next(20); // a random number less than 20 System.Console.WriteLine("[{0}]: {1}", i, my_random); } }

9. Converting string to integer • In Hunt the Wumpus, need to gather the number of a room from the user • Moving to a new room, shooting a crooked arrow • Two steps • Read an input string from the user • string my_input = System.Console.ReadLine(); • Convert to an integer • int.TryParse(my_input, out room); • Returns a boolean – true if conversion worked, false if not • Room contains integer if conversion worked (contains 0 on error) • Room is an out parameter, need to use “out” keyword • Cannot pass data into method, only data comes out via an out parameter • There are other ways to convert a string to an integer • int Convert.ToInt32(string)

10. Converting String to Integer code example • Read a line of input • Use int.TryParse to convert to integer • Demonstration in Visual C# 2008 static void Main(string[] args) { string room_input; int room; System.Console.WriteLine("Shooting. Enter destination room."); room_input = System.Console.ReadLine(); if (int.TryParse(room_input, out room) = = true) { System.Console.WriteLine("Shooting arrow into room {0}", room); } else { System.Console.WriteLine("Invalid number - please enter an integer."); } }

11. XNA GSE Game Scaffolding • Scaffolding for a simple XNA GSE game is created when you select a new game project in Visual C# Express • File … New Project … Windows Game (3.0) • Or File … New Project … Xbox 360 Game (3.0) • Can fill-in this scaffolding to create your own game • Creates a class (myGameClass) that includes • Constructor • Initialization • Initialize(), LoadContent() • Update • Update game state every clock tick • Draw • Create display every clock tick • Demonstration of XNA GSE scaffolding in Visual C# 2008 Express

12. XNA GSE Game Scaffolding Microsoft.Xna.Framework.Game # Initialize()# Run()# Tick() Update(gameTime);Draw(gameTime); myGame - graphics: GraphicsDeviceManager- content: ContentManager graphics = new GraphicsDeviceManager(this);Content.RootDirectory = “Content”; + myGame()# Initialize()# LoadContent(loadAllContent: bool)# UnloadContent(unloadAllContent: bool)# Update(gameTime: GameTime)# Draw(gameTime: GameTime) base.Initialize()

13. XNA GSE Game Initialization • Create new myGame • Call to constructor, myGame() • myGame.run() • Initializes game, then, • Runs the main game loop & processes events • Initialization phase of run(), • The following methods are called on myGame • Initialize() • call Initialize() on parent class • Initialize your game state • Create player object, create enemy objects, create object to hold main game state, etc. • LoadContent() • Method used to load textures, create SpriteBatches

14. XNA GSE Main Game Loop • Time elapsed between each clock tick: • Fixed: • 1/60th of a second (16.6667 milliseconds per tick) • myGame.IsFixedTimeStep = true • The default value • Variable: • Adjusts based on the time required to perform previous tick • myGame.IsFixedTimeStep = false • Each clock tick • Run() calls Tick() • Tick() calls Update() then Draw() • You supply Update() and Draw()

15. Update() and Draw() • Update() • Update the state of all objects • Receive input, move player avatar • Compute opponent AI, move opponent objects • Collision detection & consequences • Detect end-of-game or end-of-level condition • Draw() • Re-create the on-screen scene using the up-to-date positions of player, opponent • Advice • Avoid stuffing your entire game into the definition of these two methods • Methods become too big! • Have these methods call out to your player object, opponent objects, etc. • foreach (Opponent o in opponentList) o.update();

16. Getting a 2D Image to Appear on Screen LoadContent() • Create a Texture • A bitmap image • Create a SpriteBatch • Collects all textures being drawn to screen Draw() • Begin the SpriteBatch • Draw texture • Draw() is defined on a SpriteBatch • Adds texture to the SpriteBatch • End the SpriteBatch • Causes textures in SpriteBatch to be drawn to screen

17. Creating a Texture • Create an instance of ContentManager • XNA GSE scaffolding does this for you • Content = new ContentManager(Services) in constructor • Call Load<T> on ContentManager • For 2D sprites, type T is “Texture2D” • This loads an art asset that has been created by the Content Pipeline • In our case, conversion of a 2D bitmap image in PNG or JPG into XNA internal bitmap format • Give the pathname of the bitmap image (e.g., in PNG or JPG) to load • Path is relative to the “Content” directory of the Visual C# project • Note: normally need to escape slash in a string “\\”  \ • Can put “@” at beginning of string to make string “verbatim” • No need to escape slashes in this case • “\\images\\” is the same as @“\images\”

18. Example of creating a texture • Create new bitmap image • In GIMP, Photoshop, etc. • Save to disk, then copy over to Visual C# project • Copy to Visual Studio 2008\Projects\{your project}\{your project}\Content • Go to Solution Explorer in Visual C# Express • Right click on Content folder • Add  Add Existing Item • Pick filename of new bitmap image file • Will now appear in the project file list • Verify that Content Pipeline processed file by building solution (F6) • Build > Build Solution • Create a Texture2D, then load the bitmap image via the content manager: Protected Texture2D m_bullet = null;m_bullet = Content.Load<Texture2D>(@“mushi-bullet”);

19. SpriteBatch • Once a texture has been made, how does this get displayed? • Create a SpriteBatch • Within a clock tick, begin() the batch • Prepares the graphics device for drawing sprites • Draw() the texture as part of the batch • End() the batch • Causes textures to be drawn to the screen • Restores device to how it was before the batch • Typically this is performed in your game’s Draw() method

20. SpriteBatch Example • Draw() inside SpriteBatch is heavily overloaded • 7 different choices protected override void LoadContent(bool loadAllContent) { m_batch = new SpriteBatch(graphics.GraphicsDevice); // Initialize the sprite batch m_bullet = Content.Load<Texture2D>(@"mushi-bullet"); // Create Texture2D } protected override void Draw(GameTime gameTime) { Vector2 loc = new Vector2(120, 120); // Create Vector2 to give location of Texture2D m_batch.Begin(); // Start the batch m_batch.Draw(m_bullet, loc, Color.White); // Add Texture2D to batch. Not yet on screen. m_batch.End(); // Now Texture2D is drawn to screen. }

21. Tinting Sprites • On previous slide, used Color.White in the Draw() method • This gives the tint of the sprite • White indicates use of the original colors • Can choose any other color to tint the sprite • Visual C# Express gives list of predefined colors • Can also defined a Vector3 to give RGB values protected override void Draw(GameTime gameTime) { Vector2 loc = new Vector2(120, 120); // Create Vector2 to give location of Texture2D m_batch.Begin(); // Start the batch m_batch.Draw(m_bullet, loc, Color.Red); // Add Texture2D to batch. Has red tint. m_batch.End(); // Now Texture2D is drawn to screen. }

22. Transparent Sprites • It is possible to make a sprite partially opaque • Colors have RGB, and Alpha (opacity) • Use Vector4 to represent this • Create color by passing Vector4 into constructor protected override void Draw(GameTime gameTime) { Vector2 loc = new Vector2(120, 120); // Create Vector2 to give location of Texture2D Vector4 v4Color = new Vector4(1.0f, 1.0f, 1.0f, 0.5f); // Create Vector4 to create color w/opacity Color color = new Color(v4Color); // Create color from v4Color m_batch.Begin(); // Start the batch m_batch.Draw(m_bullet, loc, color); // Add Texture2D to batch. Is partially opaque m_batch.End(); // Now Texture2D is drawn to screen. }

23. Other Sprite features • Depth ordering • Draw some sprites in front of (behind) others to give depth of field effect • Rotation • Can rotate sprite image to a specific angle • Scaling • Can make sprites larger or smaller • Animated sprites • Need to write code that cycles the animation yourself • Variant of batch.Draw() where you specify a specific rectangle within a Texture2D to draw • Warp effects • Deform the Texture2D before placing on screen

24. Drawing sprites demo • Go to Visual C# Express to show “Shmup Bullet” demo