Teori game

OLEH : REZKI YUNIARTI, S.Si.,M.T.

MODUL 2 : Membuat Game Ular Sederhana

Lama Praktikum : 1 sesi

Tujuan : - Memahami Texture Rendering dan menggunakan class Texture
- Menggerakkan karakter game
- Mengontrol karakter menggunakan keyboard
- Memeriksa kolisi (collision detection) menggunakan koordinat

Pendahuluan
Game snake telah popular sejak pertama kali telepon selular menambahkan fasilitas game
didalamnya. Yaitu snake game dalam ponsel Nokia. Gameplay dari Snake Game akan memiliki
sama dengan Snake game yang terdapat pada ponsel Nokia. Berawal dari kepala ular, kemudian
ketika memakan apel akan memanjang. Dan akan game over ketika menabrak tubuhnya sendiri
ataupun objek lain yang dikatakan sebagai obstacle. Sehingga dalam modul ini akan dibahas
bagaimana menggerakkan tokoh ular, mengatur gerakan ular, mengenalkan mekanisme collision
detection dan memperpanjang tubuh ular jika telah memakan apel. Sebelum membuat SnakeGame
lebih lanjut, maka tentukan rule untuk gameplay yang menarik. Rule pada game tersebut
(mechanics) adalah:
1. Ular (texture snakehead) dapat bergerak ke kanan, kiri, atas dan bawah menggunakan
masukan dari keyboard
2. Ular degenerate di sisi berlawanan ketika berkolisi dengan tepian (bounding box)
3. NPC apel secara acak ditempatkan di layar, tidak boleh ditempatkan di atas karakter ular,
4. Tempatkan hanya satu karakter apel jika tidak ada apel di layar
5. Apel hilang saat berkolisi dengan kepala ular
6. Tubuh ular memanjang setelah berkolisi dengan apel

Menggerakkan Karakter Ular

Sebelumnya, telah dikerjakan project SnakeGame, silahkan dibuka kembali. Buka kembali
class GameScreen.java. Saat ini, resolusi adalah 640 x 480 piksel dan tekstur ular adalah 32 x 32.
640
= = 20
32
480
= = 15
32
Ini berarti terdapat grid 20 x 15 posisi berbeda dimana kepala ular bisa masuk. Pada Tugas B
Modul 1, snakehead dapat bergerak, namun akan menghilang setelah mencapai tepi layar.
Gdx.graphics.getWidth() dapat digunakan untuk mendapatkan nilai width layer. Periksa tepian
dilakukan untuk mencapai rule nomor 2. Tambahkan method untuk memeriksa tepian layer
sebagai berikut ini:

Program 2.1 GameScreen.java

//some code

Halaman

21 / 37
 Teori game
OLEH : REZKI YUNIARTI, S.Si.,M.T.

//some code

//some code

TUGAS : Analisa Program 2.1

Mengontrol Karakter Menggunakan Event

Jika karakter hanya dapat bergerak satu arah, maka bukan game. Harus ada arah bergerak
dan dapat dikontrol oleh pemain. Tambahkan beberapa variable tambahan untuk menetapkan nilai
arah atas, bawah, kiri dan kanan.

Kemudian untuk memeriksa status arah, dan pergerakan, tambahkan method baru yaitu
moveSnake( ) dengan tipe kembalian void. Lengkapi program 2.1

Program 2.2 GameScreen.java

//some code

//some code

Halaman

22 / 37
 Teori game
OLEH : REZKI YUNIARTI, S.Si.,M.T.

//some code
Untuk arah atas bawah, dapat mengikuti koordinat kartesian di dunia nyata. Sehingga arah ke atas
(UP) adalah :
snakeY += SNAKE_MOVEMENT;

Memeriksa Bounding Box

Arah ular tergantung dari nilai integer yang sedang aktif. Namun perhatikan tepian layer. Pada
method checkForOutOfBounds() di Program 2.1, hanya memeriksa tepian di arah kanan/width.
Tambahkan pemeriksaan di keempat bounding box lainnya.

Program 2.3 GameScreen.java

//penambahan method checkForOutOfBounds( ) pada Program 2.2

Hints : gunakan method Gdx.graphics.getHeight() untuk mendapatkan nilai Height layar.

Perbaiki method render ( )

Halaman

23 / 37
 Teori game
OLEH : REZKI YUNIARTI, S.Si.,M.T.

Tugas A
Periksa untuk setiap kondisi status arah snakehead apakah sudah sesuai?
Hints : ubah nilai private int snakeDirection = DOWN; menjadi ke-empat arah. Periksa
satu persatu.

Menambahkan Input dari Keyboard

Selanjutnya karakter ular harus dapat dikendalikan oleh pemain (lihat rule nomor 1).
Terdapat dua cara untuk mencapainya. Pertama dapat menggunakan event polling, yaitu membuat
query dari kondisi input dan memperbaharui (update) game. Secara umum, event polling ini akan
terjadi selama loop game, tepat sebelum rendering. Cara kedua adalah menggunakan event
listener. Akan dicoba menggunakan cara pertama. Tambahkan method baru dengan menggunakan
variable pada input keys. Silahkan pelajari Input.Keys pada LibGDX API :
https://libgdx.badlogicgames.com/ci/nightlies/docs/api/com/badlogic/gdx/Input.Keys.html

Program 2.4 GameScreen.java

Tambahkan pada method render untuk pemanggilan queryInput( )

Halaman

24 / 37
 Teori game
OLEH : REZKI YUNIARTI, S.Si.,M.T.

Tugas B
1) Game harus bisa menerima input dari keyboard untuk menentukan arah jalan snakehead.
2) Berikan penjelasan mengenai method isKeyPressed
3) Berikan penjelasan mengenai Input.Keys

Menambahkan Asset Lainnya

Berikutnya adalah menambahkan karakter lainnya, yaitu buah apel yang dapat dimakan
oleh karakter ular. Sesuai dengan gameplay maka rule untuk NPC apel ini adalah:
1. Secara acak ditempatkan di layar, tidak boleh ditempatkan di atas karakter ular,
2. Tempatkan hanya satu karakter jika tidak ada apel di layar
3. Hilang saat berkolisi dengan kepala ular
Tambahkan variable bertipe Texture untuk karakter apel (sama seperti pada Modul 1 saat
menambahkan karakter snakehead). Variable apelavail digunakan sebagai penanda untuk
memeriksa apakah apel tersedia. Dan sertakan juga koordinat apel.

Periksakan apakah apel tersedia (memenuhi syarat untuk ditampilkan di layar), jika memenuhi
syarat (true) maka apel akan digambarkan di layer saat rendering. Tambahkan code di dalam
method render( )

Program 2.5 GameScreen.java

Penggunaan Random
Apel harus diletakkan secara random sesuai dengan gameplay. Namun peletakan apel
hanya dapat dilakukan dengan mempertimbangkan nilai apelavail. Method random dapat

Halaman

25 / 37
 Teori game
OLEH : REZKI YUNIARTI, S.Si.,M.T.

menggunakan method static MathUtils.random(int range). Penempatan apel dilakukan

secara random. Seperti Gambar 2.1

Gambar 2.1 Penempatan apel secara random

Tambahkan method checkAndPlaceApple() untuk melakukan random posisi apel (lihat

rule game nomor 3), pastikan periksa posisi apel agar tidak sama dengan snakehead. Dan periksa
bahwa hanya terdapat 1 apel yang tampil di layar dengan melihat status apelavail (lihat rule game
nomor 4)

Program 2.6 GameScreen.Java

Perbaiki method render( ), tambahkan method checkAndPlaceApple( ). Agar render( ) lebih

fleksibel, pecahkan method untuk clear screen dan draw. Seperti berikut ini :

Halaman

26 / 37
 Teori game
OLEH : REZKI YUNIARTI, S.Si.,M.T.

Hints : di dalam method draw berisi semua pekerjaan penggambaran yang dilakukan objek batch
(instance dari SpriteBatch)

Tugas C
1. Buatlah method clearScreen( ) dan draw( ), serta perbaiki render( )
2. Snakehead harus sudah berjalan, dan terdapat apel yang ditempatkan secara random. Cobalah
running gradlew berkali-kali dan perhatikan apakah posisi apel berubah-ubah?

Menambahkan Kolisi
Rule berikutnya adalah jika snakehead berkolisi dengan apel, maka apel akan menghilang
(lihat rule game nomor 5). Secara sederhana, hal ini dapat dilakukan dengan memeriksa posisi
apel dan snakehead apakah pada posisi yang sama atau tidak. Tambahkan method
checkAppleCollision() untuk memeriksa kolisi

Program 2.7 GameScreen.java

Tambahkan method checkAppleCollision() dimana berisi kondisi :
Jika apelavail dan posisi apel == posisi snakehead bernilai true, maka nilai apelavail berubah
kembali menjadi false.

Tugas D
1. Buatlah method checkAppleCollision() dan tambahkan pemanggilan checkAppleCollision() di
dalam render( )
2. Selesaikan Program 2.7

Penambahan Panjang Snake Body

Selanjutnya untuk mencapai gameplay yang direncanakan, rule game nomor 6 adalah,
tubuh ular akan memanjang ketika berkolisi dengan apel. Untuk mencapai rekuiremen ini, maka
mechanics yang diperlukan adalah :
a) Tambahkan bagian tubuh ke ular ketika memakan apel
Halaman

27 / 37
 Teori game
OLEH : REZKI YUNIARTI, S.Si.,M.T.

b) Saat ular bergerak, bagian-bagian tubuh harus mengikuti

c) Akan ada beberapa bagian tubuh
Untuk mencapai hal ini, dapat dibuat sebuah class baru, untuk kemudahan berkomunikasi data,
letakkan class di dalam GameScreen (inner class). Class ini akan mengelola bagian tubuh ular saja.

BodyPart
x:int
y:int
tekstur : Texture
updatePosisi (x:int, y:int)
draw(batch:Batch)
BodyPart akan memiliki koordinat x, y dan tekstur. Tekstur dapat diinisialisasi di konstruktor
BodyPart. Hal ini akan membuat objek BodyPart dapat berganti Texture sesuai kebutuhan (lebih
dinamis). BodyPart memiliki behavior update (setter) nilai posisi x dan y. juga memiliki behavior
menggambar atau draw. Jika posisi snakehead dan body sama, maka tidak Digambar. Artinya nilai
posisi snakehead dan body harus berbeda supaya dapat Digambar.

Program 2.7 BodyPart

Tugas E
Pelajari class Batch

Program 2.8 GameScreen.java

a) Berikutnya tambahkan variable snakebody :
private Texture snakebody;
sebagai instance variable di class GameScreen.

Halaman

28 / 37
 Teori game
OLEH : REZKI YUNIARTI, S.Si.,M.T.

b) Tambahkan code untuk instansiasi objek snakebody dan melakukan inisialisasi menambah
Texture snakebody.png di method show( )
c) Gunakan generics variable untuk menyimpan bodypart ke dalam Array bodyparts.
Deklarasikan di instance variable class GameScreen.java
private Array<BodyPart> bodyParts = new Array<BodyPart>();

d) Lihat pada rule a, yaitu menambahkan bodypart jika snakehead memakan apel. Untuk itu
perbaiki method checkAppleCollision(), jika berkolisi dengan apel, maka tambahkan bodypart
ke dalam Array bodyParts.

Proses rendering texture snakebody dilakukan dengan memanggil texture yang sama yaitu
snakebody.png.

Tugas F
Analisa method checkAppleCollision(), jelaskan dengan detail.

TUGAS AKHIR
1. Lengkapi program, hingga tercapai game mechanics rule a) hingga c). tambahkan code berikut
ini:

Halaman

29 / 37
 Teori game
OLEH : REZKI YUNIARTI, S.Si.,M.T.

Analisa dari penambahan code tersebut

2. Perbaharui method render( )

3. Perbaharui method draw ( )

4. Akhir modul 2 harus menampilkan ular yang berjalan sesuai dengan control pemain, apel
tersimpan random di layar. Jika ular memakan apel, maka badan memanjang, dan apel akan di
generate di lokasi lain
5. Analisa seluruh code yang ditambahkan di tugas akhir
6. Kumpulkan laporan minggu ke-3 praktikum

Halaman

30 / 37