Membuat game ala PokoPunk part1

Diposting2014-11-30Diperbarui2022-01-27
Flashpunk | tutorial

Karena beberapa bulan terakhir pokopang adalah game android yang gw mainin, dan gw ingin membuat duplikatnya menggunakan flashpunk. Flashpunk adalah game engine yang sebelumnya gw gunakan sebelum menggunakan unity.

Ok sebelum memulai ini yang harus disiapkan adalah :

  1. Flashdevelop
  2. Flashpunk engine

Jika kalian sudah selesai tahap tersebut membuat project baru. Saya menggunakan nama “LikePoko” pada project yang saya kerjakan. Setelah itu ubah “Main.As” menjadi seperti :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
package
{
    import net.flashpunk.Engine;
    import net.flashpunk.FP;
    public class Main extends Engine
    {
        public function Main()
        {
            super(640, 480);
        }
        override public function init():void
        {
            super.init();
        }
    }

bisa dibilang kode diatas adalah kode standart untuk menggunakan flashpunk engine. Pada line ke 10 kita memanggil konstuktor dengan fungsi super(640,480); 640 diartikan sebagai lebar layar dan 480 adalah tinggi layar. Setelah itu buatlah folder baru “room” untuk tempat gamestage kita, dan buat class baru dengan nama “GameStage” dan ubah baseclassnya menjadi world.

gameStage

balik lagi pada main class dan ubah line 14 menjadi seperti ini

1
FP.world = new GameStage();

jangan lupa menambahkan line 4 dengan "import room.GameStage;". Mungkin mudahnya untuk mengambarkan apa yang sudah kita kerjakan adalah. Kita bisa mencoba untuk testing tampilanya akan seperti ini. Pertama kita membuat main class sebagai Mesin dari flashpunk dan mulai menyalahkan mesin tersebut, tapi mesin kita belum punya tempat untuk stage kita, sehingga kita membuat folder room dan membuat class gamestage untuk tempat dimana game akan ditampilkan, tetapi kita masih belum memasukan aktor didalam game, seperti player ataupun musuhnya. Tetapi karena game ini adalah puzzle jadi kita hanya aktor kita disini adalah blok-blok hexa. Tetapi sebelum itu ada baiknya kita coba untuk mencoba ada yang sudah kita kerjakan, tekan “ctrl+enter” untuk mencobanya.

Tampilan Game Stage

sepertinya tidak ada perubahan apa-apa sudah kita kerjakan tapi jangan kecewa dulu. Kita tambahkan kembali main classnya pada line 17

1
FP.console.enable();

Kompile ulang dan lihat perbedaan yang ada. Kalian bisa menekan “`“ tombolnya terletak disamping kanan angka 1, fungsi dari angka tersebut adalah untuk mengatur console dari flashpunk.

consoleOn

Sekarang saatnya membuat aktor untuk kita letakan di gamestage kita. Saatnya membuat folder baru untuk meletakan seluruh actor kita kedalam stage. Buat class baru dengan nama Hexa tetapi kali ini ubah baseclassnya menjadi entity. Tulis seperti ini : 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
package actor
{
    import flash.display.BitmapData;
    import net.flashpunk.Entity;
    import net.flashpunk.Graphic;
    import net.flashpunk.graphics.Image;
    import net.flashpunk.Mask;
    public class Hexa extends Entity
    {
        private var img : Image = new Image(new BitmapData(32, 32, false, 0xFF0000));
        public function Hexa()
        {
            graphic = img;
        }
    }
}

setelah itu ubah gamestage kita menjadi :

1
2
3
4
5
6
7
8
9
10
11
12
13
package room
{
    import actor.Hexa;
    import net.flashpunk.World;
    public class GameStage extends World
    {
        public function GameStage()
        {
            super();
            add(new Hexa());
        }
    }
}

test ulang project yang kita dan lihat hasilnya.

addingHex

Ok kita sudah sampe sejauh ini, kalian bisa mencoba untuk mengubah dan melakukan edit dari gambar disitu. bagi kalian yang ingin mendownload file yang sudah saya kerjakan, kalian bisa mendownload disini

bagian lain dari tutorial ini :

  1. Membuat game seperti pokopang
  2. Memasukan hexa dan mengatur posisi seperti pokopang
  3. Mengatur logika pokopang