Willkommen im Kapitel 3. In den nächsten Lektionen werden wir lernen, wie man Level erstellt, Kollisionen programmiert, den Heliboys eine Art Intelligenz verpasst und einiges mehr, um unserem Spiel den letzten Schliff zu geben. Wir sind nun schon fast fertig mit unserem ersten Java-Spiel, also lasst es uns angehen.

Teil 1: Ein gemeinsamer Start

Wir werden da weiter machen, wo wir in Kapitel 2 Lektion 8 aufgehört haben. Falls ihr euren Code nicht mehr habt oder ihr erst hier einsteigt, hier der Code aus Kapitel 2 Lektion 8.

Source Code

Kapitel 2 Lektion 8

Nachdem wir nun alle mit dem selben Code arbeiten, können wir beginnen.

1. Wir benötigen für unsere Felder erst einmal Bilder, um diese auszufüllen. Dazu ladet bitte diese beiden Bilder herunter und kopiert diese in den data-Ordner.

Diese beiden Bilder sind 40 x 40 Pixel groß. Da wir eine Bildschirmauflösung von 800 x 480 nutzen, sind wir in der Lage, 12 von oben nach unten und 20 von links nach rechts darstellen zu lassen.

2. Am besten ist es, wenn wir zu unserem alten Himmel-Hintergrundbild zurückkehren. Dazu ladet ihr das Bild herunter und ersetzt damit die vorhandene Datei background.png im data-Ordner.

Teil 2: Tile (Kachel bzw. Feld) Klasse erstellen

Warum benötigen wir diese Bilder? Wir wollen am Ende folgendes Ergebnis haben:

1. Wir erstellen eine neue Klasse innerhalb des basteldroid Pakets namens Tile.

2. Wir fügen die folgenden Variablen hinzu:

    private int tileX, tileY, speedX, type;
    public Image tileImage;

1 2	private int tileX, tileY, speedX, type; public Image tileImage;

tileX ist die X-Koordinate und tileY die Y-Koordinate in unserem Feld. speedX sollte mittlerweile jedem bekannt sein und type definiert, ob wir einen Ozean darstellen oder eben Erde.

3. Wir erstellen ein Hintergrundobjekt namens bg und verweisen es auf das bg1 Objekt in der StartingClass.

    private Background bg = StartingClass.getBg1();

1	private Background bg = StartingClass.getBg1();

4. Erstellen eines Konstrukteurs.

Wie bereits erwähnt, haben unsere Bilder eine Größe von 40 x 40 Pixeln. Wir werden mit Indizes arbeiten, da dies wesentlich komfortabler ist als mit Pixeln. Daher werden wir jeden Index mit 40 multiplizieren.

Wenn wir nun den Index (0, 0) haben und diesen mit 40 multiplizieren, bekommen wir für tileX und tileY (0, 0). Wenn wir aber den Index (1, 0) haben, bekommen wir (40, 0).

    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 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;

}

5. Erstellen der update()-Methode.

Diese kennen wir schon aus den anderen Klassen unseres Spiels und sie wird bei jedem Durchlaufen der Spielschleife aufgerufen.

Als Typ 1 nehmen wir unseren Ozean. Dieser soll sich langsam im Hintergrund bewegen. Wenn aber nun unser Roboter sich bewegt, muss sich der Ozean etwas schneller bewegen.

Dabei wird euch auffallen, dass sich der Ozean langsamer bewegt als unser Roboter. Dies liegt daran, dass der Roboter viel näher ist als der Ozean im mittlerem Hintergrund. Unser Wolkenhimmel bewegt sich aber noch langsamer als der Ozean, da dieser noch weiter hinten ist.

    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 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;

}

6. Getters and Setters.

Rechtsklick in den Code, danach Source > Generate Getters and Setters…

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

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;

}

7. Die Tile-Klasse

package basteldroid;

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

}

package basteldroid;

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;

}

Teil 3: Änderungen in der Robot und Enemy Klasse

1. Da wir nun den Roboter im Vordergrund, den Ozean als mittleren Hintergrund und die Wolken als Hintergrund haben und diese sich auch unterschiedlich schnell bewegen sollen, müssen wir ein paar Anpassungen vornehmen.

Dazu gehen wir in die vierte if-Anweisung innerhalb der update()-Methode in der Robot Klasse und nehmen die folgenden Änderungen vor:

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

if (speedX > 0 && centerX > 200){

bg1.setSpeedX(-MOVESPEED/5);

bg2.setSpeedX(-MOVESPEED/5);

}

Damit wird sich der Hintergrund 1/5 langsamer bewegen als der Roboter.

2. Nun gehen wir in die Enemy Klasse und ändern Folgendes aus den selben Gründen:

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

//Verhaltensmethoden

public void update() {

centerX += speedX;

speedX = bg.getSpeedX()*5;

}

Teil 4: Hinzufügen der Tile Klasse in die StartingClass.

Hierfür werden wir nun ausschließlich in der StartingClass arbeiten.

1. Als Erstes werden wir unsere beiden neuen Bilder hinzufügen und eine neue ArrayListe Tile:

public class StartingClass extends Applet implements Runnable, KeyListener {

	private Robot robot;
	private Image image, currentSprite, character, character2, character3, characterDown, characterJumped, background, heliboy, heliboy2, heliboy3, heliboy4, heliboy5;
	public static Image tiledirt, tileocean;
	private URL base;
	private Graphics second;
	private static Background bg1, bg2;
	private Heliboy hb, hb2;
	private Animation anim, hanim;
	private ArrayList tilearray = new ArrayList();

public class StartingClass extends Applet implements Runnable, KeyListener {

private Robot robot;

private Image image, currentSprite, character, character2, character3, characterDown, characterJumped, background, heliboy, heliboy2, heliboy3, heliboy4, heliboy5;

public static Image tiledirt, tileocean;

private URL base;

private Graphics second;

private static Background bg1, bg2;

private Heliboy hb, hb2;

private Animation anim, hanim;

private ArrayList tilearray = new ArrayList();

2. Wir fügen unsere neuen Bilder zu den Bildeinstellungen hinzu:

		// Bildeinstellung
	        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");

// Bildeinstellung

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. Als Nächstes müssen wir unsere neue ArrayListe initialisieren. Dazu fügen wir den folgenden Code der start()-Methode hinzu:

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

		// Initialisieren der Tiles

		for (int i = 0; i &lt; 200; i++) {
			for (int j = 0; j &lt; 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);

				}
			}
		}

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

		// TODO Auto-generated method stub
		Thread thread = new Thread(this);
		thread.start();
	}

@Override

public void start() {

bg1 = new Background(0, 0);

bg2 = new Background(2160, 0);

// Initialisieren der 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);

}

robot = new Robot();

hb = new Heliboy(340, 360);

hb2 = new Heliboy(700, 360);

// TODO Auto-generated method stub

Thread thread = new Thread(this);

thread.start();

}

Hier führen wir eine zweifache Schleife durch, wie in Kapitel 2 Lektion 9 und 10. Die Zahlen i < 200 und j < 12 ergeben 2400 mögliche Positionen.

4. Mit der Erstellung der Tile ArrayListe müssen wir diese nun immer wieder einem Update unterziehen und die individuellen Tiles in der ArrayListe zeichnen.

Die folgenden zwei Methoden erstellen wir unter der paint()-Methode, so dass wir weiterhin Ordnung halten:

 	private void updateTiles() {

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

	}

	private void paintTiles(Graphics g) {
		for (int i = 0; i &lt; tilearray.size(); i++) {
			Tile t = (Tile) tilearray.get(i);
			g.drawImage(t.getTileImage(), t.getTileX(), t.getTileY(), 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);

}

Beide Methoden benutzen nur einen Index. In der for-Schleife wird i immer um 1 erhöht, von 0 bis 2399, so haben wir 2400 Tiles, welche wir zeichnen können.

Wenn wir nun innerhalb von g.drawImage schauen, sehen wir, dass hier das Bild gesucht und an den entsprechenden X- und Y-Koordinaten gezeichnet wird.

5. Zum Schluss müssen wir diese beiden Methoden noch aufrufen.

Die updateTile()-Methode rufen wir innerhalb der run()-Methode auf:

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

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

		<span style="color: #ff0000">	updateTiles();</span>

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

@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);

}

<span style="color: #ff0000"> updateTiles();</span>

hb.update();

hb2.update();

bg1.update();

bg2.update();

animate();

repaint();

try {

Thread.sleep(17);

} catch (InterruptedException e) {

e.printStackTrace();

}

Als Nächstes müssen wir noch dafür sorgen, dass unsere Tiles auch gezeichnet werden. Das geschieht innerhalb der paint()-Methode. Hier wollen wir, dass die Tiles hinter unseren Charakteren gezeichnet werden, aber noch vor unserem Hintergrund. Daher müssen wir die Tiles unter dem Hintergrund platzieren und noch vor unseren Charakteren:

	@Override
	public void paint(Graphics g) {
		// TODO Auto-generated method stub
		g.drawImage(background, bg1.getBgX(), bg1.getBgY(), this);
		g.drawImage(background, bg2.getBgX(), bg2.getBgY(), this);

		<span style="color: #ff0000">paintTiles(g);</span>

		ArrayList projectiles = robot.getProjectiles();
		for (int i = 0; i &lt; 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);
	}

@Override

public void paint(Graphics g) {

// TODO Auto-generated method stub

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

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

<span style="color: #ff0000">paintTiles(g);</span>

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

}

Damit sollten wir die folgende StartingClass haben:

package basteldroid;

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 basteldroid.framework.Animation;

public class StartingClass extends Applet implements Runnable, KeyListener {

	private Robot robot;
	private Image image, currentSprite, character, character2, character3, characterDown, characterJumped, background, heliboy, heliboy2, heliboy3, heliboy4, heliboy5;
	public static Image tiledirt, tileocean;
	private URL base;
	private Graphics second;
	private static Background bg1, bg2;
	private Heliboy hb, hb2;
	private Animation anim, hanim;
	private ArrayList tilearray = new ArrayList();

	@Override
	public void init() {
		// TODO Auto-generated method stub
		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
		}

		// Bildeinstellung
	        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);

		// Initialieren der Tiles

		for (int i = 0; i &lt; 200; i++) {
			for (int j = 0; j &lt; 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);

				}
			}
		}

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

		// TODO Auto-generated method stub
		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 &amp;&amp; robot.isDucked() == false) {
				currentSprite = anim.getImage();
			}

			ArrayList projectiles = robot.getProjectiles();
			for (int i = 0; i &lt; 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) {
		// TODO Auto-generated method stub
		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) {
		// TODO Auto-generated method stub
		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 &lt; 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 &lt; tilearray.size(); i++) {
			Tile t = (Tile) tilearray.get(i);
			t.update();
		}

	}

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

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

	}

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

		   switch (e.getKeyCode()) {
		   case KeyEvent.VK_UP:
			   System.out.println("Bewege dich hoch");
		   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 &amp;&amp; robot.isJumped() == false) {
				robot.shoot();
			}
			break;
		   }
	}

	@Override
	public void keyReleased(KeyEvent e) {
		// TODO Auto-generated method stub
		switch (e.getKeyCode()) {
		   case KeyEvent.VK_UP:
			   System.out.println("Stop dich zu bewegen");
		      break;

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

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

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

		   case KeyEvent.VK_SPACE:
			  break;

		   }
	}

	public static Background getBg1() {
		return bg1;
	}

	public static Background getBg2() {
		return bg2;
	}

}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

package basteldroid;

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 basteldroid.framework.Animation;

public class StartingClass extends Applet implements Runnable, KeyListener {

private Robot robot;

private Image image, currentSprite, character, character2, character3, characterDown, characterJumped, background, heliboy, heliboy2, heliboy3, heliboy4, heliboy5;

public static Image tiledirt, tileocean;

private URL base;

private Graphics second;

private static Background bg1, bg2;

private Heliboy hb, hb2;

private Animation anim, hanim;

private ArrayList tilearray = new ArrayList();

@Override

public void init() {

// TODO Auto-generated method stub

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

}

// Bildeinstellung

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

// Initialieren der 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);

}

robot = new Robot();

hb = new Heliboy(340, 360);

hb2 = new Heliboy(700, 360);

// TODO Auto-generated method stub

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) {

// TODO Auto-generated method stub

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) {

// TODO Auto-generated method stub

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 keyTyped(KeyEvent e) {

// TODO Auto-generated method stub

}

@Override

public void keyPressed(KeyEvent e) {

// TODO Auto-generated method stub

switch (e.getKeyCode()) {

case KeyEvent.VK_UP:

System.out.println("Bewege dich hoch");

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) {

// TODO Auto-generated method stub

switch (e.getKeyCode()) {

case KeyEvent.VK_UP:

System.out.println("Stop dich zu bewegen");

break;

case KeyEvent.VK_DOWN:

currentSprite = character;

robot.setDucked(false);

break;

case KeyEvent.VK_LEFT:

robot.stopLeft();

break;

case KeyEvent.VK_RIGHT:

robot.stopRight();

break;

case KeyEvent.VK_SPACE:

break;

}

public static Background getBg1() {

return bg1;

}

public static Background getBg2() {

return bg2;

}

Das Ergebnis kann sich sehen lassen:

Wir werden hier in Lektion 2 weiter machen.

Source Code

Für diejenigen unter euch, die hier einsteigen möchten, ohne den ganzen Code abtippen zu müssen, habe ich das Projekt exportiert. Mit der Importfunktion könnt ihr das Projekt bequem bei euch einfügen. Unter der Kategorie Eclipse und Java > Import und Export habe ich erklärt, was dafür zu tun ist.

Kapitel 3 Lektion 1

Falls ihr Fragen habt, immer raus damit, ich helfe euch sehr gerne. Hinterlasst bitte einfach einen Kommentar.

Teilt diese Seite mit euren Freunden und besucht uns mal auf Facebook und auf Google+, das würde dieser Seite wirklich weiterhelfen, danke sehr. Auch ein Klick auf die Werbung hilft dabei, diese Seite am Laufen zu halten.

Quelle: Original Anleitung auf englisch von Kilobolt Studios

Kapitel 3 Erstellen eines Spiels Teil 2 Lektion 2 – Level erstellen Teil 2

Basteldroid

Kapitel 3 Lektion 1 – Level erstellen Teil 1

Teil 1: Ein gemeinsamer Start

Source Code

Teil 2: Tile (Kachel bzw. Feld) Klasse erstellen

1. Wir erstellen eine neue Klasse innerhalb des basteldroid Pakets namens Tile.

2. Wir fügen die folgenden Variablen hinzu:

3. Wir erstellen ein Hintergrundobjekt namens bg und verweisen es auf das bg1 Objekt in der StartingClass.

4. Erstellen eines Konstrukteurs.

5. Erstellen der update()-Methode.

6. Getters and Setters.

7. Die Tile-Klasse

Teil 3: Änderungen in der Robot und Enemy Klasse

1. Da wir nun den Roboter im Vordergrund, den Ozean als mittleren Hintergrund und die Wolken als Hintergrund haben und diese sich auch unterschiedlich schnell bewegen sollen, müssen wir ein paar Anpassungen vornehmen.

2. Nun gehen wir in die Enemy Klasse und ändern Folgendes aus den selben Gründen:

Teil 4: Hinzufügen der Tile Klasse in die StartingClass.

1. Als Erstes werden wir unsere beiden neuen Bilder hinzufügen und eine neue ArrayListe Tile:

2. Wir fügen unsere neuen Bilder zu den Bildeinstellungen hinzu:

3. Als Nächstes müssen wir unsere neue ArrayListe initialisieren. Dazu fügen wir den folgenden Code der start()-Methode hinzu:

4. Mit der Erstellung der Tile ArrayListe müssen wir diese nun immer wieder einem Update unterziehen und die individuellen Tiles in der ArrayListe zeichnen.

5. Zum Schluss müssen wir diese beiden Methoden noch aufrufen.

Source Code