Membuat Game Gunting Kertas Batu dengan Construct 2 (Part II – Start Screen)

Sebelum melangkah ke tutorial ini, pastikan kamu sudah menyelesaikan tutorial sebelumnya dengan baik.

Langkah Kedua – Start Screen Layout

Pastikan kita bekerja hanya dengan Layout1_StartScreen yang aktif.

Tambahkan background untuk start screen kita. Klik dua kali pada layout, lalu akan muncul jendela Insert New Object. Pilih TiledBackground dan pada textbox Name when Inserted beri nama Background. Klik Insert.

Klik sembarang pada layout untuk menempatkan background tersebut (bisa klik di dalam layar putih, atau di luarnya). Akan muncul jendela baru untuk Edit Image : Background. Jendela ini berguna untuk mengupload foto yang akan kita gunakan. Klik ikon Load From File.

Akan muncul sebuah jendela Open untuk memilih foto yang akan kita gunakan. Pilih background.png.

Klik close. Gambar tersebut secara otomatis akan muncul di layout kita. Atur posisi layout tersebut menjadi X = 0 dan Y = 0 dan sizenya menjadi 480×640 pada Propertiesnya.

Selanjutnya kita akan menambahkan logo AIR Lab dan Tombol Play. Langkah-langkahnya sama dengan cara menambahkan gambar background. Hanya saja kali ini kita harus klik dua kali pada bagian biru layout. Setelah berhasil ditambahkan, atur properties logo dan tombol seperti gambar berikut.

Tampilan layout kita saat ini akan seperti gambar berikut :

Kita telah selesai mengatur tampilan Layout1_StartScreen kita. Selanjutnya, kita harus menambah objek Mouse sebagai alat interaksi dengan game kita. Tambahkan objek Mouse dengan klik dua kali pada layout, lalu pada Insert New Object pilih Mouse.

Oke, sekarang kita akan bermain dengan EventSheet untuk berpindah antar layout (pindah ke Layout2_Game).

Buka EventSheet1 dengan klik 2 kali pada windows Project atau klik kanan pada Layout -> Edit Event Sheet.

Event Sheet akan terbuka pada workspace Construct 2 kita. Perhatikan bahwa Event Sheet masih kosong. Saatnya menambah event-event pada start screen.

Klik kanan -> Add Event. Pada jendela Add Event pilih Mouse lalu klik Next.

Lalu pilih On Object Clicked. Klik Next.

Akan muncul jendela Parameters for Mouse: On Object Clicked. Isi sesuai gambar di bawah setelah itu klik Done.

Selanjutnya kita akan menambahkan Action untuk Event tersebut. Klik Add Action.

Akan muncul jendela Add Action, pilih System lalu klik Next.

Selanjutnya pilih Go to layout, lalu klik Next.

Pada jendela Parameters for System: Go to layout isi sesuai gambar di bawah, lalu klik Done.

Tampilan Event Sheet 1 sekarang :

Saatnya kita menguji progress kita sampai saat ini. Klik F5 untuk Run Game. Akan muncul game buatan kita pada Web Browser.

Lalu coba klik Play, maka tampilannya akan menjadi seperti ini :

Ini berarti kita telah berhasil berpindah dari Layout1_StartScreen ke Layout2_Game. Kenapa layarnya putih polos? Karena kita sama sekali belum mengubah Layout2_Game sehingga yang tampil sesuai dengan keadaan Layout2_Game skarang, yaitu putih polos.

Pada tutorial selanjutnya kita akan mempelajari inti dari game HomPimPa.

bersambung lagi… 🙂

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s