Video Game Programming Level One – Side Scroller

VIDEO GAME PROGRAMMINGVideo Game

Programming

Level One – Side Scroller

INSTRUCTOR:

<Your Name Here>

VIDEO GAME PROGRAMMING

PART 1 – SideScroller Basics

Objective:Set up the SideScroller game, create the first level with map for the level.

• Step 1 – Game Properties• Step 2 – Level 1 and the Master Map• Step 3 – Save and Test


STEP 1: Set up the Project

• Open the project Sidescroller.fun.• Make sure that all of the Game

Properties are set.1. Compiler: Borland Free Command Line Tools

2. Color Bit Mode: 32-bit

3. Screen Dimensions: 640x480


CONCEPT - MASTER MAP

• In Fun, a Master Map is the main map of the level.

• The world size cannot be bigger than the Master Map, and it doesn't wrap at edges.

• Master Maps do not move.


STEP 2: Level_1 and the Master Map

• Set up Level_1 – Add a Map to Level_1.– Type Main_Map for the name.– Browse for the file name Art Assets\

Maps\mainMap.bmp and set it.– Set this map to be the Master Map.


STEP 3: Save and Test

• Save the Project:– Click on Project and Save.

• Run the Project:– Click on the Build/Run button in the menu bar.

• Results:– The level should display with the Master Map

for the background.


PART 2 – The Player

Objective:Put the Player into the game and create some behaviors to deal with sprite movement and set up the viewport to with the player.

• Step 1 – The Player Ship Actor• Step 2 – Set up the Player Sprite• Step 3 – Viewport Movement• Step 4 – Save and Test


Step 1: The Player Ship Actor

• Add a new Actor and name it PLAYER• Add the first Animation Set

– Type DEFAULT for the name.– For the animation frame use

Assets\Actors\fighter1.bmp– Set the collision Data (ok to use the auto

button)


CONCEPT – Viewport• Some levels in ProjectFUN are bigger

than the screen. This makes it impossible to see what’s ahead on the level, such as enemies or a pitfall.

• ProjectFUN allows you to create a “Viewport” which defines a box around your player that ProjectFUN will use to make the screen follow them.


CONCEPT – Viewport (cont...)• When the player moves up against

the edge of this box, the screen will scroll over to reveal more of the map.

• Viewport Inflation is how much the Viewport will scroll over when there is no more map to show. For example, if the Viewport is at the end of the level, it will “inflate” to reach the end of the map.


CONCEPT – Viewport (cont...)• Viewports are defined on a per-level

basis.• You can find the options for the

Viewport under the ViewPort tab in Level->Properties.


CONCEPT – Main Character

• In ProjectFUN the Main Character is the sprite that the Viewport will follow.

• There can only be one Main Character in a level.

• That means, the player sprite should be made the Main Character.


CONCEPT – Main Character (cont...)

• You will find the Main Character option under the General tab in Sprite->Properties.

• Note: If you don’t have a Main Character, your level will not scroll, so make sure you set it.


STEP 2: Set up the Player Sprite

• Add a sprite to Level_1 and name it Player_Ship.

• Use the PLAYER actor.• Set this sprite to be the Main Character.• This sprite should collide with other sprites

and with the map and ghost collision should be set.


STEP 3: Viewport movement

• Set the Player_Ship sprite as the Main Character (If not already set).

• Set the viewport bounding box bounds and inflation in the Level Properties:


Viewport Properties

• Set the Viewport properties:


STEP 4: Save and Test• Save the Project:

– Click on Project and Save.


• Results:– The level should show with the player ship

sprite inside the viewport.– Note: The player ship will not move at

this point. We haven’t written code for that yet.


PART 3 – Moving the Player

Objective:-Get the Player moving-Add in Wrapping Maps to the game• Step 1 – Write the PlayerMoveFN• Step 2 – Edit Player Sprite• Step 3 – Add a Wrapping Map• Step 4 – Save and Test


CONCEPT: 8-DIRECTIONAL MOVEMENT

• 8-Directional Movement uses the x and y components separately.

• Each component can be negative, zero, or positive.

• The direction given in red would be obtained by using (1, -1) for the direction.


STEP 1: PlayerMoveFNUse:

This Object Function will be used to take input from the arrow keys and move the Player Ship sprite based what keys the player presses.

Create the Function:• Create an Object function called

PlayerMoveFN• Enter the following code for the function

body.


PlayerMoveFN Codeint x = 0;

int y = 0;

if(pKeyboard->IsPressed(DIK_UP)) y -= 1;

if(pKeyboard->IsPressed(DIK_DOWN)) y+= 1;

if(pKeyboard->IsPressed(DIK_LEFT)) x -= 1;

if(pKeyboard->IsPressed(DIK_RIGHT)) x += 1;

This->VectorDirection(x,y);


STEP 2: Edit the Player Sprite

• Right click on the Player Sprite and select Properties.

• Select the Behavior tab.• Click the plus button next to

PlayerMoveFN.• Press the Ok at the bottom of the window.


CONCEPT – WRAPPING MAPS

• Wrapping maps “wrap” around when the edges is reached.

• Can be scrolled constantly or relative to the viewport.

• These serve as a “background” map. They can be smaller than the main map, as they “wrap” to constantly tile across the background.


STEP 3: Wrapping Maps

• Add a map named Wrapping_Map• Use the file wrappingMap.bmp• Set these properties for the scrolling:


STEP 4: Save and Test• Save the Project:

– Click on Project and Save.


• Results:– The Player Ship should move around by

pressing the arrow keys– The stars should scroll in the background– The level should scroll when you move the

player ship around


PART 4 – Aliens!!Objective:

Add an alien probe to the game that will bounce around the map, but pass through the Player’s ship.

• Step 1 – Alien Actor• Step 3 – Alien Sprite• Step 2 – Alien Behaviours• Step 4 – Save and Test


CONCEPT – PEG REGISTERING

• Peg Registering tells ProjectFUN where the center of your actor is.

• Normally, ProjectFUN will assume that the upper-left of the actor is the “center”, so when you move the sprite, it’s really moving the upper-left corner to the (X,Y) position.


CONCEPT – PEG REGISTERING

• Peg Registering tells ProjectFUN to use a point that you choose, as the “center” of the actor.

• This means, ProjectFUN will move the actor to (X,Y) with the center that you chose.


STEP 1: Alien Probe Actor

• Add a new Actor and name it ALIEN_PROBE.

• Add the first Animation Set – Use DEFAULT for the name.– For the animation frame use

Assets\Actors\alienProbe.bmp– Set the collision Data (ok to use the auto

button)


Alien Probe Actor CONTINUED

• Add the second Animation Set – Use EXPLODE for the name.– For the animation frames use

Assets\Actors\Explosion01.bmp,

…\Explosion02.bmp and

…\Explosion03.bmp.

• This Animation Set should be Peg Registered.


STEP 2: Create the Alien Sprite• Create a sprite named Alien_Probe.• Use the ALIEN_PROBE actor.• Set probe to bounce around the map (HINT:

Precise Collision and Reflection can be used).

• Be sure to use a different Display List than the player’s.


STEP 3: Alien Behavior AlienDamageFN

Use:

This function will detect when something collides with the Alien Probe sprite and in that case will play the explosion animation for the alien.

Create the Function:• Create an Object function called

AlienDamageFN.• Enter the following code for the function

body.


AlienDamageFNSprite* player = This->CollisionWithSpritePtr( "Player_Ship" );

if ( player )

{

This->Speed(0);

This->Animation(ALIEN_PROBE_EXPLODE);

}

if ( This->EndOfAnimation(ALIEN_PROBE_EXPLODE) )

This->DeleteFlag(true);


Edit the Alien Sprite• Go to the Alien Probe’s Properties.• Add the AlienDamageFN to the Behavior.• NOTE: This is something that you should

be relatively familiar with at this point, as you’ve seen it every time that a behavior is added to a Sprite. So try to do it on your own.





• Results:– You should see an Alien Probe on your screen,

along with your player ship.– When you run into it, it should explode.


PART 5: Dynamically Creating the Bullets

Objective:– Dynamically create sprites, use a spawning

system and movement patterns for the sprites.

• Step 1 – The Bullet Actor• Step 2 – Create the Master Bullet• Step 3 – Updating the Hotspot• Step 4 – Firing the Bullets• Step 5 – Edit the Player Sprite• Step 6 – Save and Test


CONCEPT – DYNAMIC SPRITE CREATION

• In games, we sometimes need to create sprites while the game is running. For instance, if you’re firing a machine gun we need to create the bullets during the game.

• ProjectFUN allows us to do that, by “copying” a Sprite that we’ve already made.


CONCEPT – DYNAMIC SPRITE CREATION (cont..)

• In ProjectFUN we use what is known as a “master sprite” to make all of our copies.

• Think of it as a blueprint, and we create a real sprite off of that when we need to.


CONCEPT – DYNAMIC SPRITE CREATION (cont..)

• There are a lot of things that you want to set after you’ve made a copy, such as where the copy should be on the screen, or how fast it’s going.

• We’re going to make a function called SpriteCopy to do this for us. (More on this in a few slides.)


CONCEPT – DEBUGGING DYNAMICS

• Because debugging sprites created at game-time is difficult, here are a few tips:1. Make sure you use a different name for the

copy sprite.

2. Make sure that you check collision with this new name, instead of the master sprite’s name.


STEP 1: The Bullet Actor

• Add a new Actor and name it BULLET• Add the first Animation Set

– Use DEFAULT for the name.– For the animation frame use

Art Assets\Actors\playerBullet.bmp– Set the collision Data.


STEP 2: Create the Master Bullet Sprite

• Create a sprite named Bullet_Master and check Unused.

• Use the BULLET actor.• Set this sprite to collide with other

sprites and the map.• Set this sprites display list to be the

same as the ship’s display list (to ensure that the bullet doesn’t collide with the ship).


CONCEPT – HOTSPOTS

• Hotspots are points on a Sprite that ProjectFUN will track for you. For instance, if you have a spot where a bullet should fire out of a ship, a Hotspot will automatically keep track of where that is on the Sprite.


CONCEPT – HOTSPOTS

• Hotspots are useful for when you have different points on a Sprite that need to interact with other things, such as our previous example of a space ship.

• ProjectFUN only lets you have 5 Hotspots on a given frame of animation.


STEP 3: Updating the HotSpot

• Open up the PLAYER Actor and click the dots button that is next to Hotspot 0.

• Select where you want the bullets to fire out of the ship and then save and click the ‘X’ button in the upper right.


STEP 4: Firing the BulletsPlayerFireFN

Use:

PlayerFireFN calls the SpriteCopy function to create a new bullet that will “fire” from the ship.

Create The Function:• Add a new Object Function named PlayerFireFN.

• Now enter the following code into the function body.

• Be sure to add this function to the Player_Ship’s behavior and to update the Player_Ships’s Hotspot


PlayerFireFNif ( pKeyboard->IsTriggered(DIK_SPACE) )

{

SpriteCopy(

"Bullet_Master",

"Bullet",

This->WorldPositionX() + This->HotSpotX(0),

This->WorldPositionY() + This->HotSpotY(0),

0,

10 );

}


STEP 5: Edit the Player Sprite

• Add the PlayerFireFN to the Player_Ship’s Behavior.

• NOTE: Once again, this should be something that you are familiar with at this point.





• Results:– Now the Player Ship should fire a bullet when

the space bar is pressed.


PART 6: Give the Bullets an Effect

Objective:– Make the bullets collide with the alien

ships and delete the bullets when in the event that they go off the screen.

• Step 1 – The Bullet Behaviour• Step 2 – Edit Bullet Master Sprite• Step 3 – Modify Old Functions• Step 4 – Save and Test


STEP 1: Killing the BulletsBulletLifeFN

Use:BulletLifeFN will delete the Bullet when it leaves the viewport

Create The Function:• Add a new Object Function named BulletLifeFN.• Now enter the following code into the function

body.• This should be Used By Sprites


BulletLifeFNif (This->InViewport() == false)

This->DeleteFlag(true);


STEP 2: Edit the Bullet Master Sprite

• Add the BulletLifeFN to the Bullet_Master’s Behavior.


STEP 3: Modify Old FunctionsUpdate AlienDamageFN

Use:

When the Bullet hits the Alien we will want to delete the bullet so we’ll modify the AlienDamageFN.

Update:

• Modify AlienDamageFN with the following code changes


AlienDamageFN (CHANGES)Sprite* projectile = This->CollisionWithSpritePtr( "Bullet" );Sprite* player = This->CollisionWithSpritePtr("Player_Ship" );

if ( player || projectile ){

This->Speed(0); This->Animation(ALIEN_PROBE_EXPLODE);

if ( projectile ) {

projectile->DeleteFlag(true);

}

}





• Results:– When the Alien ships are hit with the bullets

the Alien should explode and the bullet should delete.


PART 7: Alien Movement

Objective:In this part we’ll decrement the number of the players lives when they hit or get hit by an alien and when they hit the cave walls.

•Step 1 – Add the Movement Pattern•Step 2 – Create the Sprite Group•Step 3 – Save and Test


CONCEPT – MOVEMENT PATTERNS

• Movement Patterns are a way of automatically telling a Sprite how to move.

• Sprites with Movement Patterns will start moving for their position on the map, not where you made the Movement Pattern.


STEP 1: Add the Movement Pattern

• Add a movement pattern named alienMP.

• Apply the movement pattern to the alien and remove reflection and map collision.


STEP 2: Create the Aliens

• Create The Aliens Group:– Right-click on the Alien_Probe sprite and select Create

Group. – Draw the shape you want the aliens to occupy.– Place the Alien sprites in position and select

Options/Create Sprites to place the sprites in the group.

– Now select Shapes/Close and enter Aliens for the group name.

– Click OK to create the group.





• Results:– Waves of enemies should spawn throughout

the level.


Part 8: The HUD and Text Objects

Objective:– Create a HUD and display the player’s

score and a timer on it.

• Step 1 – The Head-Up-Display• Step 2 – Displaying Stats on the HUD• Step 3 – Create and Display a Timer• Step 4 – Save and Test


CONCEPT – HEAD-UP DISPLAYS

• The Heads-up Display (HUD) in games is used to provide the player with crucial information, such as ammunition or the number of lives left.

• It stays in one location on the screen and does not scroll with the level.


Step 1: The Head-Up-Display• Add a map to Level_1 named

HUD_Map.• For the image file use

Art Assets\Maps\HUD_Map.bmp• Be sure to change the zOrder to be

the highest of all the objects and set the Ratios to 1.0

• Make this Map invisible.


STEP 2: Displaying Stats on the HUD

• Add a Text Object named Score to Level_1.

• Set the initial value to “Score:”.• Move the left x-position to 40 or so.

VIDEO GAME PROGRAMMINGSTEP 2: Displaying Stats on the

HUDCONTINUED

• Add another Text Object named Score_Num to Level_1.

• Change the Type to Number.• Set the initial value to 0.• Move the left x-position to 110• Modify the Alien_Damage_FN to

have the following bold faced code additions.


Alien_Damage_FN (CHANGES)if ( player || projectile )

{

TextPTR score("Score_Num");

score->Value++;

This->Speed(0);

This->Animation(ALIENPROBE_EXPLOSION);

if ( projectile )

projectile->DeleteFlag(true);

}

VIDEO GAME PROGRAMMINGStep 3: Create and Display a

TimerHUD_Timer_FN

Use:The code in this function will execute once a second to increment the game timer.

Create the Function:• Add an Object Function named HUD_Timer_FN

and set it to execute once a second.• Set it to be Used By Texts• Enter the following code into the function body.


HUDTimerFNThis->Value++;

VIDEO GAME PROGRAMMINGStep 3: Create and Display a

TimerCONTINUED

• Add a Text Object named HUD_Timer to Level_1.

• Set the type to Number and set the initial value to 0.

• Change the left x-position to 150.• Add HUD_Timer_FN to its behavior





• Results:– The HUD should display a timer that is

counting up and the score should increase when the player shoots or hits and alien.


Part 9: Player LivesObjective:

Now we will put in a health for the player. We will also display icons on the HUD for the number of lives remaining.

• Step 1 – Add Lives to the HUD• Step 2 – Player Lives Counter• Step 3 – Level_1 OnStart• Step 4 – Player_Damage_FN• Step 5 – Save and Test


CONCEPT – ARRAYS

• Used to store more than one object of the same type together

• Useful for code that loops through objects to do something to all of them (use “for” loop normally)

• Size does not change.


CONCEPT – GLOBAL DATA

• Value is never automatically reset• Accessed in code just like a temporary

variable• Remember you have to manually

reset these values when your game restarts!


CONCEPT – LOCAL DATA• Local Data is the way that the

ProjectFUN Editor handles keeping custom data per-Sprite.

• Once you apply Local Data to a Sprite, each Sprite will keep its own instance of the Local Data.

• You can access the instance like in this fashion: LocalDataName * GetLocalDataName(Sprite * sprite);


Step 1: Add the Lives to the HUD

• Add a Local Data named Player_Data.• Give it a member named Life_Sprites that

is a 4 element Sprite* array.• Add Player_Data to the Player_Ship

sprite• Now create a sprite group named

Player_Life (set to NOT use same name)• Use PLAYER for the actor and 4 for the

zOrder.


Step 2: Player Lives Counter

• Add an integer Global Data named Player_Lives.

• Set the initial value to 4.


Step 3: Level_1 OnStart

• Add the following code to the Level_1 OnStart to set the sprites in the HUD.


Level_1 OnStartSprite* player = Sprite::Search("Player_Ship");

Player_Data* playerdata = GetPlayer_Data(player);

playerdata->Life_Sprites[0] = Sprite::Search("Player_Life_0");





Step 4: Player_Damage_FN

Use:This function will make the correct number of lives display in the HUD.

Create the Function:• Add an Object Function named

Player_Damage_FN to be used by the player sprite.

• Enter the following code into the function body.


Player_Damage_FNPlayer_Data * pd = GetPlayer_Data(This);

for( int k = 0; k < 4; ++k){

if( Player_Lives > k ) pd->Life_Sprites[k]->Visible( true ); else pd->Life_Sprites[k]->Visible( false );

}





• Results:– The HUD should display 4 sprites that look the

same as the player’s ship to indicate the number of lives remaining.


Part 10: Player Damage

Objective:In this part we’ll decrement the number of the players lives when they hit or get hit by an alien and when they hit the cave walls.

• Step 1 – Add Invulnerability• Step 2 – Update Player_Damage_FN• Step 3 – Update Alien_Damage_FN• Step 4 – Save and Test


CONCEPT – FUN COLLISION AND DAMAGE

• In the ProjectFUN Editor, collision is calculated on a per-frame basis. This means that if a block gets pushed up against a wall, collision is registered every frame.

• This behaviour isn’t useful when you want the player to take damage on the first occurrence of collision.

• This is usually solved by a period of invincibility after the player takes damage.


Step 4: FUN Collision and Damage

• Add Flash_Counter to Player_Data• Set cave walls to collision ID 1• Change Player_Damage_FN to make

player flash when hit with the following code additions

• Change Alien_Damage_FN to not take damage from a flashing player


PlayerDamageFN (ADDITIONS 1/2)

if ( pd->Flash_Counter == 0 ){

if ( This->CollisionWithSprite("Alien_Probe") || This->CollisionWithMap(1) )

{pd->Flash_Counter = 60;

if ( Player_Lives > 0 )Player_Lives -= 1;

}}


PlayerDamageFN (ADDITIONS 2/2)

else

{

This->Visible(!This->Visible());

pd->Flash_Counter -= 1;

if ( pd->Flash_Counter == 0 )

This->Visible(true);

}


Step 4: FUN Collision and Damage

• Change Alien_Damage_FN to not take damage from a flashing player by adding the following code changes to the function.


AlienDamageFN (CHANGES)if ( ( player && GetPlayer_Data(player)->Flash_Counter == 0 )

|| projectile )





• Results:– The player should become invulnerable and

flash when they are hit by an alien.


The Grand Finale

• The Sidescroller Game should be fully completed at this point. Feel free to take a bit of time and enjoy it.

• Don’t forget to think of interesting ways to make the game more fun such as:– Adding new weapons– Creating new kinds of aliens– Inserting different levels

Date post:	01-Jan-2016
Category:	Documents
Upload:	barclay-cain
View:	41 times
Download:	0 times

Video Game Programming Level One – Side Scroller

Documents