Aplikasi permainan Tic Tac Toe ini adalah aplikasi berupa
permainan yang terdiri dari 3 x 3 bidak yang pada umumnya lambang dari
permainan Tic Tac Toe pada umumnya adalah O dan X. Pada kesempatan ini penulis
membuat aplikasi permainan Tic Tac Toe dengan tampilan yang menarik sehingga
tidak mengesankan permainan Tic Tac Toe adalah permainan yang sulit dan
ditambah menu untuk mengubah tema sehingga pemain tidak merasa bosan dengan
symbol O dan X. Simbol dapat dirubah sesuai tema yang disediakan dapat berupa
lambang wajah, lambang sepakbola dalam negeri, lambang sepakbola Italia dan plush
toy.
Dalam pembuatannya, aplikasi permainan ini harus dibuat
dahulu rancangan tampilan awal yang berupa menu untuk memulai permainan, menu
option untuk merubah settingan pada aplikasi permainan Tic Tac Toe dan menu
bantuan untuk mengetahui bagaimana cara memainkan aplikasi Tic Tac Toe serta
menu keluar untuk keluar permainan. Berikutnya mulai dilakukan pembuatan
program dengan menggunakan editor ECLIPSE. Setelah proses pembuatan program
selesai dilakukan proses pengujian program dengan menggunakan emulator
Android (Android SDK) sampai program berhasil dicompile dan
dijalankan dengan baik.
Rancangan
Umum Aplikasi.
Aplikasi permainan Tic Tac Toe ini adalah aplikasi berupa
permainan yang terdiri dari 3 x 3 bidak yang pada umumnya lambang dari
permainan Tic Tac Toe pada umumnya adalah O dan X. Pada kesempatan ini penulis
membuat aplikasi permainan Tic Tac Toe dengan tampilan yang menarik sehingga
tidak mengesankan permainan Tic Tac Toe adalah permainan yang sulit dan
ditambah menu untuk mengubah tema sehingga pemain tidak merasa bosan dengan
symbol O dan X. Simbol dapat dirubah sesuai tema yang disediakan dapat berupa
lambang wajah, lambang sepakbola dalam negeri, lambang sepakbola Italia dan
plush toy
Pembuatan Aplikasi Permainan Tic Tac
Toe.
Untuk membuat aplikasi permainan Tic Tac Toe ini, terlebih
dahulu penulis harus menyiapkan Environtmentnya, terutama Android SDK, ADT (
Android Development Tools ) dan Eclipse.
1 Untuk menginstall Eclipse penulis akan menginstal Java JDK
(java development kit) versi 5 atau diatasnya.
2 Install dan setting Android SDK.
3 Kemudian install & mengkonfigurasi Eclipse (kita
akan menggunakan Eclipse 3.5 Galileo), juga menginstall ADT (kita akan menggunakan
ADT 0.9.4 ).
Pertama, penulis jalankan eclipse terlebih dahulu. Penulis
akan menggunakan Eclipse IDE for Java EE developers. Setiap ingin membuat
project baru eclipse meminta penulis untuk membuat folder workspace dan di
letakkan di salah satu Partisi hardisk computer. Kemudian lembar kerja eclipse
dibuka dan penulis siap membuat aplikasi permainan Tic Tac Toe.
Sebelum membuat project, maka lebih dahulu penulis harus
mengkonfigurasikan package android. Dengan mengkonfigurasikan package tersebut Google
API dan SDK platform dari yang paling lama hingga versi terbarunya beserta AVD
(Android Virtual Device). Jika sudah berhasil maka eclipse sudah terkonfigurasi
dengan Android SDK dan AVD manager.
Pembuatan Tampilan Menu Utama.
Pembuatan halaman Menu
Utama ini dengan menggunakan script xml yang disimpan pada welcome.xml.
Berikut potongan script nya :
xml
version="1.0" encoding="utf-8"?>
<=""
span=""
xmlns:android="http://schemas.android.com/apk/res/android">
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/bg_maple"
>
<="" android:id="@+id/title" span="">
android:background="@drawable/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="5dip"
android:layout_marginTop="20dip"
/>
<="" android:id="@+id/new_game" span="">
android:background="@drawable/new_game"
android:layout_width="wrap_content"
android:layout_height="60dip"
android:layout_alignParentRight="true"
android:layout_marginRight="5dip"
android:layout_below="@id/title"
android:layout_marginTop="20dip"
/>
<="" android:id="@+id/options" span="">
android:background="@drawable/options"
android:layout_width="wrap_content"
android:layout_height="60dip"
android:layout_alignParentRight="true"
android:layout_marginRight="5dip"
android:layout_below="@id/new_game"
/>
<="" android:id="@+id/help" span="">
android:background="@drawable/help"
android:layout_width="wrap_content"
android:layout_height="60dip"
android:layout_alignParentRight="true"
android:layout_marginRight="5dip"
android:layout_below="@id/options"
/>
<=""
android:id="@+id/quit" span="">
android:background="@drawable/quit"
android:layout_width="wrap_content"
android:layout_height="60dip"
android:layout_alignParentRight="true"
android:layout_marginRight="5dip"
android:layout_below="@id/help"
/>
Script
di
atas digunakan untuk memuat background dari
menu utama aplikasi permainan Tic Tac Toe
dan membuat button yang terdapat
pada menu utama seperti Permainan baru, Menu option, Bantuan, Keluar. Pada background menu utama gambar yang dimuat
diambil dari komponen folder drawable pada
folder res dengan nama file bg_maple dan judul dari aplikasi dimuat dari gambar
yang terdapat pada folder yang sama dengan nama file title.
Button Permainan baru yang terdapat pada
menu utama memiliki id new_game , yang mana id tersebut digunakan pada script logika untuk
menggunakan yang digunakan untuk menjalankan kelas yang lain. Setelah button
“Permainan Baru” di tekan, maka logika program yang menggunakan tombol
tersebut akan menjalankan apa yang diperintahkan. Button Menu option yang terdapat pada menu utama memiliki id options, id tersebut juga digunakan pada
script logika untuk memanggil sub
menu dari Menu option. Setelah button “Menu
Option” di tekan, maka sub menu yang ada di dalam Menu option akan dipanggil. Button Bantuan yang terdapat pada menu
utama memiliki id help, id tersebut
digunakan pada script logika untuk
memanggil layout dari menu Bantuan. Button Keluar pada menu utama memiliki
id quit, yang mana id tersebut digunakan pada script logika untuk menjalankan fungsi
dari button tersebut yaitu keluar
dari permainan Tic Tac Toe. Berikut
potongan dari script Tictactoe.java :
public class TicTacToe extends Activity {
/**
Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.welcome);
final ImageView iv_new_game = (ImageView) findViewById(R.id.new_game);
final ImageView iv_options = (ImageView) findViewById(R.id.options);
final ImageView iv_help = (ImageView) findViewById(R.id.help);
final ImageView iv_quit = (ImageView) findViewById(R.id.quit);
iv_new_game.setOnClickListener(welcome_listener);
iv_options.setOnClickListener(welcome_listener);
iv_help.setOnClickListener(welcome_listener);
iv_quit.setOnClickListener(welcome_listener);
}
/**
* Common onClickListener for Welcome
Screen Buttons
* */
OnClickListener welcome_listener = new View.OnClickListener()
{
public void onClick(View v) {
final ImageView iv =
(ImageView) v;
if (iv.getId() == R.id.new_game) {
showDialog(NAME_DIALOG_ID);
}
else if(iv.getId() == R.id.options) {
options_menu();
}
else if (iv.getId() == R.id.help) {
showDialog(HELP_DIALOG_ID);
}
else if (iv.getId() == R.id.quit) {
finish();
}
}
};
Perintah diatas menyatakan, bahwa logika program pada script
tersebut berlaku untuk tampilan file welcome.xml. Kemudian pada layout welcome.xml gambar
untuk tiap – tiap pilihan pada menu utama ditampilkan berdasarkan masing –
masing id nya. Terdapat beberapa situasi kondisi pada setiap button yang
dipilih yang kemudian diarahkan pada masing – masing fungsi pada script pilihan
yang terdapat pada menu utama. Berikut tampilan halaman menu utama :
Tampilan
Menu Utama
Pembuatan Tampilan Permainan Baru.
Pembuatan tampilan Permainan Baru
ini dengan menggunakan script xml yang disimpan pada main.xml dan
name_dialog_2.xml. Pada script xml name_dialog_2.xml berfungsi menampilkan dialog untuk memasukan nama
pemain 1 dan pemain 2 sebelum permainan dimulai sedangkan pada script xml main.xml berfungsi untuk membuat area atau bidak dari permainan Tic
Tac Toe yang berjumlah 3 x 3 bidak. Berikut potongan script nya :
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_alignParentRight="true"
android:layout_marginLeft="0dip"
android:layout_marginTop="60dip"
android:layout_marginRight="10dip"
android:src="@drawable/default_button"
android:tag="3"
/>
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_toLeftOf="@id/b3"
android:layout_marginTop="60dip"
android:src="@drawable/default_button"
android:tag="2"
/>
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_toLeftOf="@id/b2"
android:layout_marginTop="60dip"
android:src="@drawable/default_button"
android:tag="1"
/>
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_alignParentRight="true"
android:layout_marginLeft="0dip"
android:layout_below="@id/b3"
android:layout_marginRight="10dip"
android:src="@drawable/default_button"
android:tag="6"
/>
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_toLeftOf="@id/b6"
android:layout_below="@id/b2"
android:src="@drawable/default_button"
android:tag="5"
/>
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_toLeftOf="@id/b5"
android:layout_below="@id/b1"
android:src="@drawable/default_button"
android:tag="4"
/>
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_alignParentRight="true"
android:layout_marginLeft="0dip"
android:layout_below="@id/b6"
android:layout_marginRight="10dip"
android:src="@drawable/default_button"
android:tag="9"
/>
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_toLeftOf="@id/b9"
android:layout_below="@id/b5"
android:src="@drawable/default_button"
android:tag="8"
/>
android:layout_width="100dip"
android:layout_height="100dip"
android:layout_toLeftOf="@id/b8"
android:layout_below="@id/b4"
android:src="@drawable/default_button"
android:tag="7"
/>
Perintah diatas menyatakan, bahwa logika
program pada script tersebut
berfungsi membentuk sebuah bidak yang berjumlah 3 x 3 bidak yang telah disesuaikan ukurannya dan kemudian
gambar dari background bidak Tic tac
Toe diimport dari source program
dengan nama file default_button.
xml
version="1.0" encoding="utf-8"?>
android:id="@+id/layout_root"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="10dp">
android:id="@+id/namep1"
android:layout_width="200dip"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_marginTop="10dip"
android:text=" Pemain 1"/>
android:id="@+id/namep2"
android:layout_width="200dip"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_below="@id/namep1"
android:autoText="true"
android:text=" Pemain 2"/>
Tidak ada komentar:
Posting Komentar