Hosting Unlimited Indonesia

Membuat Game Penjumlahan dengan Construct 2 Bagian 2

  • Fajrul Aslim

    Full Stack Developer
    11 Juni 2020, 42x dilihat

 

Melanjutkan tutorial sebelumnya Membuat Game Penjumlahan dengan Construct 2 Bagian 1, pada tutorial bagian 1 saya menjelaskan bagaimana proses pembuatan desain layout atau tampilan pada game. Pada kesempatan kali ini saya akan menjelaskan bagaimana memberikan event agar game dapat berjalan. Langsung saja kita buka kembali file project kita sebelumnya, lalu kita buka panel Event.

 

 

Pertama-tama kita buat terlebih dahulu 5 buah global variabel dengan carai klik kanan pada panel Event, lalu pilih Add global variable. Isi kolom Name dengan nama angka0, kolom Type dengan Number, dan kolom Initial value dengan angka 0.

 

    

 

Dengan cara yang sama silahkan buat juga keempat buah global variabel lainnya dengan Type dan nilai initial value yang sama dengan global variabel angka0. Beri masing-masing variabel dengan nama angka1, jawaban, totalBenar, dan btnJawab.

 

 

Selanjutnya kita buatkan sebuah event Function dengan cara mengklik tulisan/tombol Add event pada panel event yang posisinya tepat berada dibawah global variabel yang baru saja kita buat (perhatikan gambar di atas). Sehingga akan muncul panel Add Event, kita pilih Function, lalu kita klik On function

 

   

 

Maka akan muncul jendela Parameters fo Function: On function. Pada kolom Name kita isi dengan "acakAngka", lalu klik tombol Done.

 

 

Kita baru saja membuat function dengan nama "acakAngka". Function ini belum berisi action apapun, sebelum kita beri action kita tambah kembali sebuah event. Klik Add event, pilih System, lalu pilih On Start of layout, terakhir klik tombol Done.

 

   

 

Kita akan menambahkan action pada event System on Start of layout. Pada sebelah kanan event, terdapat tulisan/tombol Add action, klik Add action, pilih Function, lalu pilih Call function. Maka akan muncul jendela Parameters fo Function: Call function. Pada kolom Name kita isi dengan "acakAngka", lalu klik tombol Done. Sehingga panel event akan tampak seperti gambar berikut:

 

 

Penjelasan dari baris kedua atau yang baru saja kita lakukan, kurang lebih seperti ini. Pertama kita menambahkan sebuah event On start of layout yang berarti saat pertama kali program dijalankan. Apa yang pertama kali akan dijalankan? Pada perintah Add action kita menambahkan perintah Call function "acakAngka". Jadi, saat pertama kali program dijalankan, kita akan memanggil fungsi "acakAngka", yang fungsi ini akan kita beri action setelah ini.

 

Sekarang, mari kita beri action pada function "acakAngka". Klik Add action, pilih Set value, kemudian tekan tombol Next. Maka akan tampil kotak dialog Parameter for system: Set value. Pada kolom variable kita pilih global variable angka0. Kemudian, pada kolom value kita isi dengan "floor(random(0,11))" tanpa tanda petik. Terakhir klik tombol Done.

 

   

 

Jadi, ketika fungsi "acakAngka" dijalankan, kita ubah nilai dari variable "angka0" menjadi angka acak antara 0 sampai 10. Selanjutnya, tambahkan kembali beberapa action dengan rincian sebagai berikut:

 

1. Set value variable angka1 menjadi floor(random(0,11))

2. Set value variable btnJawab menjadi floor(random(0,2))

3. Set value variable jawaban menjadi angka0 + angka1

 


 

Sekarang, kita buat sebuah fungsi baru dengan menambah sebuah event. Kita beri nama fungsi tersebut "cetakPertanyaan" yang berfungsi untuk mencetak soal pertanyaan pada game. Kemudian kita panggil fungsi tersebut pada fungsi "acakAngka". Sehingga tampilan eventnya akan seperti ini:

 

 

Pada function "cetakPertanyaan", mari kita tambahkan beberapa action. Klik tombol Add action, pilih object txtPertanyaan, kemudian pilih Set Text, lalu klik tombol Next.

 

   

 

Maka akan muncul kotak dialog Parameters for txtPertanyaan: Set Text. Pada kolom Text, isi dengan angka0 &" + "& angka1 & "= ?". Lalu klik tombol Done. Perhatikan gambar.

 

 

 

Selanjutnya, kita buat sebuah fungsi baru dengan menambah sebuah event. Kita beri nama fungsi tersebut "cetakTombol" yang berfungsi untuk mencetak pilihan jawaban pada game. Kita akan menambahkan sub-event pada event fungsi "cetakTombol". Pada event "cetakTombol" terdapat gambar panah berwarna hijau. Klik kanan pada panah hijau tersebut, lalu pilih Add, kemudian pillih Add sub-event (S).

 

 

Pada kotak dialog Add event, pilih Compare variable, dan tekan tombol Next. Kemudian pada kotak dialog Parameters for system: Compare variable pada kolom Name pilih global variabel btnJawab, pada kolom Comparison pilih = equal to, dan pada kolom value isi dengan nilai 0. Terakhir tekan tombol Done. Maka panel event akan tampak seperti pada gambar di bawah ini.

 

 

Pada sub-event yang baru kita buat, tambahkan 2 buah action. Pertama, klik Add action, pilih object btnJawab0, lalu pilih Set text. Pada kotak dialog Set text isi kolom text dengan "jawaban" tanpa tanda petik. lalu klik tombol Done. Kedua, klik Add action, pilih object btnJawab1, lalu pilih Set text. Pada kotak dialog Set text isi kolom text dengan "jawaban + floor(random(-3,3))" tanpa tanda petik. lalu klik tombol Done.

 

   

 

Selanjutnya, kita tambahkan sub-event pada event "cetakTombol" dengan kondisi btnJawab0 = 1.Kita beri action dan kita lakukan set text pada object btnJawab0 bernilai "jawaban + floor(random(-3,3))" dan pada object btnJawab1 bernilai "jawaban". Kebalikan dari sub-event btnJawab0 = 0.

 

 

Jadi, pada fungsi "cetakTombol" terdapat dua kondisi, kondisi pertama adalah ketika global variable btnJawab = 0, maka kita buat agar text/object btnJawab0 adalah kunci jawabannya. Sedangkan btnJawab1 adalah jawaban pengecohnya atau jawaban yang salah. Namun jika global variable btnJawab = 1, maka kita buat agar text/object btnJawab1 adalah kunci jawabannya. Sedangkan btnJawab0 adalah jawaban pengecohnya atau jawaban yang salah.

Silahkan uji coba game pada browser dengan menekan tombol Menu, Run layout.

 

 

Demikin tutorial cara membuat game penjumlahan menggunakan Construct 2 bagian 2. Pada tutorial selanjutnya saya akan menjelaskan bagaimana memberikan event ketika user memilih jawaban dan bagaimana responnya.

 

Terima Kasih.

 

DOWNLOAD SOURCE CODE

 

Membuat Game Penjumlahan dengan Construct 2 Bagian 1

Membuat Game Penjumlahan dengan Construct 2 Bagian 3