1. Addison Wesley is an imprint of © 2010 Pearson Addison-Wesley. All rights reserved. Chapter 7 The Game Loop and Animation Starting Out with Games & Graphics in C++ Tony Gaddis

2. Copyright © 2010 Pearson Addison-Wesley 7.1 The Game Loop 1-2 Concept: The game loop is a special loop used in games and animation programs. It synchronizes the refreshing of the screen with the program’s other operations.

3. Copyright © 2010 Pearson Addison-Wesley 7.1 The Game Loop Virtually all games and animation programs have a loop of some sort that continuously performs operations such as –Calculations –Gathering input –Moving objects on the screen –Playing sounds –And so forth In such a program, the loop must allow the screen to be updated at the appropriate time In other words, you must synchronize the loop with the updating of the screen 1-3

4. Copyright © 2010 Pearson Addison-Wesley 7.1 The Game Loop The Dark GDK provides the following functions you can use for synchronizing the loop with the updating of the screen: 1-4

5. Copyright © 2010 Pearson Addison-Wesley 7.1 The Game Loop 1.Disable automatic screen refreshing 2.Establish a refresh rate 3.Test and synchronize the game loop 4.Display graphics 5.Refresh the screen 1-5 Here is the general format of the game loop: Figure 7-1 Game loop code

6. Copyright © 2010 Pearson Addison-Wesley 7.1 The Game Loop The Dark GDK library has a function called dbSyncOff that causes automatic screen updating to start again Not needed very often Can be helpful in some situations For example: –When prompting the user to enter a value during the game loop The prompt won’t display until after the screen is refreshed with the dbSync function To display the prompt and resume the game loop: –Call dbSyncOff just before displaying the prompt –Call dbSyncOn after the user enters a value 1-6 Giving Control Back to the Dark GDK

7. Copyright © 2010 Pearson Addison-Wesley 7.2 Simple Animation 1-7 Concept: A simple way to create an animation is to write a game loop that draws a shape at a different location during each iteration. Be sure to clear the screen of anything displayed during the previous iteration, though!

8. Copyright © 2010 Pearson Addison-Wesley 7.2 Simple Animation Clear the screen Draw the shape Calculate the new XY coordinates Refresh the screen 1-8 Program 7-3 ( MovingBall.cpp ) partial listing Figure 7-2 Output of Program 7-3

9. Copyright © 2010 Pearson Addison-Wesley 7.2 Simple Animation Always clear the screen before drawing a shape Otherwise, all drawings of the shape will appear on the screen 1-9 Clearing the Screen in the Game Loop Figure 7-3 Drawing the ball without clearing the screen

10. Copyright © 2010 Pearson Addison-Wesley 7.3 Controlling Objects with the Keyboard 1-10 Concept: The Dark GDK provides functions that let you know whether certain keys, such as the arrow keys, spacebar, Enter key, and so forth are being pressed. Many games and animation programs allow the user to control objects on the screen with such keys.

11. Copyright © 2010 Pearson Addison-Wesley 7.3 Controlling Objects with the Keyboard 1-11 Games commonly allow the player to use keys on the keyboard to control objects on the screen The Dark GDK provides the functions listed in Table 7-1 for the purpose of detecting whether the user has pressed these keys

12. Copyright © 2010 Pearson Addison-Wesley 7.3 Controlling Objects with the Keyboard Here is an example that determines whether the user is pressing the spacebar: 1-12 If the user is pressing the spacebar –The dbSpaceKey function returns a value of 1 (true) –The message “You pressed the spacebar.” is displayed If the user is not pressing the spacebar –The dbSpaceKey function returns a value of 0 (false) –The message is not displayed

13. Copyright © 2010 Pearson Addison-Wesley 7.3 Controlling Objects with the Keyboard 1-13 Figure 7-4 Example output of Program 7-4 A message is displayed during each iteration of the game loop for the key the user is pressing

14. Copyright © 2010 Pearson Addison-Wesley 7.3 Controlling Objects with the Keyboard 1-14

15. Copyright © 2010 Pearson Addison-Wesley 7.3 Controlling Objects with the Keyboard To move a circle with the arrow keys: Prepare the circle: –Declare and initialize RADIUS constant –Declare and initialize x and y coordinate variables with starting values Prepare the game loop: –Turn on manual refresh –Set the maximum refresh rate 1-15 Letting the User Move an Object

16. Copyright © 2010 Pearson Addison-Wesley 7.3 Controlling Objects with the Keyboard 1-16 Inside the game loop: –Clear the screen –Draw the circle Update x and y values –Check arrow keys: If up arrow key is pressed –Decrement value of y If down arrow key is pressed –Increment value of y If left arrow key is pressed –Decrement value of x If right arrow key is pressed –Increment value of x –Refresh the screen Letting the User Move an Object

17. Copyright © 2010 Pearson Addison-Wesley 7.3 Controlling Objects with the Keyboard Increasing and decreasing the radius of a circle 1-17 Performing Other Operations with the Keyboard

18. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites 1-18 Concept: A sprite is a graphic image that is used as an element in a game. Sprites can be moved and manipulated in various ways.

19. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites The graphic images that perform actions in a computer game are commonly known as sprites To create a sprite, you perform two actions: –Load an image into memory with the dbLoadImage function –Designate the image as a sprite and display it with the dbSprite function Here is the general format of how you call the dbSprite function: 1-19

20. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites SpriteNumber –Is an integer –Assigned to the sprite –In the range 1 through 65,535 –Used to identify the sprite in subsequent operations X and Y –Are integers –Specify the screen coordinates where the sprite’s upper-left corner will be positioned ImageNumber –Is an integer –Number of the image you want to use for the sprite 1-20 Creating a Sprite

21. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites The first statement loads the LadyBug.bmp file as image number 1 The second statement designates that image as sprite number 1, and positions it at the screen coordinates (320, 240) –When this statement executes, the sprite will be displayed on the screen 1-21 Creating a Sprite

22. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites By default, black (RGB = 0, 0, 0) is used as the key color for sprite transparency You can use the dbSetImageColorKey function to designate a different key color Program 7-7 demonstrates how we can set the key color to green, and then display the UFO image on top of the space image 1-22 Creating a Sprite

23. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites 1-23 Figure 7-6 The space.bmp and UFO.bmp images Figure 7-7 Output of Program 7-7

24. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites You can move an existing sprite to a new location on the screen by calling the dbSprite function and passing different values for the X and Y coordinates 1-24 Moving a Sprite

25. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites You can get the current screen coordinates of an existing sprite by –Calling the dbSpriteX and dbSpriteY functions –Passing the sprite number as an argument 1-25 Getting a Sprite’s X and Y coordinates

26. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites You can get the width and height of an existing sprite by –Calling the dbSpriteWidth and dbSpriteHeight functions –Passing the sprite number as an argument 1-26 Getting the Width and Height of a Sprite

27. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites dbRotateSprite rotates a sprite around its insertion point, which by default is the sprite’s upper-left corner 0 through 359 degrees 1-27 Rotating a Sprite SpriteNumber is the number of the sprite you want to rotate Angle is a floating-point value indicating the angle of rotation, in degrees

28. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites 1-28 Rotating a Sprite Figure 7-8 UFO.sprite rotated at different angles

29. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites You can get the angle of a sprite by calling the dbSpriteAngle function with the sprite number you want to get the angle for For example, the following statement: –declares a float variable named angle –Initializes it with sprite number 1’s current angle of rotation 1-29

30. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites By default, a sprite’s insertion point is its upper-left corner You can change the sprite’s insertion point by calling the dbOffsetSprite function Here is the general format of how you call the function: 1-30 Offsetting a Sprite’s Insertion Point SpriteNumber is the number of the sprite you want to offset XOffset is an integer value for the amount you want to offset from the insertion point along the X axis YOffset is an integer value for the amount you want to offset from the insertion point along the Y axis

31. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites 1-31 Offsetting a Sprite’s Insertion Point Figure 7-9 A sprite before and after it has been offset

32. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites You can get the current X offset of a sprite by calling the dbSpriteOffsetX function, passing the sprite number as an argument For example, the following statement stores the X offset of sprite 1 in the variable sprite1OffsetX : 1-32 Offsetting a Sprite’s Insertion Point You can get the current Y offset of a sprite by calling the dbSpriteOffsetY function, passing the sprite number as an argument For example, the following statement stores the Y offset of sprite 1 in the variable sprite1OffsetY :

33. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites The dbHideSprite function prevents a sprite from being displayed 1-33 Showing and Hiding Sprites The dbShowSprite function causes a hidden sprite to be displayed You can hide all sprites with the dbHideAllSprites function And display all hidden sprites with the dbShowAllSprites function You can tell if a sprite is visible with the dbSpriteVisible function Pass sprite number as an argument Returns 1 (true) if visible Returns 0 (false) if hidden

34. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites dbSizeSprite(SpriteNumber, Xsize, Ysize); –Sprite Number –Size in pixels along the X axis –Size in pixels along the Y axis dbStretchSprite(SpriteNumber, Xstretch, Ystretch); –Sprite Number –Percentage to scale along the X axis –Percentage to scale along the Y axis Get the X and Y scale amounts of a sprite with: –dbSpriteScaleX(SpriteNumber); –dbSpriteScaleY(SpriteNumber); 1-34 Resizing a Sprite

35. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites Priority controls the order sprite’s are drawn All sprites have a default priority of 0 Drawn in order they appear in code Change priority with the dbSetSpritePriority function 1-35 Setting a Sprite’s Priority Higher priority sprites are drawn last, regardless of where they appear In the code above, sprite 1 will be drawn last and appear on top of sprites 2 and 3

36. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites Determine whether a sprite exists by calling the dbSpriteExist function –Accepts a sprite number –Returns 1 (true) if sprite exists –Returns 0 (false) if sprite does not exist 1-36 Determining Whether a Sprite Exists

37. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites Call the dbSprite function –Sprite number –X coordinate –Y coordinate –New image number Call the dbSetSpriteImage function –Sprite number –New image number The dbSpriteImage function can get the current image number 1-37 Changing the Sprite Image

38. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites The dbFlipSprite function flips a sprite vertically The dbMirrorSprite function mirrors a sprite horizontally To determine if a sprite is mirrored or flipped call: –dbSpriteFlipped –dbSpriteMirrored Returns 1 (true) Returns 0 (false) 1-38 Flipping and Mirroring a Sprite Figure 7-10 A flipped sprite Figure 7-11 A mirrored sprite

39. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites By default a sprite is set to –Restore its background –Use transparency To disable one or both of these features –Call the dbSetSprite function Sprite Number Back Save Transparency –0 disables the feature –1 enables the feature 1-39 Setting the Back Save and Transparency Features Back Save Enabled, Transparency Disabled Back Save Disabled, Transparency Enabled

40. Copyright © 2010 Pearson Addison-Wesley Sprites are normally opaque Use the alpha value to make the sprite semitransparent Call the dbSetSpriteAlpha function to change the alpha value –0 through 255 Call the dbSpriteAlpha function to get the alpha value 1-40 7.4 Sprites Using a Sprite’s Alpha Value to Change its Opacity Figure 7-12 Example output of the stealthJet program

41. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites Remove a sprite from memory by calling the dbDeleteSprite function For example, this statement removes sprite number 10 from memory. 1-41 Deleting a Sprite from Memory

42. Copyright © 2010 Pearson Addison-Wesley 7.4 Sprites Two ways to copy a sprite: –Pasting and cloning Pasting is dependent on the original sprite Pasted sprites are drawn to the screen immediately Cloning is independent of the original sprite Cloned sprites must be drawn with the sprite function 1-42 Pasting and Cloning Sprites

43. Copyright © 2010 Pearson Addison-Wesley 7.5 Cel Animation and Sprite Sheets 1-43 Concept: You can create a simple animation by displaying a sequence of images one after the other. This can be done by manually loading and displaying separate images, or via an animated sprite sheet.

44. Copyright © 2010 Pearson Addison-Wesley 7.5 Cel Animation and Sprite Sheets 1-44 Simple cel animations are created by displaying a sequence of images, one after the other, in the same location on the screen When played in order, slight changes in each cel create the illusion of movement Figure 7-17 Cel animation images

45. Copyright © 2010 Pearson Addison-Wesley 7.5 Cel Animation and Sprite Sheets 1-45 Simplifying Animation with Sprite Sheets A sprite sheet contains all the frames of an animation sequence in one file Simpler way to store animations Organized into rows and columns Images are displayed from left to right Images are numbered, starting with 1, from left to right Figure 7-18 A sprite sheet Figure 7-19 A sprite sheet with two rows and four columns

46. Copyright © 2010 Pearson Addison-Wesley 7.5 Cel Animation and Sprite Sheets You use the dbCreateAnimatedSprite function to create a single animated sprite from a sprite sheet by specifying a sprite number, file name, columns, rows, and image number 1-46 Playing Sprite Animations with the Dark GDK Once you have created an animated sprite, the dbPlaySprite function can be used to play the animation by specifying a sprite number, start frame, end frame, and delay between frames The dbPlaySprite function does not display the sprite Call the dbSprite function to display an animated sprite

47. Copyright © 2010 Pearson Addison-Wesley 7.6 Sprite Collision Detection 1-47 Concept: A collision between sprites occurs when one sprite’s bounding rectangle comes in contact with another sprite’s bounding rectangle. Collisions between sprites can be detected.

48. Copyright © 2010 Pearson Addison-Wesley 7.6 Sprite Collision Detection Sprites have a bounding rectangle that is the width and height of the image used to display them A collision occurs when bounding rectangles overlap The dbSpriteCollision function can be used to detect collisions between two sprites by passing their sprite numbers as arguments Returns 1 (true) if collisions occur or 0 (false) otherwise Passing 0 as the second argument can detect a collision between the sprite and any other sprite 1-48 Figure 7-20 A sprite displayed inside its bounding rectangle

49. Addison Wesley is an imprint of © 2010 Pearson Addison-Wesley. All rights reserved. Chapter 7 The Game Loop and Animation QUESTIONS ?