XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s...

32
XNA for Fun and Profit St Bede’s College Rob Miles Department of Computer Science University of Hull

Transcript of XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s...

Page 1: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

XNA for Fun and Profit

St Bede’s College

Rob Miles

Department of Computer Science

University of Hull

Page 2: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

2

Agenda

• Computer Games

– How Computer Games work

• XNA

– What is XNA?– The XNA Framework– Very Silly Games– Making a game in sixty minutes

• Why everyone should be writing games!

Page 3: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

3

The Video Game Business

• Bigger than the movies?

– GTA4 sales topped half a billion dollars in its first week of release, 5 times the earnings of the Iron Man movie

• Set to grow even more?

– It is now easy (and cheap) to write a game in your bedroom and make it available to every Xbox Live subscriber in the world

– The games industry is looking for new kind of games

Page 4: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

4

• Games that are very silly and sociable

• Easy to create and understand

• Mainly for multiple players

• Some games are “Zero Graphics”

• Based on examples in:

Learn Programming Now! with Microsoft® XNA™ Game Studio 3.0

by

Rob Miles

Page 5: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

“Hide the Gamepad”

Page 6: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

6

Sample XNA 2D game“Bread and Cheese”

• We are going to make a simple “casual” game

• The player guides the cheese around with the bread, hitting the tomatoes but avoiding the peppers and tangerines

• This is a simple, 2D, sprite based game

Page 7: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

“Bread and Cheese”

Page 8: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

8

Computer Game Construction

• Every game that has ever been written does these things:

1. Initialise all the resources at the start

• This is where the “Loading” screen comes from

2. Repeatedly runs the game loop:

a) Update the game world

• read the controllers, update the state and position of the things in the game

b) Draw the game word for the player to see

• Display the game elements on the screen

Page 9: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

9

Starting with our Cheese

• To begin writing our game we can make some cheese bounce around the screen

• To draw some cheese the game needs to remember two things

– The picture to draw– The position on the screen to draw it

• In programs these are called variables

Texture2D cheeseTexture;

Rectangle cheeseRectangle;

Page 10: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

10

Games and Resources

• Modern games contain thousands of content items:

– Pictures – Sounds– 3D models– Scripts

• A game has to manage all these items so that the program can find and use them cheeseTexture =

Content.Load<Texture2D>("Cheese");

Page 11: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

11

Loading the Cheese Texture

• A game is made up of things that hold information (the variables) and things that do stuff (the methods)

• LoadContent is a method that is called when our game

starts running

• It loads our cheese texture and makes it available for use in the game

protected override void LoadContent()

{

cheeseTexture = Content.Load<Texture2D>("Cheese");

cheeseRectangle = new Rectangle (0, 0, 100,100);

}

Page 12: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

12

Games and Rectangles

• The Rectangle tells us where on the screen the texture is to be drawn

• It gives the position and the size of the draw operation

Creating a Bank Class

x,y

width

height

Page 13: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

13

Positioning the Cheese Texture

• This will draw our cheese image at the top left hand corner and the cheese will be 100 pixels wide and 100 pixels high

• Unlike graph paper, with computer graphics the position of (0,0) is the top left hand corner of the screen

– Increasing the value of Y moves the rectangle down– Increasing the value of X moves the rectangle across

protected override void LoadContent()

{

cheeseTexture = Content.Load<Texture2D>("Cheese");

cheeseRectangle = new Rectangle (0, 0, 100,100);

}

Page 14: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

14

Drawing the Game World

• Now we have our cheese we want to draw it for the player to see

• The game contains a Draw method that is called draw the game display on the screen

• We need to add some program code to tell draw to put our cheese on the screen

• This code will send commands to the Graphics Card in the computer to make it draw the texture

Creating a Bank Class

Page 15: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

15

XNA Game Drawing

protected override void Draw(GameTime gameTime)

{

graphics.GraphicsDevice.Clear(Color.CornflowerBlue);

spriteBatch.Begin();

spriteBatch.Draw(cheeseTexture, cheeseRectangle,

Color.White );

spriteBatch.End();

base.Draw(gameTime);

}

• This version of the Draw method clears the screen to blue and then draws the cheese

Page 16: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

“Cheese Drawing”

Page 17: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

Making things move with the Update method

• At the moment the cheese is always drawn at the same place

• We need to make it move about the screen

• Games do this by having an Update behaviour that makes the game world work

– In a racing game this means moving all the cars on the track, checking for collisions etc

– In a shooting game this means moving all the players, checking to see if any bullets have hit anything etc

• At the moment we are just going to make our cheese move

Page 18: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

18

Stupid XNA Game Update

• We have two integer variables that hold the speed of our cheese

• They are used to update the position of the cheese rectangle when Update is called

int cheeseXSpeed = 3;

int cheeseYSpeed = 3;

protected override void Update()

{

cheeseRectangle.X = cheeseRectangle.X + cheeseXSpeed;

cheeseRectangle.Y = cheeseRectangle.Y + cheeseYSpeed;

}

Page 19: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

“Cheese Moving”

Page 20: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

20

Adding some Bounce to the Cheese

• We want the cheese to bounce off the edge of the screen

• We can do this by changing the sign of the speed value

protected override void Update()

{

cheeseRectangle.X = cheeseRectangle.X + cheeseXSpeed;

if (cheeseRectangle.X < 0 ||

cheeseRectangle.Right > GraphicsDevice.Viewport.Width)

{

cheeseXSpeed = cheeseXSpeed * -1;

}

// Repeat for Y

}

Page 21: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

“Cheese Bouncing”

Page 22: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

22

Creating a bread bat

• Now we need to create a bat texture and then allow the player to control it

• XNA provides support for keyboard and XBOX 360 gamepad

– You can plug a wired gamepad into an PC and it will just work

– You can also get a USB adapter so you can use wireless gamepads

• The gamepad buttons can be tested during the update method

Page 23: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

23

XNA Digital Gamepad Input

GamePadState padState = GamePad.GetState(PlayerIndex.One);

if (padState.IsConnected)

{

if (padState.DPad.Left == ButtonState.Pressed)

{

breadRectangle.X = breadRectangle.X - breadSpeed;

}

if (padState.DPad.Right == ButtonState.Pressed)

{

breadRectangle.X = breadRectangle.X + breadSpeed;

}

/// repeat for bread Y position

}

Page 24: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

24

XNA Analogue Gamepad Input

• This code uses the analogue input of the left thumbstick to update the position of the bread rectangle

int padXSpeed = 10;

int padYSpeed = 10;

if (pad.IsConnected)

{

breadRectangle.X +=

(int) (pad.ThumbSticks.Left.X * padXSpeed);

breadRectangle.Y -=

(int) (pad.ThumbSticks.Left.Y * padYSpeed);

}

Page 25: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

25

Hitting the Cheese

• This code reverses the vertical direction of the cheese when it hits the bread

• It works by detecting when the cheese and bread rectangles intersect

• This is a very simple kind of collision detection

if ( breadRectangle.Intersects(cheeseRectangle))

{

cheeseYSpeed = cheeseYSpeed * -1;

}

Page 26: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

26

Adding Sound

• The sound effect is a WAV file

// Sound effect variable

SoundEffect ding;

// Load the sound effect content in LoadContent

ding = Content.Load<SoundEffect>("Ding");

// Play the sound effect when the bread hits the cheese

if ( breadRectangle.Intersects(cheeseRectangle))

{

cheeseYSpeed *= -1;

ding.Play();

}

Page 27: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

27

Playing Music

• The Music resource is an MP3 file

• Can also play WMA files and music from the media on the device

// Song variable

Song music;

// Load the song content in LoadContent

music = Content.Load<Song>("Music");

// Play the song using the Media Player

MediaPlayer.Play(music);

Page 28: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

“Bread and Cheese”Rob Miles

Page 29: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

29

Getting Started with XNA

• All the software is free:

– Visual Studio 2008 Express Edition– XNA Game Studio 3.1

• Games can be run on the XBOX 360

– You need to join the "Creators Club" in order to do this– Students can get free membership through DreamSpark

• Visit robmiles.com for details on how to get started

Page 30: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

30

Selling your Games

• You can put your XNA games onto Xbox Live

• All Xbox Live subscribers are able to download and play XNA games you have written

• You can even charge money for them

Page 31: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

31

Summary

• The XNA Framework provides a very powerful environment for game creation

– Write games for your Xbox or PC in C# using Visual Studio

• You should all be writing games

– It is easy to do– It is fun!– You might make some money!

Page 32: XNA for Fun and Profit St Bede’s College - Squarespace · XNA for Fun and Profit St Bede’s College ... University of Hull. 2 Agenda •Computer Games –How Computer Games work

32

Resources

• XNA Creators Club:

http://creators.xna.com/

• DreamSpark

https://downloads.channel8.msdn.com/

• Microsoft XNA blogs

http://blogs.msdn.com/xna/

• All the sample code and resource links:

http://www.robmiles.com

• Very Silly Games and book links:

http://verysillygames.com