GAME DEVELOPMENT TUTORIAL: DAY 3-1: Level Creation Part I

11/26/2012

Welcome to Unit 3. In the next several lessons, we will put our finishing touches on the game, adding levels, collision detection, AI, and so on.

We are about half way finished with our first Java game. You've almost made it. Let's give it a final push.

Today, we will begin a three part series on Level Creation. This series will entail reading a text file to create tile maps, which will then be used to create objects that the character can interact with on the screen.

We are implementing concepts that we have covered in the last 2 lessons of Unit 2. If you ever get confused, refer back to them. This lesson will be here when you come back.

Part 1: Common Ground

We will be picking up right where we left off at the end of Unit 2, Day 8.
If you have misplaced your files, or just want to start fresh, download the source code below:

unit_3_begin.zip
File Size:	269 kb
File Type:	zip

Download File

Instructions on Importing Eclipse Projects:
Click Here (Eclipse.org)

Downloading Tiles & Background

If you downloaded the source code above (unit3begin.zip), you can skip the downloading and just read through. I already did this for you.

Using your own code? Follow along.
1. Download these two awesome tiles I created (please excuse my programmer art).
Place 'em in the data folder.

tiledirt.png
File Size:	3 kb
File Type:	png

Download File

tileocean.png
File Size:	3 kb
File Type:	png

Download File

These two tiles are 40x40 pixels each. Since we are using a screen of size 800x480, we will be able to fit 20 across and 12 down (recall that the origin is at the top left).

2. Also, we will be replacing my horrible background with this one:

background.png
File Size:	32 kb
File Type:	png

Download File

Download and replace the original background.png!

Part 2: Creating the Tile Class

What are we downloading all these images for?

This is the desired effect:

The full Tile Class is to the right.
Here's what I am doing (Ctrl+ to zoom):

1. Create a new class called Tile.

2. Add the following variables:
Integers: tileX, tileY, speedX, type.
Images: tileImage

tileX represents the x coordinate (horizontal position) of the tile.
tileY represents the y coordinate (vertical position) of the tile).
speedX is equal to the speed of the tile.
type indicates whether the tile is an ocean tile or dirt tile.

3. Create a Background object called bg, and point it to the bg1 object in StartingClass.
This allows us to reference the bg1 object within our tile class.

4. Create a constructor.
As I mentioned, each tile will have the value of 40 pixels. We will be creating Tiles using indexes, rather than pixels. This is why we multiple each index by 40 to get the pixel location.

For example, the tile in the upper left corner will have index (0, 0), so we multiply 40 and still have (0, 0,) as tileX, tileY.

However, for the adjacent tile (1, 0), the tileX and tileY will be (40, 0), just as we want it to be.

5. Create an update() method.
As with those of other classes, this update method will run on every loop (of the game loop).

Type 1 is the ocean tile. We want it to move slowly in the background; however, when the background is scrolling, we want the ocean to scroll faster to accommodate movement.

Also, you will notice that this ocean scrolls slower than our character moves. This makes sense, because the character is moving right in front of the camera, while the ocean is in the mid-ground. This is parallax scrolling at work, albeit simplified. And the same reason is why the ocean will scroll 5x faster than the background layer (sky and clouds - we will be slowing it down).

6. The rest of the class is just getters and setters (generated by right-clicking >> Source >> Generate Getters and Setters.

Tile Class

                                        package kiloboltgame;

                                        import java.awt.Image;

                                        public class Tile {

                                            private int tileX, tileY, speedX, type;

                                            public Image tileImage;

                                            private Background bg = StartingClass.getBg1();

                                            public Tile(int x, int y, int typeInt) {

                                                tileX = x * 40;

                                                tileY = y * 40;

                                                type = typeInt;

                                                if (type == 1) {

                                                    tileImage = StartingClass.tileocean;

                                                } else if (type == 2) {

                                                    tileImage = StartingClass.tiledirt;

                                                }

                                            }

                                            public void update() {

                                                // TODO Auto-generated method stub

                                                if (type == 1) {

                                                    if (bg.getSpeedX() == 0){

                                                        speedX = -1;

                                                    }else{

                                                        speedX = -2;

                                                    }

                                                } else {

                                                    speedX = bg.getSpeedX()*5;

                                                }

                                                tileX += speedX;

                                            }

                                            public int getTileX() {

                                                return tileX;

                                            }

                                            public void setTileX(int tileX) {

                                                this.tileX = tileX;

                                            }

                                            public int getTileY() {

                                                return tileY;

                                            }

                                            public void setTileY(int tileY) {

                                                this.tileY = tileY;

                                            }

                                            public Image getTileImage() {

                                                return tileImage;

                                            }

                                            public void setTileImage(Image tileImage) {

                                                this.tileImage = tileImage;

                                            }

                                        }

Part 3: Making a Few Changes

1. Open up your Robot class. Now that we have multiple layers of backgrounds, we want the farthest one to scroll at a slower speed.

Locate the 4th if statement in the update() method inside the Robot class.

Make the following changes:

if (speedX > 0 && centerX > 200){
bg1.setSpeedX(-MOVESPEED/5);
bg2.setSpeedX(-MOVESPEED/5);
}

Now the background will move at 1/5 the character's speed.

2. Now open up your Enemy class and make the following changes to the update method (for the same reasons):

// Behavioral Methods
public void update() {
centerX += speedX;
speedX = bg.getSpeedX()*5;

}

Part 4: Adding the Tiles to StartingClass

We will be working with the StartingClass for Part 4.

1. We begin at the class declaration. Add the following changes in bold.

public class StartingClass extends Applet implements Runnable, KeyListener {

private Robot robot;
private Heliboy hb, hb2;
private Image image, currentSprite, character, character2, character3,
characterDown, characterJumped, background, heliboy, heliboy2,
heliboy3, heliboy4, heliboy5;

public static Image tiledirt, tileocean;

private Graphics second;
private URL base;
private static Background bg1, bg2;
private Animation anim, hanim;

private ArrayList<Tile> tilearray = new ArrayList<Tile>();

We have created two Image objects: tiledirt and tileocean, which will point to our PNG files. We have also created an ArrayList of Tiles called tilearray.

2. Then we scroll down to the //Image Setups section inside the init() method. Make the changes here:

// Image Setups
character = getImage(base, "data/character.png");
character2 = getImage(base, "data/character2.png");
character3 = getImage(base, "data/character3.png");

characterDown = getImage(base, "data/down.png");
characterJumped = getImage(base, "data/jumped.png");

heliboy = getImage(base, "data/heliboy.png");
heliboy2 = getImage(base, "data/heliboy2.png");
heliboy3 = getImage(base, "data/heliboy3.png");
heliboy4 = getImage(base, "data/heliboy4.png");
heliboy5 = getImage(base, "data/heliboy5.png");

background = getImage(base, "data/background.png");

tiledirt = getImage(base, "data/tiledirt.png");
tileocean = getImage(base, "data/tileocean.png");

3. Next, we must initialize the tilearray we created in step 1. Scroll down to the start() method, and make these changes.

@Override
public void start() {
bg1 = new Background(0, 0);
bg2 = new Background(2160, 0);

// Initialize Tiles

for (int i = 0; i < 200; i++) {
for (int j = 0; j < 12; j++) {

if (j == 11) {
Tile t = new Tile(i, j, 2);
tilearray.add(t);

} if (j == 10) {
Tile t = new Tile(i, j, 1);
tilearray.add(t);

}
}
}

hb = new Heliboy(340, 360);
hb2 = new Heliboy(700, 360);
robot = new Robot();

Thread thread = new Thread(this);
thread.start();
}

We utilize a double for loop (as in Days 9, 10 of Unit 2), representing the x index of the tiles as i, and y index as j.

The numbers i < 200, j < 12 creates 2400 possible locations for tiles. Of those, we fill 400 (i = 200, j = 2).

4. With the tilearray created, we must now update and paint the individual tiles inside the ArrayList.

Create these two methods. Add them below the paint() method for organization:

private void updateTiles() {

for (int i = 0; i < tilearray.size(); i++) {
Tile t = (Tile) tilearray.get(i);
t.update();
}

}

private void paintTiles(Graphics g) {
for (int i = 0; i < tilearray.size(); i++) {
Tile t = (Tile) tilearray.get(i);
g.drawImage(t.getTileImage(), t.getTileX(), t.getTileY(), this);
}
}

Both of these methods just utilize 1 index, looking at the size (the number of tiles) in tilearray. In the for loops, the number i increases from 0 to 2399, and we therefore update our 2400 tiles and paint them.

Look at the parameters inside the g.drawImage method, and make sense of them. We are drawing the image associated with the tile at the tile's X coordinate, and Y coordinate.

5. All we now have to do is call these two methods.

First. The updateTiles() method will be called inside the run() method. Place it above this statement like so:
updateTiles();
hb.update();

Second. The paintTiles() method will be called inside the paint() method. We want the tiles to appear on top of the background but behind the character and enemies, so we place it below the two g.drawImage(background) methods like so:

g.drawImage(background, bg1.getBgX(), bg1.getBgY(), this);
g.drawImage(background, bg2.getBgX(), bg2.getBgY(), this);
paintTiles(g);

Finished!

Here's the final StartingClass code:

package kiloboltgame;

import java.applet.Applet;
import java.awt.Color;
import java.awt.Frame;
import java.awt.Graphics;
import java.awt.Image;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;
import java.net.URL;
import java.util.ArrayList;
import kiloboltgame.framework.Animation;

public class StartingClass extends Applet implements Runnable, KeyListener {

private Robot robot;
private Heliboy hb, hb2;
private Image image, currentSprite, character, character2, character3,
characterDown, characterJumped, background, heliboy, heliboy2,
heliboy3, heliboy4, heliboy5;

public static Image tiledirt, tileocean;

private Graphics second;
private URL base;
private static Background bg1, bg2;
private Animation anim, hanim;

private ArrayList<Tile> tilearray = new ArrayList<Tile>();

@Override
public void init() {

setSize(800, 480);
setBackground(Color.BLACK);
setFocusable(true);
addKeyListener(this);
Frame frame = (Frame) this.getParent().getParent();
frame.setTitle("Q-Bot Alpha");
try {
base = getDocumentBase();
} catch (Exception e) {
// TODO: handle exception
}

// Image Setups
character = getImage(base, "data/character.png");
character2 = getImage(base, "data/character2.png");
character3 = getImage(base, "data/character3.png");

characterDown = getImage(base, "data/down.png");
characterJumped = getImage(base, "data/jumped.png");

heliboy = getImage(base, "data/heliboy.png");
heliboy2 = getImage(base, "data/heliboy2.png");
heliboy3 = getImage(base, "data/heliboy3.png");
heliboy4 = getImage(base, "data/heliboy4.png");
heliboy5 = getImage(base, "data/heliboy5.png");

background = getImage(base, "data/background.png");

tiledirt = getImage(base, "data/tiledirt.png");
tileocean = getImage(base, "data/tileocean.png");

anim = new Animation();
anim.addFrame(character, 1250);
anim.addFrame(character2, 50);
anim.addFrame(character3, 50);
anim.addFrame(character2, 50);

hanim = new Animation();
hanim.addFrame(heliboy, 100);
hanim.addFrame(heliboy2, 100);
hanim.addFrame(heliboy3, 100);
hanim.addFrame(heliboy4, 100);
hanim.addFrame(heliboy5, 100);
hanim.addFrame(heliboy4, 100);
hanim.addFrame(heliboy3, 100);
hanim.addFrame(heliboy2, 100);

currentSprite = anim.getImage();
}

@Override
public void start() {
bg1 = new Background(0, 0);
bg2 = new Background(2160, 0);

// Initialize Tiles

for (int i = 0; i < 200; i++) {
for (int j = 0; j < 12; j++) {

if (j == 11) {
Tile t = new Tile(i, j, 2);
tilearray.add(t);

} if (j == 10) {
Tile t = new Tile(i, j, 1);
tilearray.add(t);

}

}
}

hb = new Heliboy(340, 360);
hb2 = new Heliboy(700, 360);
robot = new Robot();

Thread thread = new Thread(this);
thread.start();
}

@Override
public void stop() {
// TODO Auto-generated method stub
}

@Override
public void destroy() {
// TODO Auto-generated method stub
}

@Override
public void run() {
while (true) {
robot.update();
if (robot.isJumped()) {
currentSprite = characterJumped;
} else if (robot.isJumped() == false && robot.isDucked() == false) {
currentSprite = anim.getImage();
}

ArrayList projectiles = robot.getProjectiles();
for (int i = 0; i < projectiles.size(); i++) {
Projectile p = (Projectile) projectiles.get(i);
if (p.isVisible() == true) {
p.update();
} else {
projectiles.remove(i);
}
}

updateTiles();
hb.update();
hb2.update();
bg1.update();
bg2.update();
animate();
repaint();
try {
Thread.sleep(17);
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}

public void animate() {
anim.update(10);
hanim.update(50);
}

@Override
public void update(Graphics g) {
if (image == null) {
image = createImage(this.getWidth(), this.getHeight());
second = image.getGraphics();
}

second.setColor(getBackground());
second.fillRect(0, 0, getWidth(), getHeight());
second.setColor(getForeground());
paint(second);

g.drawImage(image, 0, 0, this);

}

@Override
public void paint(Graphics g) {
g.drawImage(background, bg1.getBgX(), bg1.getBgY(), this);
g.drawImage(background, bg2.getBgX(), bg2.getBgY(), this);
paintTiles(g);

ArrayList projectiles = robot.getProjectiles();
for (int i = 0; i < projectiles.size(); i++) {
Projectile p = (Projectile) projectiles.get(i);
g.setColor(Color.YELLOW);
g.fillRect(p.getX(), p.getY(), 10, 5);
}

g.drawImage(currentSprite, robot.getCenterX() - 61,
robot.getCenterY() - 63, this);
g.drawImage(hanim.getImage(), hb.getCenterX() - 48,
hb.getCenterY() - 48, this);
g.drawImage(hanim.getImage(), hb2.getCenterX() - 48,
hb2.getCenterY() - 48, this);
}

private void updateTiles() {

for (int i = 0; i < tilearray.size(); i++) {
Tile t = (Tile) tilearray.get(i);
t.update();
}

}

private void paintTiles(Graphics g) {
for (int i = 0; i < tilearray.size(); i++) {
Tile t = (Tile) tilearray.get(i);
g.drawImage(t.getTileImage(), t.getTileX(), t.getTileY(), this);
}
}

@Override
public void keyPressed(KeyEvent e) {

switch (e.getKeyCode()) {
case KeyEvent.VK_UP:
System.out.println("Move up");
break;

case KeyEvent.VK_DOWN:
currentSprite = characterDown;
if (robot.isJumped() == false) {
robot.setDucked(true);
robot.setSpeedX(0);
}
break;

case KeyEvent.VK_LEFT:
robot.moveLeft();
robot.setMovingLeft(true);
break;

case KeyEvent.VK_RIGHT:
robot.moveRight();
robot.setMovingRight(true);
break;

case KeyEvent.VK_SPACE:
robot.jump();
break;

case KeyEvent.VK_CONTROL:
if (robot.isDucked() == false && robot.isJumped() == false) {
robot.shoot();
}
break;

}

}

@Override
public void keyReleased(KeyEvent e) {
switch (e.getKeyCode()) {
case KeyEvent.VK_UP:
System.out.println("Stop moving up");
break;

case KeyEvent.VK_DOWN:
currentSprite = anim.getImage();
robot.setDucked(false);
break;

case KeyEvent.VK_LEFT:
robot.stopLeft();
break;

case KeyEvent.VK_RIGHT:
robot.stopRight();
break;

case KeyEvent.VK_SPACE:
break;

}

}

@Override
public void keyTyped(KeyEvent e) {
// TODO Auto-generated method stub

}

public static Background getBg1() {
return bg1;
}

public static Background getBg2() {
return bg2;
}

}

When you run it:

We will pick up from here in Day 2.

That's It. Thanks for reading!

unit_3_day_1.zip
File Size:	271 kb
File Type:	zip

Download File

Go to Unit 3: Day 2

Comments

Karl Bonitz link

11/26/2012 7:01pm

Excellent tutorial as always! Thank you

Aswin Kumar

11/26/2012 11:58pm

very nice.
the helliboy does not get updated whyi.e not looped how to do it pls explain

James C.

11/27/2012 12:03am

Aswin,

Thanks for commenting! If you could be slightly more specific, I can help you out.

Is animation working? How about scrolling? What is not updated exactly?

11/27/2012 2:50am

i have mailed u the project.yes animation works,scrolling goes well for some frames then helliboy is not appering

Anthony

11/27/2012 2:19am

Loving this series. Thanks. I've noticed one thing though. If you scroll right for long enough (it does take a while to be fair) the ground disappears. The ocean, sky and robot continue as normal. Is this something I've mistyped?

11/27/2012 2:21am

That's working as intended. Look carefully at step 3 of Part 4. :)

Of course, we won't be having this problem once we start reading from a text file. I created a finite number of tiles and I did not set them to return to the opposite side of the screen.

03/11/2014 9:46am

Actually ocean also disappear if you keep going. Makes sense since we've created tiles in start method and haven't tried to recycle or recreate tiles.

Reece

11/28/2012 12:00am

Great stuff thank you! I'm really looking forward to getting this game finished. I now have a much better apprieciation as to how much work is involved!

Just one thing to clarify, when running the game, (no keyboard input) : heliboy's rotors are swirling, robots eyes are blinking, and the waves are moving.
is that right?

Thanks again!

James

11/28/2012 12:08am

Yep that sounds about right :)

Richard Burns

11/29/2012 2:03pm

Would it to be possible to have a very large picture as the entire background minus a few interactive spites i.e. hedges and the such. I have seen sonic games that have the entire level as one image. would it be possible on a phone to do that?

11/29/2012 3:24pm

It all depends on how you handle memory. As long as you keep your memory relatively empty, it's fine if you use a large image. But if you have a small RAM, you would probably want to free up memory as often as possible.

A simple way to calculate memory usage:
pixel count x pixel depth = memory usage in bits.

So 1000 height x 1000 width x 32 (if transparent, I believe) bits = 32000000 bits.

We convert that to bytes (divide by 8) and find that such an image would take up 4 MB.

To put that into perspective, lower end Android phones only allocates 16MB per application. Some of the newer ones are about 64MB.

That means on lower devices, your game would crash after you just load just one 2000 x 2000 x 32 bits image.

Of course you can reduce the size of the image and scale it at runtime, but that is VERY slow.

Sean

11/30/2012 9:42am

My code works fine but no ocean or dirt tiles appear? is there a layout method I'm missing maybe?

11/30/2012 9:47am

Try changing the image variable in the g.drawImage() statement inside the paintTiles to another image that works. If you see the tiles then, it's a problem with how you initialized the images or your images are not in the right folder. You can also try "cleaning" the project.

Sean (a different Sean)

03/21/2013 10:23am

I'm having the same problem. I think because my name is also Sean. Or, that is me from the future.

"cleaning" the project erases tiledirt and tileocean images from the folder. if I re-add them and refresh the data folder they still won't appear.

Sean Again

03/21/2013 10:25am

Please respond to this comment, I missed checking the "notify me of new comments" button on the other.

dude

08/04/2013 5:27am

its probably because the directory path given for those images are wrong, or at least dont work for some of us

the paths james shows in the tutorial are:

tiledirt = getImage(base, "data/tiledirt.png");
tileocean = getImage(base, "data/tileocean.png");

for me this does not work either, try this instead:

tiledirt = getImage(base, "../data/tiledirt.png");
tileocean = getImage(base, "../data/tileocean.png");

keep in mind to add the "../" to any future directory paths when assigning image files
i keep forgetting this myself *facepalm*

ut after i did this it worked perfectly :D

paul

12/09/2012 6:24am

Hi there,
first off thanks for the nice tutorial.
At step 3. you write:
"The numbers i < 200, j < 12 creates 2400 tiles: 200 across, and 12 down."
Aren´t we only creating 400 tiles (200x2) since we only fill the lower 2/12 of the screen? Maybe you could clarify this in the tutorial.

Regards Paul

12/09/2012 8:14am

Fixed. Thanks!

Paul

12/14/2012 2:06pm

One question. I can't add new images to my project. I copy them to the data folder but Eclipse doesn't see them. When I do Project >> Clean they also disappear.. Even if I copied your code to my project it doesn't work. How can I solve this? Because so far I've been importing your code.

12/14/2012 9:25pm

Hmm I've never heard of such a problem before. I don't think its a programming issue if the files are disappearing. The two are not connected.

Try creating a new project perhaps?

Peter

08/17/2013 8:05am

Hello James and thanks for the tutorial. That ALSO hapened to me. the images didnt appear in the project when i cleaned it, and it never did with other projects, what did made the images appear, was right clicking on the project folder and selecting "refresh", which would refresh the project, to verify for new files, or deleted files. it always works that way for me

hey

12/22/2012 10:29am

I had this problem before too. What I did was right clicking the project in the package explorer and go to build path. From there you will have to source, remove the folder that doesnt work and link create a new one where you link to the data folder. Make sure you tick it under order and export.

Nicolas

01/05/2013 8:30am

Thanks for this great tutorial. It's the best.
But i have encountered a litle problem.

When i downloaded the zip forva fresh start. I get an error in eclips.
I think this is because your project uses jre 1.7 and i think my eclips has only support files for 1.6

Should i convert your project to 1.6 ? (how?)
Or should i find newer version of jre (java) for eclips (mac)

Thans in avance

01/05/2013 8:39am

I am not at a computer right now, but I think you can change the compiler version by right clicking the Project, properties, Java compiler. There should be an option to change it.

sam

01/14/2013 7:53pm

FTdevelopment

01/24/2013 4:09pm

Hii. I didnt understand this part.

for (int i = 0; i < 200; i++) {
for (int j = 0; j < 12; j++) {
if (j == 11) {
Tile t = new Tile(i, j, 2);
tilearray.add(t);
}
if (j == 10) {
Tile t = new Tile(i, j, 1);
tilearray.add(t);
}
}

1 : Why are we doing that "j == 11" (or j == 10) ?
2 : Why are we doing that "tilearray.add(t)" on there ?

01/25/2013 6:03pm

Try removing the two if statements (and the statements inside) and see how the game changes. That should help you understand.

Also, the tilearray is the collection of tiles, and we are adding the new tile that we created into this tilearray, so that we can refer to all the tiles as a group.

Dawid

01/27/2013 1:52pm

I'm not supposed to see a green line above the dirt tile am I?

Great tutorial, thanks alot! :)

James c

01/27/2013 3:27pm

That would be the grass ;)

01/27/2013 5:04pm

Hmm... did you change the dirt tile just now?
I swear mine was the all-brown tile at this part of the tutorial :o

01/27/2013 5:07pm

The thumbnail and download-file are indeed different, look for yourself :)

Holodoc

02/24/2013 6:34am

Hi,
Great tutorial.
Currrently there is a mistake in the programm on updating the tiles: After one tile is outside of the screen, it should not be updated again. Otherwise you will get an overflow and the tiles came back again after some time. Funny thing: the tiles are not hanging together when they come to the screen the second time....

Regards,

holodoc

juan arango

04/28/2013 2:31pm

hi man your tutorial its great! nut i have a problem my code does work altought i download you code but it still doesnt work it say that the arraylist have to be parameterized and my code is the same that yours! ( sorry my english, i speak spanish )

04/28/2013 2:34pm

thats what appears
java.lang.UnsupportedClassVersionError: kiloboltgame/StartingClass : Unsupported major.minor version 51.0
at java.lang.ClassLoader.defineClass1(Native Method)
at java.lang.ClassLoader.defineClassCond(Unknown Source)
at java.lang.ClassLoader.defineClass(Unknown Source)
at java.security.SecureClassLoader.defineClass(Unknown Source)
at java.net.URLClassLoader.defineClass(Unknown Source)
at java.net.URLClassLoader.access$000(Unknown Source)
at java.net.URLClassLoader$1.run(Unknown Source)
at java.security.AccessController.doPrivileged(Native Method)
at java.net.URLClassLoader.findClass(Unknown Source)
at java.lang.ClassLoader.loadClass(Unknown Source)
at sun.misc.Launcher$AppClassLoader.loadClass(Unknown Source)
at java.lang.ClassLoader.loadClass(Unknown Source)
at sun.applet.AppletClassLoader.loadClass(Unknown Source)
at java.lang.ClassLoader.loadClass(Unknown Source)
at sun.applet.AppletClassLoader.loadCode(Unknown Source)
at sun.applet.AppletPanel.createApplet(Unknown Source)
at sun.applet.AppletPanel.runLoader(Unknown Source)
at sun.applet.AppletPanel.run(Unknown Source)
at java.lang.Thread.run(Unknown Source)

Tpt

05/13/2013 5:06am

Thanks for your amazing tutorial.
Some comments about this page:
Instead of
for (int i = 0; i < 200; i++) {
for (int j = 0; j < 12; j++) {
if (j == 11) {
Tile t = new Tile(i, j, 2);
tilearray.add(t);
}
if (j == 10) {
Tile t = new Tile(i, j, 1);
tilearray.add(t);
}
}
why not use
for (int i = 0; i < 200; i++) {
Tile tocean = new Tile(i, 10, 1);
tilearray.add(tocean);
Tile tdirt = new Tile(i, 11, 2);
tilearray.add(tdirt);
}
that does exactly the same thing?

About Tile class, instead of having "if (type == 1) { ... } else { ... }" everywhere I think it may be a good idea to create
an abstract class Tile and two subclasses TilOcean and TilDirt that manage the two types of Tiles. It's a good occasion to
talk a second time about inheritance.

And, more cosmetic, it may be a good idea to introduce the "for (Tile tile : tilearray) { ... }" loop instead of
"for (int i = 0; i < tilearray.size(); i++) { tile = (Tile) tilearray.get(i); ... }" in the StartingClass implementation.

What do you think about these proposals?

Rasmus link

10/18/2013 9:41pm

another thing given that our background is only 2* 2160 108 tiles should be enough to cover both.
this would save a little calculation as well :)
also the tiles does not wrap so if you go far enough they disappear.

solution is to ad
if (tileX <= -2140) {
tileX += 4320;
}
to the update function

rasmus link

10/18/2013 9:44pm

OK forget it reading the next lesson makes the code chioces obvious

Hernaldo link

06/25/2013 8:43am

Excelente tutorial gracias. Explicado en términos simples y paso a paso.
Excellent tutorial thanks. Explained in simple terms and step by step.

Robert link

07/09/2013 2:14pm

Im having an issue with the enemies appearing. The first Heliboy does not appear, but the second one does. i cant seem to figure out whats going on, ive checked my coding against the source code and it looks the same for every reference of the heliboy. Yet only one is displaying..

Jason

07/14/2013 1:22pm

Awesome tutorial! I can understand just about all of it while i was following along and writing it to my code. When i ran the game however, i encountered a problem: everything moved WAY to fast (Animations, updates, etc.) I figured this was a problem with the run method not waiting 17 milliseconds between loops but i have no idea what could cause this. Any help or advice would be appreciated! Thanks!

AlexNovember

08/14/2013 11:41pm

The background floats away to the top left of the screen as the robot moves along.. I even had to copy your code and put it instead of mine because of some stupid error I didn't feel like trying to find.
Still does it.

Yaniv

08/20/2013 12:10am

Great tutorial for beginners (like me)
One question though, can you add the ocean?
You didnt use it...

Kyle Leon Scam link

10/01/2013 10:58pm

I really appreciate people helping her out in her bad times. Lets just hope for the best. All the best jane we are always there for you.

Meghana Joshi

10/03/2013 1:20pm

OMG! I love your site. I have developed projects in java but the way you teach... It is awesome! Because of you people, I am soon planning to launch my own android game, which I learnt mostly coz of this site... and more games if it is succesful... And if I do, get to earn some money as an Indie developer, and if this site is still running, I surely would love to donate if you people promise to keep going with your tutorials. Thank you so much!! Really!!

Ethan

11/26/2013 12:30pm

I am not sure why, but if i have my robot move a certain distance, then the dirt tile disappears. Then if I go the same distance yet again, the waves disappear leaving only the background.

My code is the same as what you posted.

11/26/2013 12:44pm

actually, for the waves, if I just sit there, it will eventually scroll off and disappear.

11/26/2013 12:57pm

found the bug.

In the tile class, in the update method you have:

"public void update() {
// TODO Auto-generated method stub
if (type == 1) {
if (bg.getSpeedX() == 0){
speedX = -1;
}else{
speedX = -2;
}

} else {
speedX = bg.getSpeedX()*5;
}

tileX += speedX;
}"

If should be:

public void update() {
if (type == 1) {
if (bg.getSpeedX() == 0) {
speedX = -1;
} else {
speedX = -2;
}

} else {
speedX = bg.getSpeedX() * 5;
}

tileX += speedX;

if (tileX <= -2160){
tileX += 4320;
}
}

Carlos

02/22/2014 12:53pm

Great tutorial , just one question, what if I want my character to jump just once per key press?

fatehb

03/02/2014 4:49pm

hey

is there a way i can email you a image of what my output looks like?
my background isnt working properly and the heliboys are out of place.

thanks

NeverMind10

03/12/2014 6:53am

Hi,
How can I make a random map which never ends?
What method should I use to create that?