Game Ghost Shooter #1

Pembuatan Game Ghost shooter

Materi bisa didapat di https://www.scirra.com/tutorials/37/beginners-guide-to-construct-2/page-1

1.    Membuat Background
Setelah memilih project baru maka kita akan dihadapkan pada tampilan halaman kerja utama,  langkah pertama adalah membuat background.  Untuk membuat background siapkan gambar yang akan menjadi background game kita, pada pelajaran ini telah disiapkan file gambar untuk dijadikan background.

 (klik kanan pada image dan pilih save image / simpan gambar) untuk mengambil gambar



Double click pada sembarang tempat di halaman utama (layout 1) maka akan muncul kotak dialog insert new object

 

Pilih tiled background dan pada layar utama akan muncul tanda “ + “ , arahkan disembarang tempat dan klik mouse,

 Setelah di klik maka akan muncul kotak dialog edit image,

klik icon open dan pilihlah file background (bg.png) kemudian tutup kotak dialog edit image.

Sampai isini kita sudah berhasil memasukkan gambar background pada layar kerja kita, akan tetapi, background ini belum sempurna, untuk menyempurnakannya, kita lihat pada tab properti (kiri). Pada baris position diganti dengan nilai 0,0 nilai ini menunjukan koordinat (x,y) awal dari file gambar yang akan kita buat, kemudian kita akan juga mengganti nilai baris size , nilai size ini sebaiknya merupakan resolution dari layout halaman kerja kita, untuk mengetahui nilainya kita dapat mengklik sembarang tempat di bagian putih dan melihat nilai pada baris size , pada kali ini didapat nilai sebesar 1708, 960. Maka setelah diganti tampilan akan berubah menjadi :

Selamat, kita telah mendapatkan layout pertama kita dengan gambar penuh. Berikut ini beberapa tips untuk langkah-langkah yg telah kita kerjakan.

Tips :
1.    Kita dapat langsung memasukan gambar background langsung ke layout dengan menggunakan metode seret dan taruh (drag and drop) dari file background.
2.    Untuk men zoom in / out layar dapat menggunakan tombol crtl disertai scroll pada roda mouse.

Langkah Selanjutnya adalah menambahkan layer (lapisan) baru, layer ini berguna untuk mengelompokan mana objek yg bekerja di bagian depan atau objek yg bekerja di bagian belakang. Untuk mengatur layer kita dapat pergi menuju tab project (kanan)

 Klik tanda + untuk menambah layer baru. Construct 2 menghitung mulai dari 0, pada programing perhitungan ini lazim digunakan, akan kita dapati 2 layer yaitu layer 0 dan layer 1, pada layer 1 klik kanan dan pilih rename, gantilah layer 0 menjadi background (Enter untuk selesai) kemudian klik ke icon gembok, disini kita melihat icon gombok yg semula terbuka akan menjadi terkunci. Hal ini bertujuan untuk mengunci layer background agar kita dapat bekerja dengan sempurna pada berikutnya. Lakukan rename juga untuk layer 1 menjadi main, kemudian sorot layer main, hal ini penting karena untuk memastikan kita bekerja pada layer main, bukan pada layer background.

 2.  Menambahkan Objek

Double klik pada lembar kerja utama, akan muncul kotak dialog insert new object pilih mouse sebagai objek, ulangi dan pilih keyboard sebagai objek berikutnya.

Pada pelajaran ini kita membutuhkan input mouse dan keyboard. Objek mouse dan keyboard bersifat tersembunyi (hidden) dan umum (global) yang berarti setiap layout dapat menerima perintah dari mouse atau keyboard.

Berikutnya kita akan memasukan 4 objek baru kedalam game, objek tersebut adalah :
Prosesnya hampir sama dengan memasukan gambar background, yaitu dengan double klik pada sembarang tempat dan pilih objek “sprite”, penempatan objek-objek ini pada saat tanda + muncul dapat mengikuti gambar berikut ini.

Perlu di ingat dan dipastikan pada saat ini kita bekerja pada layer main, bukan background. Untuk sprite peluru dan ledakan dapat kita geser keluar layar, karena sementara ini kita tidak perlu melihat objek tersebut. Penamaan objek masih secara default yaitu sprite, sprite2, sprite3 dan sprite4 , agar tidak membingungkan kita ganti nama sprite tersebut sesuai dengan objeknya, contoh sprite di ganti menjadi player. Cara mneggantinya dengan meng klik objek yg diinginkan, lihat pada tab propertinya (kiri) dan ganti baris nama.
Lakukan hal yang sama untuk tank, peluru dan ledakan

Menambah Behavior (Perilaku)

Behavior (Perilaku) adalah salah satu fungsi dasar dari construct2. Sebagai contoh kita dapat menambahkan paltform behavior pada sebuah objek atau solid behavior pada objek lantai, sehingga kita dapat melompat dan berjalan diatas objek lantai. Beberapa behavior utama di construct 2 antara lain :
1.    8 Direction. Objek akan bisa bergerak ke semua arah layar menggunakan keyboard,  biasanya digunakan pada objek player
2.    Bullet Movement. Objek akan otomatis bergerak lurus ke satu arah tertentu
3.    Scroll to. Layar akan mengikuti pergerakan objek yg menerapkan behavior ini
4.    Fade. Objek akan menghilang secara gradasi (bertahap)
5.    Destroy Outside Layout. Ketika objek meninggalkan layar dan kita sudah tidak memerlukannya lagi, maka behavior ini sebaiknya digunakan untuk menghemat sumber daya.
Oke, sekarang kita akan coba menerapkan behavior pada objek pertama kita yaitu player. Behavior pertama yang akan ditambahkan pada player adalah 8 direction, caranya dengan mengklik objek player dan lihat pada tab properti (kanan). Pada baris Behavior klik    add/edit | Behavior    maka akan muncul kotak dialog seperti ini.

Klik tanda + untuk menambah behavior
Tambahkan 8 direction untuk objek player, tambahkan juga bound to layout dan scroll to behavior pada objek Player, sehingga menjadi

Tutup kotak behaviors dan kita akan coba menjalankan layout nya, klik run pada panel atas

Tampilan Akan terbuka pada browser (firefox / chrome) coba gerakan dengan menggunakan keyboard panah. Layar akan mengikuti pergerakan objek (scrollto behavior) dan boundtolayout behavior akan tetap menjaga agar objek selalu berada didalam layout

Ok, sekarang kita siap untuk menambahkan behavior behavior pada objek objek lainnya

1.       untuk objek bullet diberikan behavior bullet movement dan destroy outside layout

2.       untuk objek Monster diberikan behavior bullet movement

3.       untuk objek explotion diberikan behavior fade

disini kita lihat bahwa objek monster dan objek bullet memiliki behavior yang sama yaitu bullet movement, akan tetapi untuk kecepatan pergerakannya harus dibedakan,  maka diatur untuk kecepatan monster dengan memberikan nilai 200 pada baris speed, sedangkan untuk bullet tetap pada nilai awalnya (400)

langkah berikutnya adalah meng klon objek monster, karena kita menginginkan musuh yang lebih dari 1, caranya cukup mudah, yaitu dengan menekan tahan tombol crtl dan mengklik seret kursor mouse pada objek monster. Buatlah 6 – 7 klon objek monster.

Tampilan layout setelah kloning.