Pengembangan Game dengan Flash Develop

Pendahuluan

Game Flash mengalami perkembangan yang sangat signifikan sejak satu dekade terakhir. Ribuan game flash dapat

ditemukan dengan mudah dan bertambah terus setiap harinya. Sebagian besar pengguna komputer pernah

memainkan game Flash, baik itu memainkannya lewat situs game online, memainkan game faceboook, game

desktop sampai dengan game mobile. Alasan utama perkembangan game flash yang begitu signifikan adalah Flash

Player (program yang digunakan untuk menjalankan file bertipe SWF) telah terinstal hampir 96% di internet browser,

pasar dari game flash yang terbuka sangat lebar dan selain itu mengembangkan game flash relatif lebih mudah.

Pada saat ini menggembangkan game Flash tidaklah harus menghasilkan output game browser, akan tetapi akan

lebih “menguntungkan” apabila kita dapat menghasilkan sebuah produk yang Multiplatform atau dapat di release di

beberapa media sekaligus seperti internet browser, desktop, Android, dan iOS. Untuk melakukan hal tersebut kita

dapat memanfaatkan Adobe AIR. Adobe AIR sendiri merupakan sebuah aplikasi yang dapat menjalankan perintah

action script dan dapat berjalan hampir disemua media.

Desain Game

Sebelum lebih lanjut memahami proses pembuatan game, terlebih dahulu kita harus memahami konsep mendesain

game itu sendiri. Desain game meliputi proses mewujudkan sebuah game dari sebuah ide menjadi sebuah produk

yang dapat dimainkan. Perlu dipahami bahwa tidak ada aturan baku atau standarisasi mendesain sebuah game.

Sebagai contoh ketika mendesain game Tetris akan sangat berbeda jika dibandingkan dengan mendesain game

platform seperti Super Mario. Sama dengan penggunaan tampilan grafis, game dengan grafis 2D akan berbeda

proses pembuatannya dengan game 3D. Walaupun demikian terdapat karakteristik yang sama dalam

mengembangkan suatu game, yang mana hal tersebut dapat diaplikasikan pada sebagian besar proses mendesain

suatu game.

Beberapa hal yang ditulis disini berdasarkan pengalaman penulis selama bekerja di dunia game baik bekerja secara

tim, maupun bekerja secara individu. Hal pertama yang perlu kita pahami dalam membuat game adalah mengetahui

kemampuan, kelebihan dan kelemahan diri sendiri dalam membuat game. Apabila anda atau tim anda baru belajar

membuat game atau memiliki sedikit pengalaman dalam mengembangkan game, maka game dengan logika

sederhana dan penggunaan grafik yang tidak terlalu kompleks akan sangat baik untuk dijadikan sebagai media

belajar, janganlah melompat ke game yang terlalu kompleks.

Setelah mengetahui kelebihan dan kelemahan diri atau tim pengembang game, maka anda bisa memulai mencari

ide terbaik untuk diwujudkan. Terdapat beberapa proses dalam mendesain sebuah game secara umum, yaitu:

Menentukan Ide Game

Tahapan pertama ini adalah tahapan yang paling penting dalam membuat sebuah game yaitu ide. Ide game meliputi

pertanyaan tentang bagaimana game tersebut dimainkan, apakah tujuan dari memainkan game tersebut, apakah

pemain akan memainkan game secara berulang –ulang atau hanya sekali, apakah game tersebut nantinya

menyenangkan dan berbagai gambaran secara umum tentang game yang akan anda buat tersebut.

Karena menggunakan istilah desain game, secara otomatis dalam menggembangkan sebuah game harus melalui

langkah-langkah desain pada umumnya. Setelah sebuah ide telah ditemukan, maka terdapat beberapa tahapan

dalam membuat sebuah game yang harus dilalui, yaitu: design treatment, assets development phase, programming

phase, testing phase dan post mortem.

Design Treatment

Design treatment merupakan sebuah istilah desain yang mengandung pengertian analisis tentang produk apa yang

akan dibuat dan apa yang dibutuhkan untuk membuatnya. Pada tahapan ini sebuah ide harus melalui sebuah proses

analisis secara mendalam tentang game tersebut diantaranya adalah :

- Kategori dan fitur utama dari game yang akan dibuat. Apakah masuk ke kategori action, shooting, racing

atau yang lain.

- Siapakah target audience game yang akan dibuat, apakah remaja, anak-anak atau orang tua.

- Setting seperti apakah yang akan diberikan kepada pemain. Apakah game memberikan sebuah komedi,

tampilan horror, retro, atau sesuatu yang benar-benar baru.

- Akan dibagi menjadi berapa level atau berapa misi. Jika itu game bertipe racing akan ada berapa track atau

lintasan balap dan sebagainya.

- Bagaimana tampilan visual yang akan dipakai, apakah 3D atau 2D. Seberapa detail, vector, bitmap, pixelart,

prerender semua harus ditentukan dalam tahapan ini.

- Bagaimana dengan produk kompetitor. Apakah ada game sejenis yang sudah ada sebelumnya. Jika ya, apa

yang menyebabkan game yang akan dibuat lebih unggul, apakah lebih baik dari segi gameplay atau dari

segi tampilan visual. Selain itu juga perlu dipikirkan fitur apa yang akan menjadi nilai jual dari game tersebut,

apakah yang menyebakan pemain lebih memilih memainkan game tersebut daripada game yang lain.

- Berapakah budget yang disiapkan dan lamanya waktu untuk mewujudkan ide tersebut.

Semua hal yang terkait dengan ide yang akan kita wujudkan perlu didokumentasikan dalam bentuk catatan atau

sebuah sket gambar untuk mempermudah gambaran anda atau tim anda dalam mewujudkannya.

Criss Crawford dalam bukunya Game Design menyatakan bahwa pada tahapan ini ada terdapat tujuan utama yaitu

menghasilkan tiga hal: struktur input-output game, struktur game dan struktur pemrograman.

1. Struktur Input-Output

Bagian ini membahas tentang hubungan interaksi antara pemain dengan game yang dimainkan. Game

mendapatkan input dari pemain berupa respon dari keyboard atau mouse, kemudian game merespon

dengan sebuah output berupa tampilan visual dan suara.

Hal yang perlu diperhatikan adalah grafis dari sebuah game dibuat karena suatu alasan, yaitu untuk

mengkomunikasikan sesuatu. Sehingga pembuatan grafis selain sebagai emphasis dari sebuah game, juga

harus mendukung gameplay dari game yang dibuat.

Penggunaan keyboard atau mouse sebagai input game, juga perlu diperhatikan. Setiap input yang

dilakukan oleh pemain harus direspon dengan tepat, agar pemain tidak menganggap ada suatu kesalahan

dengan game yang mereka mainkan. Sebagai contoh dalam sebuah game racing ketika pemain menekan

keyboard untuk mengendalikan mobil, pemain menginginkan pengalaman mengemudi yang sesungguhnya.

Input yang terlalu responsif atau terlalu lambat akan mengakibatkan sebagian pemain mengalami

kebosanan. Sehingga keseimbangan antara input yang diberikan oleh pemain dengan output yang

ditampilkan oleh game perlu dijaga optimal mungkin untuk menciptakan sebuah gameplay yang menarik.

Pada tahapan design treatment perlu dijelaskan secara mendetail tentang input dan output, sedangkan

untuk mendapatkan pengaturan yang tepat dapat dilakukan pada tahapan testing phase.

2. Struktur Game

Permasalahan utama dalam mendesain struktur game adalah menggabungkan sebuah ide dan keinginan

pemain dalam sebuah gameplay yang menarik. Ketika mendesain sebuah gameplay yang harus

diperhatikan adalah bagaimana menjadikan pemain selalu memiliki sesuatu yang menarik untuk dilakukan.

Sebagai contoh dalam game populer Tower Defense pemain harus menggunakan strategi yang tepat untuk

mempertahankan bentengnya dari musuh yang datang secara bergelombang. Hal yang menarik dalam

game tersebut adalah di setiap level selalu ada tantangan baru yang membutuhkan strategi baru, pemain

harus memikirkan cara baru sehingga pemain tidak cepat bosan.

Ada beberapa hal yang harus diperhatikan dalam membuat gameplay, yaitu :

- Pastikan pemain memiliki tujuan yang jelas dengan memainkan game tersebut. Sebagai contoh pada

game Ace Trucker (www.froyogames.com) pemain harus memarkir truk ke area parker tertentu.

- Pastikan memiki hambatan atau tantangan. Gameplay yang baik adalah game yang mudah untuk

dipelajari dan dimainkan, akan tetapi sulit untuk ditaklukkan, dan game yang baik selalu menawarkan

tingkat kesulitan yang bergerak naik siring waktu yang dihabiskan oleh pemain dalam memainkan

game. Sebagai contoh game populer Angry Bird (copyright Rovio) memiliki hambatan berupa

http://www.froyogames.com/

rintangan blok batu, kayu dan kaca, yang masing-masing level memiliki tingkat kerumitan tertentu.

Pemain dengan mudah memainkan game tersebut, akan tetapi untuk menaklukan semua level dengan

nilai teratas adalah hal yang sangat sulit dan perlu dimainkan beberapa kali.

Gambar 1. Game Angry Bird (Rovio)

- Berikan pemain sebuah imersi atau kesan yang membawa pemain masuk kedunia game yang dibuat.

Imersi bisa dibuat dengan mengadaptasi kondisi dunia nyata ke dalam game. Sebagai contoh dalam

game Ace Trucker pemain akan merasakan sulitnya mengendalikan sebuah truk dengan muatan berat

di belakangnya. Akselerasi truk yang lambat dan respon kendali truk yang dibuat lambat, memberikan

imersi kepada pemain bahwa memutar roda kemudi sebuah truk cukup sulit, selain itu mengemudikan

truk juga harus memperhatikan ukuran truk yang relatif lebih panjang, sehingga manuver yang

dilakukan pemain harus memperhatikan banyak hal seperti apa yang terjadi di dunia nyata.

Gambar 2. Imersi mengendarai sebuah truk

- Tampilkan sebuah sistem reward and punishment dengan tepat. Reward adalah sesuatu yang akan

didapatkan pemain ketika melakukan sesuatu yang benar, dan sebaliknya punishment adalah hukuman

yang didapatkan jika pemain melakukan kesalahan. Reward dan punishment akan memaksa pemain

untuk mempelajari pola tertentu sehingga pemain memiliki alasan yang tepat untuk memainkan game

dalam waktu yang lama.

Gambar 3. Sistem reward pada Ace Trucker

3. Struktur Pemrograman

Struktur pemrograman adalah sebuah struktur yang menjembatani antara stuktur input-output dengan

struktur game, sehingga menjadi sebuah produk game secara utuh. Pada tahapan ini yang harus

diperhatikan dalam adalah arah kerja (workflow) yang akan dilakukan. Secara umum tahapan pemrograman

dimulai dari pengerjaan kode utama (engine) yaitu kode yang menyusun gameplay dari sebuah game,

dilanjutkan dengan pengerjaan kode tambahan seperti efek-efek yang ditampilkan dalam game, pengaturan

sistem score, pengaturan halaman pembuka dan penutup game.

Setelah tahapan desain treatment sudah dilalui, tahapan selanjutnya adalah assets development dan programming

phase. Beberapa developer game mendahulukan aset, kemudian mengerjakan bagian pemrogramannya, atau

sebaliknya mengerjakan bagian programming kemudian membuat aset yang diperlukan. Apabila game development

dikerjakan oleh tim, kedua proses tersebut dapat dikerjakan secara bersamaan berdasarkan dokumen desain yang

telah dibuat pada tahapan desain treatment.

Game Assets Development Phase

Pada tahapan ini aset-aset utama, berupa asets visual dan suara dibuat. Asets visual meliputi grafik yang akan

dipakai sebagai karakter dalam permainan, efek visual, typografi (pengggunaan huruf) dan grafik untuk keperluan

interface. Pada umunya tahapan ini lebih mudah dilakukan oleh game artist, karena membutuhkan skill grafis dan

kepekaan estetik.

Gambar 4. Visual game asets game Ace Trucker.

Programming Phase

Pada tahapan ini kode dibuat, dibutuhkan sebuah ketelitian yang tinggi, karena pemrograman menuntut sebuah

ketepatan. Kesalahan penulisan kode menyebabkan game tidak dapat decompile, sehingga hal tersebut tidak dapat

ditolerir. Pekerjaan programming dapat dilakukan oleh semua orang, akan tetapi pengetahuan terhadap logika

pemrograman, pengalaman dalam menghadapi kode dan pengetahuan terhadap teknologi yang baik sangat

menentukan, sehingga pekerjaan ini lebih mudah dilakukan oleh programmer.

Untuk mempermudah proses programming, diperlukan sebuah workflow atau flowchart. Perhatikan contoh workflow

dari game Ace Trucker berikut:

Gambar 5. Flowchat pemrograman Ace Trucker.

Testing Phase

Tahapan testing adalah sebuah proses pengumpulan informasi untuk memperbaiki segala kesalahan desain dan

kesalahan programming. Tahapan ini diperlukan sebagai bentuk quality control dari game yang dibuat. Dari tahapan

ini akan diketahui berbagai kesalahan, atau peluang-peluang yang dapat dimanfaatkan pemain untuk mencurangi

game, dan untuk mendapatkan gameplay yang seimbang.

Tahapan testing harus dilakukan oleh beberapa orang dengan tingkat keahlian yang berbeda, sehingga akan

didapatkan masukan dari berbagai sudut pandang, apakah game terlalu sulit atau terlalu mudah. Dari masukan-

masukan tersebut dilakukan perbaikan ulang, untuk memperoleh hasil akhir yang benar-benar siap dilempar ke

konsumen.

Post Moterm

Setelah melalui tahapan testing, maka game siap untuk dilepas ke pasar atau diistilahkan dengan publishing. Pemain

game yang dalam hal ini adalah pemain global dari berbagai penjuru dunia akan memainkan dan memberikan

perilaku yang berbeda terhadap game yang anda buat. Kritik dan pujian terhadap game akan datang seiring dengan

kualitas game yang anda buat. Hal yang harus kita perhatikan adalah kritik tersebut harus diseleksi dan akan menjadi

bahan perbaikan yang sangat bermanfaat untuk perbaikan proyek game selanjutnya.

Persiapan Software

Untuk membangun sebuah game Android berbasis Flash diperlukan beberapa software, yaitu :

1. Flash Develop

2. Adobe Flash

3. Adobe Photoshop

Flex SDK

Flex SDK merupakan framework (kerangka kerja), kumpulan perintah yang dapat dipergunakan untuk membangun

sebuah aplikasi interaktif yang mampu berjalan dibawah platform Flash Player dan Adobe AIR. Flex SDK merupakan

sebuah kode open source yang dapat dipakai bersama dengan Adobe Flex Builder, atau dengan menggunakan

Flash Develop.

Untuk mendapatkan Flex SDK dapat didownload di http://www.adobe.com/devnet/flex/flex-sdk-download-all.html

Gambar5. Halaman download Flex SDK

Flash Player

Flash Player adalah sebuah aplikasi yang diperlukan untuk menjalankan file bertipe SWF. Pada saat buku ini ditulis,

Flash Player terbaru adalah versi 11. Flash Player versi 11 memiliki beberapa fitur baru diantaranya adalah

penggunaan stage3D, yaitu pemanfaatan AGAL untuk performa grafik 2D maupun 3D dengan menggunakan GPU

hardware Accelerated graphic rendering yang memungkinkan Flash Player mengolah proses grafik secara terpisah.

Flash Player dapat didownload di : http://www.adobe.com/support/flashplayer/downloads.html

Anda juga harus mendownload file playerglobal.swc dari halaman website yang sama.

Gambar6. Gambar halaman download Flash Player

Flash Develop

FlashDevelop adalah sebuah software open source yang merupakan editor kode dan dapat dipakai untuk

menghasilkan aplikasi berbasis Actionscript. Keunggulan utama dari Flash Develop adalah kemampuan dalam

mengolah proyek flash secara professional, ukuran file yang kecil dan ringan (tidak membutuhkan banyak memori

ketika berjalan) dan gratis (tidak membutuhkan lisensi komersial, meskipun produk yang dihasilkan adalah produk

komersial).

Flash develop dapat didownload di : http://www.flashdevelop.org

http://www.flashdevelop.org/

Untuk mempersiapkan Flash Develop agar dapat dipergunakan dalam membangun sebuah game atau aplikasi 3

dimensi anda perlu melakukan beberapa langkah berikut:

1. Ekstrak file Flex SDK 4.6 ke hardisk.

2. Install Flash Player 11 atau Flash Player terbaru.

3. Ekstrak file Flare3D ke hardisk

4. Buka folder dimana anda mengekstrak Flex “flex_sdk_4.6\frameworks\libs\player”, kemudian buatlah

sebuah folder baru dengan nama “11.3” lalu copy file playerglobal.swc ke dalam folder tersebut.

Gambar7. Folder baru untuk Flash Player 11.3

5. Install FlashDevelop

Gambar 8. Interface Flash Develop

Adobe Flash

Adobe Flash merupakan authoring tool yang memudahkan kita untuk mengatur dan mengolah aset. Pada dasarnya

kita dapat memanfaatkan Adobe Flash dan Flare3D saja untuk membuat sebuah game atau aplikasi berbasis 3

dimensi, akan tetapi pada buku ini penggunaan Adobe Flash hanya sebatas untuk mempermudah pengolahan

animasi dan pengaturan interface. Versi yang diperlukan untuk pekerjaan tersebut adalah versi CS 5 keatas,

dikarenakan hanya versi CS5 keatas yang memiliki kemampuan untuk mengeksport aset dalam bentuk file SWC.

Penjelasan secara lengkap penggunaan Adobe Flash akan dibahas pada bab selanjutnya.

Gambar 9. Interface Adobe Flash

Adobe Photoshop

Adobe Photoshop merupakan software pengolah gambar. Software ini diperlukan untuk mengolah asset visual

berupa gambar bitmap yan nantinnya akan diperlukan dalam pemuatan game.

Ada beberapa software alternatif yang dapat dipergunakan untuk mengolah sebuah gambar, akan tetapi dalam buku

ini sengaja digunakan Adobe Photoshop dikarenakan software tersebut cukup mudah untuk dipelajari dan mudah

didapatkan.

Gambar10. Interface Adobe Photoshop

Dasar Pemrogaman Actionscript 3.0

Untuk mempelajari proses pengembangan sebuah game, diperlukan pengetahuan yang baik tentang bahasa

pemrograman tertentu. Flash Player dapat menjalankan kode (yang disebut dengan Actionscript) baik itu Actionscript

versi 1 sampai dengan versi 3. Akan tetapi fitur terbaru Flash Player yaitu penggunaan GPU dalam mengolah grafik

hanya dapat dilakukan oleh kode Actionscript versi 3, sehingga terdapat beberapa dasar dari pemrograman

Actionscript 3 yang perlu kita pahami.

Pada dasarnya Actionscript 3 memiliki struktur yang hampir sama seperti bahasa pemrograman pada umumnya,

sehingga apabila anda pernah belajar bahasa pemrograman seperti C, Delphi, Javascript atau yang lain, akan anda

temukan beberapa kesamaan dan akan mempermudah anda dalam memahami kode Actionscript.

Mencoba kode dengan Adobe Flash

Untuk memulai belajar tentang dasar-dasar pemrograman Actionscript 3, akan lebih baik apabila anda mencobanya

dengan menggunakan software Adobe Flash. Perhatikan langkah-langkah berikut untuk menjalankan sebuah kode :

1. Bukalah aplikasi Adobe Flash.

2. Pilih menu File > New, kemudian pilih opsi Actionscript 3.0

Gambar 11. Membuat file Actionscript 3 dengan Adobe Flash.

3. Untuk menuliskan sebuah kode bukalah panel action dengan menekan menu Window > Action atau

dengan menekan tombol F9. Pastikan tombol script assist dalam kondisi mati, sehingga anda dapat

menulis kode secara langsung.

Gambar 12. Panel Actionscript

4. Ketikan kode berikut pada panel action.

1. trace("Belajar pemrograman AS 3");

5. Jalankan aplikasi dengan menekan tombol Ctrl + Enter, maka aplikasi akan berjalan dan hasil program

berupa tulisan “Belajar pemrograman AS 3” akan muncul pada output panel.

Gambar 13. Hasil program pada output panel

Membuat dan Menggunakan Variabel

Variabel dapat didefinisikan sebagai suatu nilai. Variabel memiliki berbagai tipe diantaranya adalah Number, String,

Boolean, Array dan sebagainya. Pendeklarasian variabel dapat dilakukan dengan cara menuliskan nama variabel

diikuti dengan tipe variabel dan nilai variabel sebagai berikut :

1. private var carSpeed:Number = 10;

private disebut sebagai access modifier, yaitu sebuah keyword yang mengatur akses penggunaan variabel

tersebut.

Pada dasarnya terdapat 4 buah access modifier yaitu :

- public. dengan mendefinisikan variabel sebagai public, variabel akan dapat diakses oleh semua class.

- internal. Dengan mendefiniskan variabel sebagai internal, variabel hanya dapat diakses oleh class yang

didefinisikan dan terkait dalam sebuah package.

- protected. Dengan mendefiniskan variabel sebagai protected, variabel hanya dapat diakses oleh class

yang sama dan subclass nya saja.

- private. Dengan mendefiniskan variabel sebagai private, variabel hanya dapat diakses oleh class yang

sama.

Pada prakteknya access modifier bertipe private dan public yang sering digunakan, meskipun demikian programmer

yang menginginkan sebuah kode yang portable dan reuseable akan memperhatikan penggunaan masing-masing

access modifier.

var merupakan kode untuk mendefinisikan sebuah variabel.

carSpeed merupakan nama variabel. Terdapat beberapa peraturan dalam menuliskan sebuah nama variabel,

diantaranya yang paling penting adalah :

- Nama variabel tidak boleh menyamai nama fungsi.

- Nama variabel tidak boleh diawali dengan karakter angka.

- Nama variabel tidak boleh menggunakan karakter spasi dan kode aritmatika.

- Nama variabel menggunakan metode sensitive case, contoh carspeed berbeda dengan carSpeed.

- Untuk nama variabel yang terdiri dari dua kata atau lebih, dapat digunakan karakter underscore atau

menggunakan metode camel case. Contoh car_speed atau carSpeed.

:Number merupakan deklarasi tipe variabel. Dengan mendefinisikan tipe variabel, kode akan menjadi lebih efisien.

Terdapat berbagai tipe variabel yang digunakan dalam pemrograman game secara umum diataranya adalah

Number, String, Boolean, Array, MovieClip dan sebagainya.

= 10; merupakan nilai dari variabel tersebut. Nilai suatu variabel dapat didefinisikan diawal kode dan dapat diubah

dengan melakukan set ulang variabel.

Untuk menggunakan variabel, dapat dilakukan dengan memanggil nama variabel tersebut. Sebagai contoh kita dapat

mengubah nilai variabel carSpeed menjadi 20 dengan kode

1. carSpeed = 20;

Operasi Kondisi ( Condition Statement )

Pernyataan kondisi if sering kali dipergunakan sebagai dasar logika dari sebuah pemrograman. Dalam Actionscript 3

penulisan if hampir sama dengan bahasa pemrograman lainnya, contoh :

1. if (scorePemain == 3){

2. menang(); 3. }

Kode tersebut dapat diartikan secara sederhana sebagai berikut : jika variable scorePemain bernilai 3, maka fungsi

menang akan dijalankan.

Sebuah kondisi else dan else if juga dapat ditambahkan pada sebuah operasi kondisional, contoh :

1. if (scorePemain == 3){

2. menang(); 3. }else if (scorePemain < 3 && scorePemain > 0){

4. lanjutkanPermainan(); 5. }else{

6. mulaiPermainan();

7. }

Kode tersebut dapat diartikan: jika variabel scorePemain bernilai 3, maka fungsi menang dijalankan, tetapi jika

bernilai kurang dari 3 dan lebih besar daripada 0 (bernilai sama dengan 1 atau 2), maka fungsi lanjutkanPermainan

yang akan dijalankan, jika tidak (bernilai tidak sama dengan 1, 2 atau 3 / bisa jadi bernilai 0, 4, -1 dan sebagainya),

maka fungsi mulaiPermainan yang dijalankan.

Operator yang dipergunakan untuk menyatakan suatu kondisi diantaranya adalah :

== untuk menyatakan sama dengan

!= untuk menyatakan tidak sama dengan

> atau < untuk menyatakan lebih besar atau lebih kecil

>= atau <= untuk menyatakan lebih besar sama dengan atau lebih kecil sama dengan

Sedangkan untuk operasi kondisional yang lebih kompleks dapat digunakan karakter && dan ||.

&& digunakan sebagai pernyataan kondisi 1 dan kondisi 2

|| digunakan sebagai pernyataan kondisi 1 atau kondisi 2

Operasi Berulang (Loops)

Operasi berulang atau loops adalah sebuah prosedur standart dimana perintah yang berada di dalam blok loop akan

dijalankan secara berulang atau terus menerus sampai kondisi tertentu terpenuhi. Actionscript 3 memiliki 2 bentuk

operasi berulang yaitu for dan while. Perhatikan contoh kode menggunakan operasi for berikut :

1. var score:Number = 0;

2. for (var i:Number = 0; i<10; i++){

3. score++;

4. trace(score); 5. }

Ketika kode tersebut dijalankan akan dihasilkan angka 1 sampai dengan 10 pada output panel. Pada awalnya

variabel score bernilai 0. Dengan operasi for perintah dalam blok { } dijalankan sebanyak 10 kali, yaitu dimulai dari i

pertama yang bernilai 0, kemudian i ditambah 1 setiap kali pengulangan berjalan (i++) dan operasi dihentikan ketika i

bernilai < 10 (atau bernilai 9, tetapi karena perhitungan dimulai dari angka 0, sehingga perintah dalam blok dijalankan

sebanyak 10 kali).

Di dalam blok { } terdapat perintah score++; yang berarti bahwa setiap kali loop berjalan variabel score ditambah

dengan 1, dan perintah trace(score); berfungsi untuk menampilkan variabel score pada output panel.

Operasi berulang selanjutnya adalah while. While adalah operasi berulang yang menjalankan perintah dalam blok {}

secara terus-menerus selamanya sampai kondisi while terpenuhi. Perhatikan contoh kode menggunakan operasi

while berikut :


2. while (score < 10){

3. score++;

4. trace(score); 5. }

Dari kode tersebut akan menghasilkan output yang sama dengan kode sebelumnya yang menggunakan for.

Alternatif lain dalam menggunakan loop while adalah dengan menggunakan do while loop.

Perhatikan contoh kode berikut :


2. do {

3. score++;

4. trace(score); 5. } while (score < 10);

Untuk menginterupsi operasi berulang dapat digunakan script break; dan script continue;. Script break akan

menghentikan operasi loop dan keluar dari operasi loop. Sedangkan script continue akan “melewati” beberapa script

di bawahnya, dan melanjutkan loop mulai dari awal blok.

Fungsi

Fungsi adalah kumpulan dari satu atau beberapa perintah yang dapat dipergunakan secara berulang. Terdapat 4

elemen utama dari sebuah fungsi yaitu : deklarasi dari fungsi, parameter yang digunakan, output atau nilai yang

dihasilkan oleh fungsi, dan kode pembentuk fungsi. Perhatikan contoh berikut :

1. private function kuadrat(var num:Number):Number {

2. return num*num;

3. }

private menunjukan bahwa fungsi tersebut terletak didalam sebuah class. Sama dengan penjelasan pada bagian

variabel, fungsi di dalam sebuah class juga memiliki access modifier yang mendefinisikan akses penggunaan

fungsi tersebut. public function dapat diakses oleh semua class sedangkan private function hanya dapat diakses

oleh class tempat dimana fungsi tersebut berada. Tanpa access modifier sebuah fungsi akan dianggap sebagai

public.

function merupakan deklarasi dari fungsi, diikuti dengan kuadrat yang merupakan nama dari fungsi tersebut.

(var num:Number) merupakan parameter yang dipergunakan oleh fungsi. var num merupakan deklarasi variabel

yang dibutuhkan oleh fungsi tersebut, :Number merupakan tipe dari variabel num.

:Number merupakan output atau nilai yang dihasilkan dari fungsi tersebut. Sebuah fungsi dapat menghasilkan output

bertipe Number, String, Int, dan sebagainya atau tidak memberikan nilai apapun (disebut sebagai void).

{ return num*num; } kode yang berada dalam blok { } adalah kode pembentuk dari fungsi. Dalam contoh ini kode

return akan menghasilkan suatu nilai, dan num*num adalah nilai yang dihasilkan dari fungsi kuadrat tersebut.

Untuk menggunakan fungsi tersebut, cukup dengan memanggil nama fungsi dan memberikan parameter yang

dibutuhkan, contoh :

1. function kuadrat(num:Number):Number { 2. return num*num;

3. } 4.

5. trace( kuadrat(5));

Kode tersebut akan menghasilkan 25 pada output panel karena memanggil fungsi kuadrat dengan parameter 5,

berarti akan me“return” 5x5 = 25.

Event

Event merupakan sebuah runtutan perintah yang dijalankan oleh obyek tertentu ketika suatu “event”

terjadi/berlangsung. Contoh dari “event” diantaranya adalah MouseEvent yaitu ketika input diperoleh dari mouse

(Click, Doubleclick, roll over, roll out dan sebagainya), Keyboard Event (KeyUp, KeyDown, dan sebagainya), Timeline

Event (EnterFrame dan sebagainya) dan event lainnya. Untuk menambahkan sebuah event kepada obyek dapat

dilakukan dengan kode addEventListener. Perhatikan contoh berikut :

1. bola_mc.addEventListener(Event.ENTER_FRAME, gerakanBola);

2. 3. function gerakanBola(e:Event){

4. var ob:Object = e.currentTarget;

5. ob.x += 5;

6. }

Jika anda memiliki sebuah movieclip pada timeline dengan instance name “bola_mc” dan kode tersebut dijalankan,

maka movieclip bola_mc akan mendapatkan perintah untuk bergerak sebesar 5 pixel pada sumbu X setiap frame

nya (kecepatan tergantung dari pengaturan frames per second/FPS).

Flash Develop

Pada dasarnya Flash Develop adalah sebuah software untuk mengedit kode Actionscript yang dilengkapi dengan

berbagai fitur, sehingga kita dapat memanfaatkannya sebagai software utama dalam pembuatan game flash 3D.

Setelah Flash Develop terinstall (pada bab persiapan sofware) anda dapat menjalankannya dari Windows Start

Menu. Selanjutnya akan anda dapati sebuah interface sederhana yang secara default terbagi menjadi 4 bagian

utama, yaitu:

1. Main Menu

Seperti software pada umumnya di bagian atas terdapat meu utama dimana anda bisa memilih opsi File,

Edit, View dan sebagainya, anda juga dapat menyimpan, membuka project baru, mengecek syntax dari

kode yang anda tulis, dan menjalankan kode.

2. Editor Panel

Editor panel adalah tempat dimana anda menuliskan script/kode pada masing-masing file.

3. Project Manager

Pada panel project manager anda dapat melihat struktur folder tempat dimana anda menyimpan semua file

yang anda pergunakan untuk sebuah proyek game. Pada bagian bawah terdapat beberapa opsi menu

diantaranya outline, bookmark, dan files.

4. Output Panel

Output panel berfungsi untuk menampilkan hasil akhir ketika anda menjalankan kode. Output panel akan

menampilkan proses compiling, kesalahan yang terjadi, dan semua proses tracing kode selama aplikasi

dijalankan dalam mode debug.

Gambar 14. Interface Flash Develop.

Sistem Project Folder pada FlashDevelop

Ketika project baru dibuat, secara otomatis Flash Develop akan membuat 3 folder baru yaitu :

1. bin/

Folder bin akan menjadi tempat file SWF yang dihasilkan, berikut file HTML.

2. lib/

Folder lib berfungsi untuk menyimpan file-file library yang dipergunakan. Library adalah kumpulan dari

class, fungsi-fungsi, assets dan obyek yang telah dibuat sebelumnya. Library pada umumnya berisi kode

dan data yang diperlukan setiap kali membuat aplikasi, dalam artian sebuah library dapat dipakai berulang

kali untuk project yang berbeda.

3. src/

Folder scr/ berisi semua file Actionscript (bertipe .as) yang dipakai dalam project. Beberapa developer juga

meletakkan assets yang akan dipakai (seperti file gambar) dalam folder ini.

4. obj/

Folder obj berisi sebuah file XML yang merupakan konfigurasi umum dari project yang sedang aktif. Folder

ini baru akan muncul ketika sebuah project sudah dicompile.

Gambar 15. Project Folder

Hello Word dengan FlashDevelop

Salah satu latihan pertama yang paling populer dalam belajar pemrograman komputer adalah dengan membuat

program “hello word”, sebuah aplikasi sederhana yang menunjukan bahwa aplikasi berhasil dibuat dengan

menampilkan kata “hello word”. Untuk memulainya jalankan program Flash Develop dan lakukan langkah berikut:

1. Pilih menu create new project ( terdapat pada bagian kanan / project panel ).

Kemudian pilih opsi AS3 Project with Preloader, ketikan “helloword” pada input nama, pilih folder tempat

anda menyimpan project, dan centang opsi create directory for project, lalu tekan ok.

Gambar 16. Panel new project pada FlashDevelop

2. Setelah itu pada Project Manager akan terbentuk 3 folder, yaitu bin, lib dan src. Klik kanan nama project

kemudian pilih properties.

Gambar 17. Membuka Project Properties

3. Pada Project Properties panel Output ubah Platform menjadi Flash Player dan pilih versi 11.3 (versi

11.3 akan muncul apabila anda telah melakukan pengaturan awal yang telah dijelaskan pada bab

sebelumnya).

Pada bagian General anda bisa mengatur ukuran stage, background dan framerate. Untuk sementara opsi

tersebut tidak perlu anda ganti.

Gambar 18. Project Properties Output

4. Bergeser ke panel SDK bagian Installed SDK, apabila anda belum mendapati Default (Flex 4.6.0, AIR 3.1)

sebagai installed SDK, tekanlah Manage….

Pada panel Setting sebelah kiri pastikan Plugin – AS3 Context terpilih, kemudian di sebelah kanan pada

bagian Language – Installed Flex SDK klik tombol […] maka panel Installed SDK Collection Editor akan

muncul.

Gambar 19. Project Properties SDK

5. Pada panel Installed SDK Collection Editor klik Add lalu pada kolom Location – Path pilih folder tempat

anda mengekstak file Flex SDK yang telah dijelaskan pada bab sebelumnya.

Gambar 20. Panel Installed SDK Collection Editor

6. Setelah SDK sudah terinstall, tekan tombol Apply kemudian tekan tombol OK.

Catatan : langkah 4 sampai dengan 6 hanya perlu

dilakukan sekali. Selanjutnya Flash Develop akan

menyimpan konfigurasi tersebut, sehingga kita tidak perlu

mengatur Installed SDK pada project selanjutnya.

7. Pada panel Project Manager ekspansi folder src. Anda akan mendapati dua file main.as dan

preloader.as. Dobel klik file main.as untuk membukanya di panel code editor.

Gambar 21. Folder src pada Project Manager

8. Pada panel code editor akan muncul kode yang terdapat pada file main.as. Selanjutnya perhatikan baris

yang bertuliskan // entry point.

Gambar 22. Actionscript pada file main.as

9. Untuk memulai program hello word kita perlu menambahkan sebuah perintah yaitu trace. Letakkan kursor

dibelakang kode //entry point. Tekan enter, kemudian ketikan script

1. trace(“hello word!”);

Gambar 23. Penulisan Actionscript trace

10. Jalankan project dengan memilih menu Project – Test Project atau tekan F5.

Maka proses compile akan berjalan dan Flash Player Window akan muncul. Pada Flash Player window

tidak akan anda temui gambar apapun (kosong), karena kita tidak menambahkan script untuk menampilkan

sesuatu, akan tetapi pada Output Panel akan terlihat kata “hello word!” hasil dari script trace yang anda

tulis sebelumnya.

Membuat Game Sederhana dengan FlashDevelop

Untuk memulai proses pembuatan game dengan Flash Develop, perhatikan langkah-langkah sebagai berikut :

1. Buka aplikasi FlashDevelop.org kemudian klik menu Project>New Project, maka panel New Project akan

muncul. Pilih AS3 Project, ketikan nama project dan atur folder tempat anda bekerja, kemudian klik OK

TIPS : meskipun kita akan membuat sebuah game untuk HP / Android, akan lebih mudah jika kita memilih

project AS3 standard karena proses testing akan jauh lebih mudah dan cepat.

2. Secara otomatis Flash Develop akan menyusun folder-folder baru dan file Class dari project tersebut.

Selanjutnya pada Project Panel klik kanan nama project dan anda pilih menu Properties

3. Pada tab output atur dimensi project menjadi 480 x 800 pixel dan 30 FPS. Selanjutnya pada

tab SDK pastikanFlex SDK 4.6, AIR 3.1 sudah terkonfigurasi. Apabila belum, klik tombol Manage kemudian

tambahkan folder dimana anda mengektrak file Flex SDK.

4. Klik OK dan project game sudah siap. Perhatikan pada Project Panel sebelah kiri. Disitu terdapat 3 buah

folder yaitu lib, bin dan src. Menurut pemahaman saya folder lib akan dipakai untuk meletakkan file library

(dimana tidak akan dipakai pada tutorial ini), folder bin digunakan untuk meletakkan asset visual dan file

SWF dari project sedangkan folder src berisi file kode yang kita butuhkan.

5. Selanjutnya dengan menggunakan Adobe Photoshop buatlah asset visual untuk game ini, yaitu berupa

arena permainan, 2 buah papan, dan sebuah bola seperti pada gambar(jika anda belum membuatnya anda

bisa mengklik kanan masing-masing gambar berikut, kemudian pilih save as).

6. Copy-paste semua file asset visual tersebut ke dalam folder bin

7. Selanjutnya buka folder src akan anda dapati file Main.as, double click file tersebut untuk menampilkannya

di panel code editor. File ini adalah Class utama dari project yang akan kita buat.

Game yang akan kita buat akan lebih praktis jika semua asset dimasukkan menjadi satu ke dalam aplikasi. Hal

tersebut diistilahkan dengan EMBED. Untuk mengembed asset visual yang telah kita buat sebelumnya, dan

menambahkan asset visual tersebut ke layar, perhatikan langkah berikut :

1. Pada langkah sebelumnya kita membuka file Main.as pada panel Code Editor. Pada dasarnya Flash

Developtelah menyusun class utama sesuai dengan jenis project yang kita buat, sehingga kita tinggal

melanjutkan kode yang sudah ada. Pada baris ke 22 dimana terdapat kode >// entry point, disitulah kita

nanti akan memulai penulisan fungsi utama.

2. Untuk memulai mengembed asset visual game, ekspansi folder bin dan akan anda dapati file-file asset

visual yang telah anda copy sebelumnya (lihat langkah 6 tutorial sebelumnya).

Agar file yang diembed dapat dikenali oleh kode, maka file tersebut nantinya harus

diberikan identitas berupavariabel. Pada pemrograman AS3 deklarasi var dapat dilakukan didalam

http://www.wandah.org/membuat-game-android-2.php

deklarasi class utama (secara sederhana dapat dijelaskan sebagai berikut : mulailah dari baris 12 untuk

menuliskan variabel).

Klik baris 12, kemudian klik kanan file arena.jpg pada folder bin kemudian pilih menu Generate Embed

Code

3. Setelah kode embed muncul, selanjutnya pada panel code editor anda tekan Enter lalu anda definisikan

nama variabel dari file tersebut dengan cara menuliskan kode baris 13 sbb :

12. [Embed(source = "../bin/arena.jpg")]

13. private var arena_bmp:Class;

14.

15. public function Main():void

Dengan mendefinisikan file arena.jpg menjadi sebuah variabel arena_bmp bertipe Class, maka

selanjutnya kita dapat "memanggilnya" dan menambahkannya ke layar.

Dalam membuat game 2D berdasarkan pengalaman saya, saya suka membuat sebuah container atau

movieclip kosong, kemudian saya masukkan semua objek ke dalam container tersebut. Hal ini akan memudahkan

saya untuk mengelola asset pada tahapan selanjutnya, seperti ketika mengatur ulang, atau menghapusnya dari

layar.

Untuk membuat container tersebut, saya membuat sebuah variabel baru bertipe Movieclip. Tuliskan kode berikut

(sesuai dengan no baris nya)



14.

15. private var game:MovieClip;

16.


Selanjutnya kita akan membuat fungsi untuk menambahkan gambar arena ke layar, yaitu fungsi setup().

Kemudian fungsi setup() dipanggil saat aplikasi pertama kali berjalan, yaitu tepat dibawah baris : // entry point.

Jalankan (ujicoba) aplikasi dengan menekan Ctrl+Enter apabila anda tidak menemui kendala, maka

gambar arena akan muncul dilayar. Hal ini dikarenakan gambar tersebut telah ditambahkan menggunakan

kodeaddChild.

Pada awalnya movieclip game dibuat dan ditambahkan ke layar, kemudian pada baris 35 file arena.jpg yang telah

didefinisikan sebagai variabel arena_bmp ditambahkan ke dalam movieclip game

0. Untuk menambahkan board_1.png, lakukan cara yang sama, yaitu dengan meletakkan kursor di baris 16

(tepat dibawah deklarasi variabel file arena.jpg), kemudian klik kanan file board_1.png kemudian

pilih Generate Embed Code.

Definisikan nama variabel dari file tersebut sebagai board_1_bmp.

Selanjutnya pada fungsi setup() tambahkan kode menjadi sebagai berikut:

1.

2. package

3. {

4. import flash.display.Bitmap;

5. import flash.display.MovieClip;

6. import flash.display.Sprite;

7. import flash.events.Event;

8.

9. /**

10. * ...

11. * @author Wandah

12. */

13. public class Main extends Sprite

14. {



17. [Embed(source = "../bin/board_1.png")]

18. private var board_1_bmp:Class;

19.

20. private var board_1:MovieClip;

21.


23.


25. {

26. if (stage) init();

27. else

addEventListener(Event.ADDED_TO_STAGE, init);

28. }

29.

30. private function init(e:Event = null):void

31. {

32.

removeEventListener(Event.ADDED_TO_STAGE, init);

33. // entry point

34. setup();

35. }

36.

37. private function setup():void {

38. game = new MovieClip();

39. addChild(game);

40. var arena:Bitmap = new arena_bmp();

41. game.addChild(arena);

42.

43. board_1 = new MovieClip();

44. var board_bmp:Bitmap = new

board_1_bmp();

45. board_bmp.x = -63;

46. board_bmp.y = -11;

47. board_1.addChild(board_bmp);

48. board_1.x = 240;

49. board_1.y = 650;

50. game.addChild(board_1);

51. }

52. }

53.

54. }

1. Berbeda dengan arena.jpg yang merupakan background dan bersifat statis, board_1.png nantinya

merupakan object yang dinamis atau dapat bergerak. Sehingga board_1.png perlu untuk dimasukkan ke

dalam movieclip tersendiri yaitu movieclip board_1 (didefinisikan di baris ke 17 dan ditambahkan ke dalam

movieclip game pada baris 42-49).

Pengaturan posisi movieclip board_1 (baris 47-48) diatur berdasarkan sumbu kordinat layar (dimulai dari

0,0 atau pojok kiri atas layar)

0. Jalankan (ujicoba) aplikasi dengan menekan Ctrl+Enter apabila anda tidak menemui kendala, maka

gambar seluruh asset dan posisinya masing-masing akan muncul dilayar

Membuat Gerakan Object

1. Untuk menggerakkan bola secara terus menerus diperlukan

sebuah EventListener yaitu Event.ENTER_FRAME.

Event ini merupakan sebuah fungsi yang akan dijalankan secara terus menerus oleh aplikasi sampai

adanya perintah removeEventListener.

Untuk menggerakan movieclip ball secara diagonal (lihat contoh di bawah), anda membutuhkan

variabelspeed_x dan variabel speed_y. Selain itu juga dibuat variabel is_goal yang

bertipe Boolean sebagai persiapan kita untuk mengatur proses terjadinya gol. Pada file Main.as tambahkan

kode baris 29 - 31 sebagai berikut :


28.

29. private var speed_x:Number = 0;

30. private var speed_y:Number = 0;

31. private var is_goal:Boolean = false;

32.


34. { ....

1. Selanjutnya untuk menambahkan event agar bola bergerak terus menerus pada fungsi setup() anda perlu

mendefinisikan nilai variabel speed_x dan speed_y, serta menambahkan fungsiaddEventListener sebagai

berikut :


47. .....

48.

49. speed_x = Math.random() * 3+2;

50. speed_y = -20 + Math.random() * 10;

51.

52.

game.addEventListener(Event.ENTER_FRAME, game_loop);

53. }

Pada langkah di atas fungsi yang dijalankan oleh Event.ENTER_FRAME adalah fungsi game_loop. Fungsi

inilah yang nantinya akan dijalankan secara terus menerusoleh aplikasi. Untuk membuat fungsi tersebut, tambahkan

kode berikut :

85. private function game_loop(e:Event):void {

86. if (!is_goal){

87. ball.x += speed_x;

88. ball.y += speed_y;

89. if (ball.y<30 || ball.y>770)

speed_y*=-1;

90. if (ball.x<30 || ball.x>450)

speed_x*=-1;

91. }

92. }

Jalankan (ujicoba) aplikasi dengan menekan Ctrl+Enter apabila anda tidak menemui kendala, maka bola

akan bergerak secara terus menerus akibat kordinat bola yang selalu ditambah dengan speed_x dan speed_y.

Ketika bola "menabrak" dinding arena yaitu dengan menggunakan kondisi if (ball.y<30 || ball.y>770) maka

variabel speed_y dibalik nilainya sehingga bola akan memantul.

Menjalankan Object dengan Keyboard

1. Untuk menggerakkan papan pemain atau board_1 ke kanan dan ke kiri, kita membutuhkan

variabel is_left dan variabel is_right yang bertipe Boolean. Dengan menggunakan KeyboardEvent kita

dapat mengatur kedua nilai variabel tersebut menjadi true ketika ditekan dan false ketika dilepas.

Deklarasi penambahan KeyboardEventdapat kita tambahkan pada fungsi setup() sebagai berikut :

33. ...

34. private var is_left:Boolean = false;

35. private var is_right:Boolean = false;

36. ...


45. .....

46.

game.addEventListener(Event.ENTER_FRAME, game_loop);

47.

stage.addEventListener(KeyboardEvent.KEY_DOWN, myKeyDown);

48.

stage.addEventListener(KeyboardEvent.KEY_UP, myKeyUp);

49. }

Selanjutnya kita perlu membuat fungsi myKeyDown() dan myKeyUp() sebagai berikut :

99. private function

myKeyDown(e:KeyboardEvent):void {

100. if (e.keyCode == 39) is_right = true;

101. if (e.keyCode == 37) is_left = true;

102. }

103.

104. private function myKeyUp(e:KeyboardEvent):void

{

105. if (e.keyCode == 39) is_right = false;

106. if (e.keyCode == 37) is_left = false;

107. }

Setelah keyboard sudah terdeteksi dengan adanya kedua fungsi diatas, langkah selanjutnya adalah

memodifikasi fungsi game_loop agar movieclip board_1 dapat bergerak sesuai dengan input keyboard, yaitu

dengan menambahkan kode menjadi:


91. if (!is_goal){



94. if (ball.y<30 || ball.y>770)

speed_y*=-1;

95. if (ball.x<30 || ball.x>450)

speed_x*=-1;

96.

97. if (board_1.x < 400 && is_right)

board_1.x += 10;

98. if (board_1.x > 80 && is_left)

board_1.x -= 10;

99. }

100. }

Jalankan (ujicoba) aplikasi dengan menekan Ctrl+Enter apabila anda tidak menemui kendala, maka anda

akan dapat mengendalikan board_1 ke kanan dan ke kiri, meskipun demikian bola masih menembus papan karena

belum kita tambahkan deteksi untuk tabrakan antara bola dan papan.

Mendeteksi tabrakan antar object

1. Untuk menambahkan tabrakan antara ball dengan board_1 dan board_2 kita perlu menambahkan

beberapa baris kode pada fungsi game_loop() menjadi sebagai berikut

36. ...

37. private var just_hit:Number = 0;

38. ...


93. if (!is_goal){



96. if (ball.y<30 || ball.y>770)

speed_y*=-1;

97. if (ball.x<30 || ball.x>450)

speed_x*=-1;

98.


board_1.x += 10;


board_1.x -= 10;

101.

102. if (ball.hitTestObject(board_1)

&& just_hit == 0) {

103. just_hit = 10;

104. speed_y *= -1;

105. }


&& just_hit == 0) {

107. just_hit = 10;

108. speed_y *= -1;

109. }

110.

111. if (just_hit > 0) just_hit--;

112. }

113. }

Pada baris 36 ditambahkan variabel just_hit. Variabel ini digunakan untuk menghindari bug bola menempel

dipapan. Dengan variabel ini dipastikan bola akan segera memantul setelah kode hitTestObject bernilai true.

Selanjutnya ketika bola menabrak papan, nilai variabel speed_y dibalik sehingga bola bergerak memantul.


akan dapat mengendalikan board_1 ke kanan dan ke kiri, dan bola dapat memantul ketika mengenai kedua papan

Membuat Gerakan Otomatis (AI)

1. Untuk menambahkan gerakan responsive movieclip board_1, kita perlu mendeteksi posisi

movieclip ball dan menambahkan beberapa baris kode pada fungsi game_loop() menjadi sebagai berikut


93. if (!is_goal){



96. if (ball.y<30 || ball.y>770)

speed_y*=-1;

97. if (ball.x<30 || ball.x>450)

speed_x*=-1;

98.

99. //Player


board_1.x += 10;


board_1.x -= 10;

102. //AI

103. if (ball.y < 300 && speed_y < 0)

{

104. if (board_2.x < ball.x

&& board_2.x < 400 ) board_2.x += 5;

105. if (board_2.x > ball.x

&& board_2.x > 80) board_2.x -= 5;

106. }

107.


&& just_hit == 0) {

109. just_hit = 10;

110. speed_y *= -1;

111. }


&& just_hit == 0) {

113. just_hit = 10;

114. speed_y *= -1;

115. }

116.


118. }

119. }

Penambahan kode untuk AI di atas sangat sederhana, yaitu dengan mendeteksi posisi bola apakah

bergerak mendekati papan lawan (if (ball.y < 300 && speed_y < 0) dan jika iya, maka papan akan digerakkan ke

kanan atau ke kiri sesuai dengan posisi bola.


akan mendapatkan aplikasi bola pantul sebagai berikut :

Membuat Sistem Score

1. Sebelumnya kita membutuhkan sebuah gambar untuk menunjukan bahwa goal sudah terjadi..

2. Copy gambar tersebut ke folder bin, selanjutnya tambahkan kode EMBED untuk menambahkan gambar

tersebut ke dalam game.

22. [Embed(source = "../bin/goal_bmp.png")]

23. private var goal_bmp:Class;

Selanjutnya kita membutuhkan 2 buah variabel bertipe TextField yang akan digunakan untuk menampilkan

score di layar. Untuk membuatnya tambahkan kode berikut

40. private var score_1:Number = 0;

41. private var score_2:Number = 0;

42.

43. private var score_1_txt:TextField;

44. private var score_2_txt:TextField;

Untuk menampilkan variabel score_1_txt dan score_2_txt kita perlu menambahkan beberapa baris berikut

ke dalam fungsi setup() :


41. .....

42. var myFormat:TextFormat = new

TextFormat();

43. myFormat.size = 50;

44. myFormat.align =

TextFormatAlign.CENTER;

45.

46. score_1_txt = new TextField();

47. score_1_txt.defaultTextFormat =

myFormat;

48. score_1_txt.width = 150;

49. score_1_txt.height = 60;

50. score_1_txt.x = 10;

51. score_1_txt.y = 410;

52. score_1_txt.text = String(score_1);

53. game.addChild(score_1_txt);

54.

55. score_2_txt = new TextField();

56. score_2_txt.defaultTextFormat =

myFormat;

57. score_2_txt.width = 150;

58. score_2_txt.height = 60;

59. score_2_txt.x = 10;

60. score_2_txt.y = 330;

61. score_2_txt.text = String(score_2);

62. game.addChild(score_2_txt);

63.

64. is_goal = false;

65. ....

66. }

Selanjutnya anda perlu mengubah fungsi game_loop() untuk menambahkan deteksi bola dengan gawang,

sistem score dan sistem pengulangan game. Sehingga fungsi game_loop menjadi sebagai berikut :


127. if (!is_goal){



130. if (ball.y<30 || ball.y>770)

speed_y*=-1;

131. if (ball.x<30 || ball.x>450)

speed_x*=-1;

132.


&& just_hit == 0) {

134. just_hit = 10;

135. speed_y *= -1;

136. }


&& just_hit == 0) {

138. just_hit = 10;

139. speed_y *= -1;

140. }

141.

142. if (ball.x > 180 && ball.x < 300

) {

143. if (ball.y < 35) {

144. is_goal = true;

145. just_hit = 100;

146. score_1++;

147. ball.visible =

false;

148. }

149. if (ball.y > 765) {

150. is_goal = true;

151. just_hit = 100;

152. score_2++;

153. ball.visible =

false;

154. }

155. }

156. //Player


board_1.x += 10;


board_1.x -= 10;

159. //AI

160. if (ball.y < 300 && speed_y < 0)

{

161. if (board_2.x < ball.x

&& board_2.x < 400 ) board_2.x += 5;

162. if (board_2.x > ball.x

&& board_2.x > 80) board_2.x -= 5;

163. }

164.


166. }else {

167. just_hit--;

168. if (just_hit == 90) {

169. var goal_bitmap:Bitmap =

new goal_bmp();

170. goal_bitmap.x = 240-178;

171. goal_bitmap.y = 400-44;

172.

game.addChild(goal_bitmap);

173. }

174. if (just_hit == 1) {

175. restart_game();

176. }

177. }

178. }

Pada baris 175 di dalam fungsi game_loop() terdapat fungsi restart_game(). Fungsi ini nantinya berfungsi

untuk mengulang seluruh prosedur game yang ada dari awal, yaitu dimulai dengan membersihkan layar, kemudian

memanggil fungsi setup() untuk mengatur permainan baru.

190. private function restart_game():void {

191.

game.removeEventListener(Event.ENTER_FRAME, game_loop);

192.

stage.removeEventListener(KeyboardEvent.KEY_DOWN, myKeyDown);

193. removeChild(game);

194. setup();

195. }

Setelah semua kode ditulis, jalankan (ujicoba) aplikasi dengan menekan Ctrl+Enter apabila anda tidak

menemui kendala, maka anda akan mendapatkan aplikasi bola pantul .

Note : Materi ini ditulis oleh Wandah Wibawanto, S.Sn, M.Ds. Dilarang mengcopy, memperbanyak,

menggunakan sebagian atau seluruh content tanpa ijin tertulis dari penulis ([email protected])

Untuk informasi lebih lanjut silahkan klik www.wandah.org

mailto:[email protected]

http://www.wandah.org/

Pengembangan Game dengan Flash Develop

Documents