Thursday, October 24, 2013

Our Game: Working With Sprites

Today and tomorrow we will be working on adding sprites to our game.  We will begin with our main character but you could easily use these

A "sprite" in computer graphics is a small, static image which can be used to create the illusion of movement or direction. For example, if you were playing "Zelda" and your character was walking to the right, you will see a picture of Link walking to the right. If you wanted it to be moving, you could cycle through graphics which would show the right leg forward, both legs straight, and then the right leg backward. The character would appear to be moving.

 I simple set of sprites might show a tank facing the right, a tank facing left, a tank pointing upward, and a tank pointing downward. Adding motion (2 or 3 graphics going each direction) would make the game more visually appealing but it's a lot more graphics to create. If you wanted your tank to go diagonal (i.e. both right and up at the same time) you might need to create some angled sprites.

 Here's a quick example of sprites I made for my Zombie game.  The first image is just the character standing there (not moving at all).  The next two are two different versions of the character walking up -- the legs alternating to give the appearance of walking.  I still have some work to do because the side images look like Nacho Libre -- but it's getting there.


Here are some sample sprites to start with (64x64):
 

Once you have your sprites you can begin implementing the code to make it work.

The following code is from my "Player" class which extends "Creature". In Mik's scenario, it would have been "Turtle" and extend "Animal". We will discuss some of the reasons for my code decisions in class.
import greenfoot.*; 

/**
 * This is a player in a first, simple video game. It can be controlled with the arrow keys.
 */
public class Player extends Creature
{
    private int points = 0;
    private Counter counter;
    private int imageNumber;
    int moveSpeed;

    public Player (Counter pointCounter) {
        counter = pointCounter;
        imageNumber = 0;
    }

    public void act()
    {
        tryToEat();
        imageNumber++;
        if (imageNumber == 2) {
            imageNumber = 0;}
        checkKeys();
    }

    /**
     * Check whether the control keys are being pressed, and respond accordingly.
     */
    public void checkKeys()
    {   
        moveSpeed = 4;
        if ( Greenfoot.isKeyDown("left") )
        {
            int x = getX(); 
            int y = getY();
            setLocation(x - moveSpeed, y);
            setImage ("griffl"+ imageNumber + ".png");

        }
        if ( Greenfoot.isKeyDown("right") )
        {
            int x = getX(); 
            int y = getY();
            setLocation(x + moveSpeed, y);
            setImage ("griffr"+ imageNumber + ".png");

        }
        if ( Greenfoot.isKeyDown("up") )
        {
            int x = getX(); 
            int y = getY();
            setLocation(x, y-moveSpeed);
            setImage ("griffu"+ imageNumber + ".png");

        }
        if ( Greenfoot.isKeyDown("down") )
        {
            int x = getX(); 
            int y = getY();
            setLocation(x, y+moveSpeed);
            setImage ("griffd"+ imageNumber + ".png");
        }

    }

    /**
     * Check whether we can see Food or bonus. If we can, eat eat them.
     */
    public void tryToEat()
    {
        if (canSee(Food.class) )
        {
            eat(Food.class);
            counter.add(5);
            Greenfoot.playSound("heartbeat.wav");
        }

        if (canSee(Bonus.class) )
        {
            eat(Bonus.class);
            counter.add(20);
            Greenfoot.playSound("ominous.wav");
            createNewBonus();
        }
    }

    /**
     * Create a new bonus and insert it at a random location in the world.
     */
    private void createNewBonus()
    {
        Bonus newBonus;
        newBonus = new Bonus();

        World world;
        world = getWorld();

        int worldWidth = world.getWidth();
        int worldHeight = world.getHeight();

        int x;
        int y;
        if ( Greenfoot.getRandomNumber(100) < 25 )
        {
            x = 1;
            y = Greenfoot.getRandomNumber(world.getHeight());
        }   
        else if ( Greenfoot.getRandomNumber(100) < 25 ){
            x = worldWidth-1;
            y = Greenfoot.getRandomNumber(world.getHeight());
        }       
        else if ( Greenfoot.getRandomNumber(100) < 75 ){
            y = 1;
            x = Greenfoot.getRandomNumber(world.getWidth());
        }
        else{
            y = worldHeight-1;
            x = Greenfoot.getRandomNumber(world.getWidth());
        }                        
        world.addObject(newBonus, x, y);
    }
}
Notice that I changed the way my character moves. Instead of a key press changing my rotation or movement, it now gets the X and Y coordinate of my player and then adds or subtracts from the X or Y (depending on which key(s) were pressed). Also notice that instead of telling it to "add 5" (or whatever) to the direction, I told it to add or subtract a variable called "moveSpeed". This allows me to change the speed of all directional movement by changing the "moveSpeed=4" setting. Thinking about this in the future, that means if I were to have the character pick up an energy drink or something, his moveSpeed could equal moveSpeed+1 (for example) -- or if he stepped in tar, his moveSpeed could be reduced.

Something I added to my code was a little bit to slow down the movement of my characters feet.  Since I'm access a variable (called "temp") I had to initialize it in the beginning as well.  But here's where I put the code:
    public void act()
    {
        tryToEat();
        temp++;
        if (temp > 5) { // Added this to slow the feet movements.
            imageNumber++;
            temp=0;
        }
        if (imageNumber == 2) {
            imageNumber = 0;}checkKeys();
    }

No comments:

Post a Comment