The Legend of the Tomato Quest Tutorial - Loading the Player
From SwinGame
So far we've got a graphical window open, a map thats loading and drawing. Now we need to get the Player's character to load into the game, and draw.
Be sure to have completed the tutorials before this, as some of the content in this tutorial is dependent on the completion of previous tutorials.
Contents |
Adding the Sprite to GameResources
We'll be using a character sheet that was made in Charas.Ex, to make your own character sheets, download Charas.Ex, and have a play with the editor. Just make sure to apply a background color that isn't being used on the character's sprite.
If you do decide to make your own sprite, the first thing you'll need to do once you've saved the character sheet, is to make the background transparent.
For example:
Everything apart from the character frames are transparent, you will have to use Photoshop, Gimp or similar graphics application to do this.
Otherwise, download the image above, by right clicking on it, and clicking Save As.
This image must be placed the resources\images\ folder of our project.
Finally we need to add the code that adds this image to our resources inside the game. Open the Project in Visual Studio (if you haven't already), and Open GameResources.cs
Add the following line of code in the LoadImages() routine.
private static void LoadImages() { //Add this line NewImage("Hero", "Hero.png"); }
What this is doing is loading Hero.png, and assigning the name Hero to it, so when we want to use it later, all we have to do is call Resources.GameImage("Hero"); to get the image we want.
We add our resources to GameResources.cs to make sure that the memory is cleared at the end of the program, you don't need to worry about any of that stuff, as the code for this has already been added to GameResources.cs to make things easier.
Characters
To add characters, such as players, enemies, bosses and NPC's we'll need a way of structuring the data for each of these, and also a set of routine for these characters.
Create a new source file called Character.cs, and add the following code as a template for the Character class:
using System; using System.Drawing; using System.Collections.Generic; using SwinGame; using Graphics = SwinGame.Graphics; using Bitmap = SwinGame.Bitmap; using Font = SwinGame.Font; using FontStyle = SwinGame.FontStyle; using Event = SwinGame.Event; using CollisionSide = SwinGame.CollisionSide; using Sprite = SwinGame.Sprite; using GameResources; namespace TomatoQuest { public class Character { } }
Now, the first thing we need to do to get our player loaded, is to create a field that will contain all the data for the player.
Add the following code inside the Character class inside the Character.cs source file
public class Character { //ADD THIS LINE OF CODE private Sprite _Sprite; }
There isn't much in this structure yet, but later we will add alot more. For now all we need is a Sprite that we can access.
Next add the following method inside the Character class in the Character.cs source file:
public static Character NewCharacter(String name, int SpawnX, int SpawnY) //Character Constructor public Character(String name, int SpawnX, int SpawnY) { //Load the Character Sprite _Sprite = Graphics.CreateSprite(Resources.GameImage(name), 3, 12, 24, 32); //Position the Character _Sprite.xPos = SpawnX; _Sprite.yPos = SpawnY; }
This method is our Character constructor, it currently takes 3 parameters, a name, SpawnX, and SpawnY. The name is the name assigned to the image file that we want to load, which right now is "Hero", but we'll come to that later. SpawnX and SpawnY are Integer values that tell the constructor where to 'Spawn' the character.
The first thing we are doing inside this method is create a new sprite by calling one of the overloads for CreateSprite and assigning the result to _Sprite. With CreateSprite() the first parameter is grabbing the image that we want, which is the image that has the name assigned to it, which is the same as the name variable we passed in.
The next parameter in CreateSprite, is telling us how long each frame should go for. This won't matter later on since we'll have to do our animations manually due to the nature of our character sheets. The 3rd parameter is the number of frames this Sprite has in its animation. The character sheet has 12 characters on it, 3 for each side, Up, Down, Left Right, thus we enter 12 for the third parameter.
The last 2 parameters are the size of each Frame of the animation, don't get confused between the size of the image vs the size of the frame. The Hero.png image file is 72x128 in size. However, each frame inside the image is only 24x32, and that is what we need to enter, 24 and 32.
The next step is to move the Sprite to where we need to spawn it. We modify the xPos and yPos of the Sprite as shown in the code above, so that it is equal with the Spawning variables we passed in.
Finally, with this we can use this as a base for creating a wide variety of characters for our game!
Loading the Player Character
Now that we've added a routine for loading our characters, loading our player will be relatively straight forward.
The first thing we need to do is assign a constant for our maps events. For this map, I decided to make Event1 the PlayerSpawn, Event2 the HealerSpawn, Event3 the BossSpawn, Event4 the Enemy1Spawn, Event5 the Enemy2Spawn.
For now we only need the player spawn, so add the following code inside the Game class within Game.cs directly under the class heading:
public class Game { //Constant const Event PLAYERSPAWN = Event.Event1; ...
What this is doing is assigning the constant PLAYERSPAWN with Event.Event1, so now we can type PLAYERSPAWN instead of Event.Event1, so we don't forget or get confused.
The next thing we need to do, is to modify the Level class, so we can find out the X and Y Positions of Events, and Event Counts.
Add the 3 following methods to the Level class in Level.cs
//Event Position X public int EventPositionX(Event eventType, int index) { return MappyLoader.EventPositionX(_Map, eventType, index); } //Event Position Y public int EventPositionY(Event eventType, int index) { return MappyLoader.EventPositionY(_Map, eventType, index); } //Event Count public int EventCount(Event eventType, int index) { return MappyLoader.EventCount(_Map, eventType); }
The first method, gets the X Position of the Event specified, same with the second method, only in it's case, its the Y Position. The last method gets the number of Events of a specific Event Type.
Once you've done that, we can now load our character. Add the following line of code and constructor to Game class in Game.cs
public class Game { //Constant const Event PLAYERSPAWN = Event.Event1; //Loads the Map at object creation Map _Map = Resources.GameMap("Level1"); //ADD THIS LINE OF CODE //Load the Player private Character _Player; //ADD THIS CONSTRUCTOR //Game Constructor public Game() { _Player = new Character("Hero", _Map.EventPositionX(PLAYERSPAWN, 0), _Map.EventPositionY(PLAYERSPAWN, 0)); } ...
It is important that we load our Map before loading our players, because we are using the events inside the Map to find out where to spawn our Hero.
When we load the player, we assign the result to _Player, so we can keep track of it. We pass in "Hero" as the first parameter for the NewCharacter() routine, and the SpawnX, and SpawnY Coordinates, which we get from the Maps Event routines, EventPositionX, and EventPositionY.
We can see that we are trying to find the X and Y Coordinates for the PLAYERSPAWN, using these Event routines, and we trying to find the first occurrence of this event, which is 0 (index's for events start at 0 not 1).
Drawing the Player Character
To draw the player to the screen we first need to create a DrawCharacter method for the Character class. Add the following method to the Character class in Character.cs
public void DrawCharacter() { //Draw the Character to the Screen Graphics.DrawSprite(_Sprite); }
We also need to make the call in the Run() method of the Game class to draw the Player. Add the following line of code to the Game class in Game.cs
public void Run() { //Draw the Map MappyLoader.DrawMap(_Map); //ADD THIS LINE OF CODE //Draw Player _Player.DrawCharacter(); //Draw the FrameRate Text.DrawFramerate(200, 0, Resources.GameFont("Courier")); }
Following the Player Character
Before we can follow the player, we need to make an accessor for the Player's Sprite, so we can use the FollowSprite command.
Add the following Accessor to the Character class in Character.cs
public class Character { //Constant const Event PLAYERSPAWN = Event.Event1; private Sprite _Sprite; //ADD THESE LINES OF CODE public Sprite Sprite { get { return _Sprite; } } ...
Finally, one last thing needs to be done. We need to make our camera follow the player around. To do this add the following line of code to the Game class in Game.cs.
public void Run() { //Draw the Map MappyLoader.DrawMap(_Map); //Draw Player _Player.DrawCharacter(); //ADD THIS LINE OF CODE //Make the Camera follow the Player Camera.FollowSprite(_Player.Sprite, 0, 0); //Draw the FrameRate Text.DrawFramerate(200, 0, Resources.GameFont("Courier")); }
This extra line will make our camera follow the player sprite, and since we want the player in the center of the screen, we set the x and y offsets to 0 and 0.
Compile and Run your game, you should see the following if everything in this part of the tutorial was done correctly.
Not much to look at currently, but next we'll look at moving our character around the world and getting him to collide with the map.
The Project so far
Here's a zip containing the source and resources of the tutorials we've completed up to this point. You should find this useful to read through as you read this tutorial.
