Wednesday, October 30, 2013

Playing with Walls & Fences

Today I would like you to find [or make] some walls and/or fences.  You will create a new Class (i.e. a subclass of Actor) called Wall [or Fence] and set the image.
In this example, you can see fence, plants, roads, walls, etc.  Notice it's not a true top-down, but still works.
Add some walls (or other impassable objects) to your world and then begin the process of setting up the code to not allow actors to pass through them.

For example, in your "move" section, you could do something like this:
  • If you press the "up" key, move up 5
    • If you're now touching the object you can't pass through, move down 5
If you're moving your character 1 block at a time, you can also do:
  • If you can see the wall, don't move -- OR... if you can NOT see the wall, move.
Imagine now that you have other classes -- mud, quicksand, brush, etc.  Maybe if you're in mud, your movespeed is slowed by 1 -- or if you're in quicksand, your move speed is super slow.  Maybe brush is impassable -- but if you hit it with your sword X times, it breaks and goes away.

I'll do my best to demo wall code during class.
In this example, you can see the sprite edges.
Right now we're in a "locked" world with a specific dimension.  But as we learn more code, we'll see how it's possible to have a much larger world with a scrolling exploration mode.  The example below shows a ridiculously large world, but it's definitely a potentially cool game.

Monday, October 28, 2013

Work on Your Game

Today I would like you to work on finishing up your games, working on the graphics, and fine-tuning your code.  Make sure you get the final version shared to Greenfoot.org.

Tomorrow we will have a guest speaker from UTI (Universal Technical Institute).  You can read about them at: http://www.uti.edu/  As always, I expect my students to be attentive, polite, and professional.  These people come to Kelseyville -- an out of the way little town -- to talk to you.

On Wednesday we will be starting a new game and working on some less structured -- well, structured but less "guided" programming.  I will have you create a World, copy some useful methods (i.e. "eat" or "atWorldEdge"), and then add some "actors" to the scene.  We will see how that goes on Wednesday, Thursday and Friday.

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();
    }

Wednesday, October 23, 2013

Game Over Screen

Today we're going to be adding a "Game Over" screen. To begin with you will probably want to create one, find one online, or use this graphic:
Click to View Full Size
If we add this method to our MyWorld class:
Note: I called my world "MyWorld" so you will just add this to whatever "world" class you made.
public void endGame()
    {
        removeObjects(getObjects(null));
        setBackground(new GreenfootImage("gameover.jpg"));  
        Greenfoot.playSound("ohno.wav");
        Greenfoot.stop();
    }
Then add this piece to your "Try to Eat Player" (or Turtle or whatever) code:
((MyWorld)getWorld()).endGame();
Note #2: Again, I'm referencing "MyWorld" -- you need to adjust for your own name. One thing I added to my new "endGame" method is stopping the background music..
bgSound.stop();
Again, my sound loop was called bgSound so adjust as necessary.
Once you get your code working you can spend some time making your Game Over image or fine-tuning your game a little bit more. Remember to upload your finished [updated] game to GreenFoot.

Tuesday, October 22, 2013

Bouncy Balls (Final): Refactoring for Good Style

Today we will work on cleaning up our code and making it more "cohesive". Each method should do one single thing, for example.


Finally we will look at animating the balls:

Monday, October 21, 2013

Bouncy Balls: Continued

Today we will continue with our "Bouncy Balls" code and learn some new techniques.

First, he's showing us how to "paint" the background color instead of using an image.  To do this properly, you'll need to set your MyWorld (or whatever you called yours) to have no image.

Then we can watch Joy of Code #20:

 
Next we will continue with the Bouncy Balls code and create drawn spheres instead of using images.

When you have completely done these steps, you should have a code similar to this: [to be added]

Friday, October 18, 2013

Once we have the "bouncing balls" code working properly we can new Mik's next video.  This is mostly an instructional video explaining what you've been doing, but please do watch.  It will help reinforce the concepts we've been working on.

After that, I would like you to spend some time working on your game again.  Maybe we can add a series of images to your game that will cycle.  Maybe you can incorporate some of the different features you see in your classmates games.  Make it more interesting and then update your Greenfoot scenario.

Thursday, October 17, 2013

Bouncy Balls... with Mouse Input

Today we will continue where we left off yesterday -- making colored balls randomly move around the screen and bounce off walls... at which time they change color.  I know... it doesn't seem that useful, but it will be.  :)

Yesterday we ended by having the following code (right-click and save to your ThawSpace):
https://docs.google.com/file/d/0Bwhy5BkICGK1UzY1SHFZRVFKTWc/edit?usp=sharing

Let's spend a few minutes to look at the code and then move on to the next video:

Tuesday, October 15, 2013

Some New Concepts: "Coloured Bouncing Balls"

Debugging is twice as hard as writing the code in the first place.
      Therefore, if you write the code as cleverly as possible, you are,
      by definition, not smart enough to debug it.
            — Brian W. Kernighan.

We will be discussing dynamically changing images, string concatenation and multiple constructors.

Monday, October 14, 2013

Finish Publishing, Sharing, & Fine Tuning

Make sure you have your first game online at Greenfoot.org (see Friday's assignment).  When you have it online, go to your profile and show Griff your Greenfoot address.  My address looks like this:

Next, begin checking out your classmates games and leave some CONSTRUCTIVE comments -- maybe some suggestions for making the game more playable, more fun, or an improvement to some of the graphics.

Remember that you can always re-share your code and it will "Update" your page.

Thursday, October 10, 2013

Register for Greenfoot.org and Publish Your First Game

Today we will be signing up for accounts at Greenfoot: http://www.greenfoot.org/account/login

After you register, add your information and a profile picture.  If you ever need to go back to edit
your details, click on your username and then click on "Account Settings" next to your picture.

Next, open up your original game [well, your game based on Trick the Turtle].  Make sure that your classes are all commented with your name and the date or version number, and remember to give credit to Michael Kölling as the author of the original source code and to any other contributors (music, graphics, etc.).

Finally, click on the "Share" button at the top-right corner of your Greenfoot window.  This will take you to a window which will let you set your Scenario icon, the title, your web page (if you have a blog or deviantART page), and also some check boxes for things such as "Game" and "Publish Source Code" [which I would like you to do for this one].    You will also need to enter your Login and Password (for Greenfoot.org).

When finished, you will have a published Greenfoot application.  You will receive comments and feedback on this publication, so check back regularly.  If you decide to update your code later, you can update this published piece as well.


Friday, October 4, 2013

Fix & Customize Your Games

I am sorry that I'm not there today to help with your code issues.  Try to use this period to resolve errors and customize your games.  Work together to find solutions to the problems you're having.

I'm attaching my finished Trick the Turtle file if you need to look at the code we entered yesterday.  (Right Click and Save Link Here)

Thursday, October 3, 2013

Wednesday, October 2, 2013

Trick the Turtle: A First Look at Variables & Object Interaction


Video #14: A First Look at Variables


Video #15: Object Interaction



Tuesday, October 1, 2013

Trick the Turtle: Analyzing the Code So Far

Video #13:  Structure of a Class
 

Graphic:  Structure of a Class