Let Find Out..

Jumat, 07 Mei 2010

Game TikTakToe


Game TicTacToe..

            Sebagai bagian dari materi perkuliahan untuk mata kuliah softskill penulis mencoba untuk menerbitkan game mobile tic tac toe sebagai materi dalam blog, untuk lebih lengkapnya, bias dilihat dalam halaman blog ini.

            Struktur Menu
Pada aplikasi permainan yang dibuat, penulis menggunakan beberapa buah menu yang tujuannya adalah untuk memudahkan dan membantu pengguna aplikasi dalam mengakses fasilitas dalam permainan yang disediakan seperti memulai permainan, melihat high score, melihat layar bantuan (help), termasuk pula melakukan pengaturan terhadap beberapa seting yang tersedia seperti seting pengaturan permainan, score dan peraturan permainan.
Menu Utama
Menu utama ini merupakan menu yang akan ditampilkan pada saat pertama kali aplikasi permainan dijalankan. Menu ini memiliki bagan sebagai berikut :
Pada menu utama terdapat lima buah pilihan yang tersedia pada saat aplikasi
game pertama kali dijalankan, yaitu :
1. “Pengaturan”, digunakan untuk melakukan perubahan terhadap opsi yang mendukung
      permainan, seperti nama pemain, level, giliran pemain dan pilih simbol.
2. “High Score”, digunakan untuk melihat daftar score yang tersimpan.
3. “Peraturan Permainan”, digunakan untuk melihat bantuan cara memainkan game.
Layar Permainan
Layar ini merupakan tempat dimana permainan TicTacToe dilakukan, dan pada layar ini diharapkan user dengan device (ponsel) dapat saling berinteraksi. Aplikasi permainan TicTacToe merupakan aplikasi yang animatif dan interaktif, dimana dalam permainan ini digunakan media grafis dan audio sebagai alat penyampaian informasi kepada user. Untuk lebih jelasnya, rancangan layar permainan dapat dilihat pada gambar berikut :
 Layar High Score
Pada layar ini user dapat melihat daftar score tertinggi yang tersimpan dalam ponsel. Pada aplikasi permainan TicTacToe ini penulis menyediakan tempat untuk menyimpan daftar banyaknya permainan dilakukan, jumlah menang, kalah dan seri. Rancangan tampilan layar
Pemilihan terhadap menu “Pengaturan” akan memunculkan tiga buah submenu
yaitu :
1.               “Nama Pemain”, digunakan untuk memberikan nama bagi user yang akan bermain.
2.               “Level CPU”, digunakan untuk memilih tingkat kesulitan permainan, dimana user dapat memilih level yang dibagi menjadi tiga tingkatan yaitu mudah, sedang dan master, semaikin tinggi level yang dipilih maka akan semakin tinggi tingkat kesulitannya.
  3.       “Giliran”, digunakan untuk menentukan siapa yang akan mengambil giliran jalan pertama.
  4.       “Simbol”, digunakan untuk memilih bentuk item yang akan dipakai untuk bermain.
Layar Menu
Terdapat dua kelompok menu pada aplikasi permainan ini. Pada kedua kelompok menu tersebut akan diberikan bentuk tampilan yang sama agar user dapat dengan mudah mengenalinya.
 
Pembuatan Program
Pada pemrograman java (J2ME), setiap fungsi yang ingin dibuat harus dituliskan didalam sebuah kelas, karena pada dasarnya J2ME menganut prinsip pemrograman OOP (object oriented programming). Pada pembuatan aplikasi permainan TicTacToe ini, penulis membagi fungsi yang terdapat dalam aplikasi ini kedalam beberapa kelas, dimana setiap kelas dibuat berdasarkan karakteristik layar yang dipergunakan dalam aplikasi. Dengan kata lain, setiap layar yang ada dibangun dari kelas tersendiri. Penjelasan tentang kelas yang dibuat dan isinya akan dijelaskan pada subbab terpisah.
Import Library J2ME
Pertama masukkan dahulu library java J2ME pada MIDP2.0 yang akan di pakai dalam pembuatan game , librarynya sebagai berikut :
import javax.microedition.lcdui.*;
import javax.microedition.midlet.*;
import java.util.Random;

Kelas TicTacToe
Kelas ini merupakan kelas pembangun aplikasi permainan yang utama dan juga digunakan untuk menampilkan menu utama. Kelas ini didefinisikan sebagai berikut :
public class MIDlet_tictactoe
extends MIDlet implements CommandListener{
Kelas ini didefinisikan sebagai kelas turunan MIDlet, yang berarti program ini dibuat menggunakan profile MIDP. Kelas ini juga mengimplementasi interface CommandListener, yang digunakan untuk menangkap pilihan user terhadap menu.

Deklarasi Variabel
Baris selanjutnya selanjutnya adalah deklarasi variable, objek dan command yang dipakai dalam program ini, dimana strukturnya adalah sebagai berikut :
protected bulet_silang BS;
      protected Display tampil;
      private kanpas KANPAS;

      private Form menu_opsi,
                       skornya,
                       swet;
      private Command cmd_keluar,
                              cmd_opsi,
                              cmd_skor,
                              cmd_main,
                              cmd_kembali,
                              cmd_simpan,
                              cmd_batal,
                              cmdOK,
                              cmd_OK2;
            Command tersebut dibuat untuk memberikan fungsi isi dari menu dalam game, seperti yang telah digambarkan diatas menu terdiri dari tiga bagian yaitu pengaturan, scor, main dan pada menu pengaturan dibagi menjadi sub lagi yaitu nama pemain, level CPU, giliran dan symbol, jika tidak terjadi perubahan pada submenu maka user bisa kembali papan tampilan game, dan jika salah satu sub menu itu di ubah maka akan muncul perintah baru yaitu simpan atau batal, jika batal maka perintahnya kembali default dan jika telah tersimpan maka perubahan yang telah dilakukan akan tersimpan. 


            Deklarasi Construktor Class
Baris selanjutnya yaitu pendeklarasian Construktor class atau kelas pembangun dari aplikasi ini dideklarasikan oleh TextField dengan nama teksname,
private TextField teksname;

            Deklarasi Objek
            Seperti sebelumya telah dijelaskan constructor classnya pada bagian ini akan di jelaskan tentang isi dari objek dan variable construktornya untuk lebih jelasnya yaitu sebagai berikut,
            private StringItem skor1,
                                 skor2,
                                 skor3,
                                 skor4,
                                 skor5;

      private ChoiceGroup level,
                                           player,
                                           xxx;

      protected boolean ditungguin = false;
      protected int pilih_aja[] = {0,0};

      private String nama = "Anda";

      private String kmptr = "CPU";

      private int menang = 0;

      private int kalah = 0;

      private int seti = 0;

      private int levenya = 0;

      private boolean mulai = true;

      private boolean xx = true;
      public MIDlet_tictactoe(){


            BS = new bulet_silang();
            teksname = new TextField("Nama","Anda",6,TextField.ANY);
            skor1 = new StringItem("Total bermain: ","0 kali");
            skor2 = new StringItem("Menang: ","0");
            skor3 = new StringItem("Kalah: ","0");
            skor4 = new StringItem("seri: ","0");
            skor5 = new StringItem(
                  "Cara Bermain: "," There is No Rule, Hajar aj !");

            String elem1[] = {"Gampang","Biasa","Master"};
            level = new ChoiceGroup("Level CPU",Choice.POPUP,elem1,null);

            String elem2[] = {"Giliran Anda","Giliran CPU"};
            xxx = new ChoiceGroup("",Choice.POPUP,elem2,null);

            String elem3[] = {"X","O"};
            player = new ChoiceGroup("Simbol",Choice.POPUP,elem3,null);
            Baris program di atas adalah isi dari menu pada game TicTacToe, pada baris pertama yang dideklarasikan adalah untuk menu score yang di bagi menjadi empat bagian yaitu : banyaknya bermain, menang, kalah dan seri yang diwakili oleh string item skor1, skor2,skor3,skor4 dan skor5. Pada baris selanjutnya kelas choicegroup yang ada pada menu, pertama mengisi nama pemain, pada menu selanjutnya menu bisa dipilih dengan cara popup yaitu dengan memilih pilihan menu yang telah ada dan level CPU yang bisa dipilih yaitu  mudah, biasa dan master dengan level yang dideklarasikan dengan string elemen1, selanjutnya string elemen2 yaitu giliran, arti giliran disini adalah untuk menentukan siapa yang akan menjalankan atau memulai permainan ini lebih dulu, pada baris selanjutnya yaitu string elemen3 yang di artikan di artikan sebagai pemilihan symbol, symbol yang dipakai disini yaitu symbol X dan O sebagai item yang dipakai untuk bermain.

            elas Option Screen
                Selanjutnya kita akan menuliskan perintah-perintah yang akan dieksekusi pada saat aplikasi dijalankan, listingnya sebagai berikut,

cmd_keluar = new Command("Keluar", Command.EXIT, 0);
            cmd_opsi = new Command("Pengaturan",Command.ITEM,1);
            cmd_skor = new Command("Skor",Command.ITEM,2);
            cmd_main = new Command("Peraturan Permainan",Command.ITEM,3);
            cmd_simpan = new Command("Simpan",Command.OK,0);
            cmd_batal = new Command("Batal",Command.BACK,1);
            cmdOK = new Command("OK",Command.BACK,0);
            cmd_OK2 = new Command("OK",Command.BACK,0);
     di atas adalah command button yang ada pada permainan dan menu option seperti keluar, opsi, skor, main, simpan, dll.   
      KANPAS = new kanpas(this);
            KANPAS.addCommand(cmd_keluar);
            KANPAS.addCommand(cmd_opsi);
            KANPAS.addCommand(cmd_skor);
            KANPAS.addCommand(cmd_main);
            KANPAS.setCommandListener(this);
            Selanjutnya adalah statement untuk memanggil kelas kanpas, yaitu kelas untuk yang digunakan untuk mengatur tata letak dan warna tampilan permainan dimana kelas kanpas juga mendeklarasikan fungsi dari pergerakan atau tombol yang digunakan untuk mengoperasikan permainan ini.
            menu_opsi = new Form("Opsi");
            menu_opsi.append(teksname);
            menu_opsi.append(level);
            menu_opsi.append(xxx);
            menu_opsi.append(player);
            menu_opsi.addCommand(cmd_simpan);
            menu_opsi.addCommand(cmd_batal);
            menu_opsi.setCommandListener(this);
           
            Menu opsi yaitu menu pengaturan dalam game, yang ada didalamnya yaitu teksname untuk mengisi nama pemain, level untuk memilih level permainan, giliran pemain dan symbol. Dan menu command dalam menu untuk menunjukkan proses selanjutnya yaitu command simpan untuk menyimpan perubahan yang telah dilakukan dalam opsi dan command batal untuk membatalkan perubahan pada pengaturan dan kembali pada permainan.


skornya = new Form("History");
            skornya.append(skor1);
            skornya.append(skor2);
            skornya.append(skor3);
            skornya.append(skor4);
            skornya.addCommand(cmdOK);
            skornya.setCommandListener(this);
            swet = new Form("Petunjuk");
            swet.append(skor5);
            swet.addCommand(cmd_OK2);
            swet.setCommandListener(this);
      }
Selanjutnya  pada menu opsi score yang ditampilkan yaitu untuk scor1 dan seterusnya yaitu banyaknya bermain, menang, kalah dan seri.
            public void startApp(){
            tampil = Display.getDisplay(this);
            tampil.setCurrent(KANPAS);
            startNewRound();
      }
      public void destroyApp(boolean unconditional){}
      public void pauseApp(){}
      public void commandAction(Command c, Displayable s){
            if (c==cmd_keluar){notifyDestroyed();}
            if (c==cmd_main){tampil.setCurrent(swet);}
            if (c==cmd_kembali){tampil.setCurrent(KANPAS);}
            if (c==cmd_batal){tampil.setCurrent(KANPAS);}
            if (c==cmdOK){tampil.setCurrent(KANPAS);}
            if (c==cmd_OK2){tampil.setCurrent(KANPAS);}


     Saat memulai baru akan ditampilkan papan permainan yang dipanggil dari kelas kanpas, jika memilih command keluar maka akan keluar dari permainan, selain itu menu akan melanjutkan pada permainan.
             if (c==cmd_skor){
                  skor1.setText(""+(menang+kalah+seti)+" main");
                  skor2.setText(""+menang);
                  skor3.setText(""+kalah);
                  skor4.setText(""+seti);
                  tampil.setCurrent(skornya);
            }

            if (c==cmd_opsi){
                  teksname.setString(nama);
                  level.setSelectedIndex(levenya,true);
                  xxx.setSelectedIndex((mulai?0:1),true);
                  player.setSelectedIndex((xx?0:1),true);
                  tampil.setCurrent(menu_opsi);
            }

            if (c==cmd_simpan){
                  mulai = (xxx.getSelectedIndex()==0?true:false);
                  xx = (player.getSelectedIndex()==0?true:false);
                  levenya = level.getSelectedIndex();
                  nama = teksname.getString();
                  if (nama.length()==0) {
                        teksname.setString("Anda");
                        nama="Anda";
                  }


            Diatas adalah statement untuk menu serta variable yang digunakan serta proses selanjutnya yang ada pada menu saat disimpan.
                  Alert msg = new Alert("Pengaturan disimpan","",
                        null, AlertType.INFO);
                  msg.setTimeout(2500);
                  tampil.setCurrent(msg,KANPAS);
            }
      }
            Jika proses penyimpanan berhasil maka akan muncul peringatan ‘pengaturan telah disimpan”.
      private void startNewRound(){
            ditungguin = false;

            BS.gameReset();
            KANPAS.repaint();

            BS.setDifficulty(levenya);
            BS.setPlayerTurn(mulai);
            if (mulai) {if (!xx) BS.switchSymbol();}
            else {if (xx) BS.switchSymbol();}
     
            kmptr = level.getString(
                  level.getSelectedIndex()) + " Komputer";

            pilih_aja[0]=0;
            pilih_aja[1]=0;

            if (!mulai) {
                  compMakeMove();
                  KANPAS.repaint();
            }
            ditungguin = true;
      }
      protected void endGame(int result){
            String rndComment[] = {"mengalahkan"};

            String title="",text="",comment="";
            Random rnd = new Random(System.currentTimeMillis());
            switch (result){
            case 0:
                  seti++;
                  title = "Draw!";
                  text = ".";
                  break;
            case 1:
                  menang++;
                  title = "menaaang!";
                  comment = rndComment[Math.abs(rnd.nextInt())%rndComment.length];
                  text = nama + " " + comment + " " + kmptr;
                  break;
            case 2:
                  kalah++;
                  title = "mengalahkan!";
                  comment = rndComment[Math.abs(rnd.nextInt())%rndComment.length];
                  text = kmptr + " " + comment + " " + nama;
                  break;
            default:
            }

            Penjelasan untuk barisan statement di atas adalah, saat memulai permainan tampil papan permainan, dan bermain akan di panggil terlebih dulu kelas untuk level komputernya, lalu giliran main pertama dan symbol yang dipakai, setelah selesai permainan maka akan muncul peringatan menang, kalah atau Draw dan muncul nama yang digunakan sebagai pemain.
            startNewRound();
            Alert msg = new Alert(title,text,null, AlertType.INFO);
            msg.setTimeout(3000);
            tampil.setCurrent(msg,KANPAS);
      }

            protected void playerMakeMove(){
            if (BS.placeMove(pilih_aja[0],pilih_aja[1])){
                  ditungguin=false;


                  KANPAS.repaint();
                  KANPAS.serviceRepaints();

                  if (BS.checkWin()) {endGame(1); return;}
                  if (BS.checkDraw()) {endGame(0); return;}
                  compMakeMove();
            }
      }
protected void compMakeMove(){

            BS.computeMove();
            KANPAS.repaint();
            KANPAS.serviceRepaints();

            if (BS.checkWin()) {endGame(2); return;}
            if (BS.checkDraw()) {endGame(0); return;}

            ditungguin=true;
      }
}
Peringatan akan muncul selama waktu yang ditentukan, dan jika telah muncul peringatan maka proses selanjutnya score permainan akan tersimpan secara otomatis dan akan mulai permainan selanjutnya.
Uji Coba Program

Uji coba program merupakan hal paling akhir yang dilakukan penulis dalam membangun aplikasi permainan TicTacToe ini. Pada bagian ini penulis mencoba untuk menguji apakah program yang dibuat telah sesuai dengan rancangan awal yang dibuat, dan jalannya program telah sesuai dengan alur yang diharapkan. Untuk menjalankan program, penulis menggunakan sebuah emulator ponsel DefaultColorPhone pada WTK 2.5.2. Emulator ini dapat berfungsi sebagai sebuah ponsel virtual yang dijalankan pada PC, dan memiliki fungsi serta spesifikasi (fitur, warna, dimensi layar, tombol, suara, dan lainnya) yang sama seperti pada ponsel yang sebenarnya. Pada saat dijalankan, emulator ini akan tampak sebagai berikut :
Layar Menu

Pada saat aplikasi permainan TicTacToe dibuka pertama kali pada ponsel, tampilan layar akan tampak sebagai berikut :

Tampilan Menu ”Pengaturan”

Menu Pengaturan terdiri dari satu buah text field untuk memasukkan nama pemain dan 3 buah pilihan, yaitu ”Level”, ”Giliran bermain” dan ”Simbol”, yang memiliki nilai yang dapat diubah. Untuk pengaturan jika seting ingin disimpan maka pilih simpan dan jika ingin langsung kembali pada permainan tanpa mengubah seting apapun pilih batal. Tampilan untuk layar pengaturan seperti dibawah ini :



Layar Permainan
Pada saat membuka aplikasi pemain akan langsung memainkan permainan baru, seperti yang telah dijelaskan diatas peraturan permainan adalah membentuk susunan bentuk yang sama secara horizontal, vertical maupun diagonal, contohnya seperti dibawah ini :

Untuk mengoperasikan permainan, pemain hanya perlu menggunakan tombol navigasi yang ada pada ponsel untuk menentukan jalannya target sasaran dan untuk membentuk item menggunakan tombol center key jika menggunakan emulator pada WTK dan tombol 5 pada ponsel.