Keterangan: 1.
Pilih Back : berfungsi untuk kembali ke menu form daftar Tajwid.
BAB IV IMPLEMENTASI DAN PENGUJIAN
4.1
Implementasi Setelah
melakukan
analisis
dan
perancangan
terhadap
aplikasi
Pembelajaran Baca Al-Qur’an, tahapan selanjutnya adalah implementasi dan pengujian. Pada tahapan implementasi terdapat dua cakupan yaitu spesifikasi kebutuhan sistem yang meliputi emulator Java2 Micro Edition(J2ME) dan telepon genggam, implementasi yang meliputi proses pengkodean, disain antarmuka dan hal-hal yang berhubungan dengan pengujian aplikasi.
4.2
Spesifikasi Kebutuhan Sistem Berikut spesifikasi kebutuhan sistem dimana aplikasi dirancang atau
dibuat dan diimplementasikan pada emulator J2ME dan telepon genggam : 1.
2.
Komputer Desktop (hardware) : a.
Prosesor Intel Pentium (R) 4 CPU 2.40 GHz
b.
DDR1 RAM 512 Mb
c.
Harddisk Seagate 80 GB 7200 RPM
Perangkat Lunak (software) :
a.
Microsoft Windows XP Professional Service Pack 2
b.
Java Development Kit (JDK) 1.6.0 dan Java Runtime Environment 1.6.0 (virtual machine java)
c.
Emulator Sun Java Wireless ToolKit 2.5
d.
NetBeans ID E 6.5
e. Adobe Photoshop 7.0 f. Nero 6 Wave Editor 3.
Telepon Genggam (hardware) : a.
4.3
Type : Nokia 5310 Express Music
Pengkodean Pada bab ini akan dijelaskan potongan-potongan dari kode sumber (source
code) aplikasi Pembelajaran Baca Al-Qur’an. Potongan-potongan program yang akan dijelaskan mengacu pada analisa bab sebelumnya, source code yang ada sebagai berikut:
public void startMIDlet() { switchDisplayable(null, getSplashScreen()); } { if (displayable == form) { if (command == aboutCommand) { switchDisplayable(null, getForm2());
} else if (command == exitCommand5) {
exitMIDlet(); } else if (displayable == list) { if (command == List.SELECT_COMMAND) { listAction(); public StringItem getStringItem() { if (stringItem == null) { stringItem = new StringItem("1. Cari Surat", ""); stringItem.addCommand(getPlayCommand1()); stringItem.setItemCommandListener(this); } return stringItem; } public StringItem getStringItem1() { if (stringItem1 == null) { stringItem1 = new StringItem("2. Cari Surat Per Ayat", "");
stringItem1.addCommand(getPilihCommand2()); stringItem1.setItemCommandListener(this); } return stringItem1; } public StringItem getStringItem2() { if (stringItem2 == null) { stringItem2 = new StringItem("3. Cari Tajwid", ""); stringItem2.addCommand(getPilihCommand3());
stringItem2.setItemCommandListener(this); } return stringItem2; } public Image getImage78() { if (image78 == null) { try { image78 = Image.createImage("/arabic.png"); } catch (java.io.IOException e) { e.printStackTrace(); } } return image78; }
Potongan kode program
public void startMidlet() berfungsi untuk memulai
aplikasi alquran, kode program switchDisplayable(null, getSplashScreen()) berfungsi untuk menampilkan gambar image1. Untuk menampilkan menu utama pada aplikasi alquran terdapat pada kode program public StringItem getStringItem().
sedangkan
kode
program
image78
=
Image.createImage(”/arabic.png”) berfungsi untuk menggambarkan sebuah image dengan nama file gambar arabic.png.
public void list10Action() { String __selectedString = getList10().getString(getList10().getSelectedIndex()); if (__selectedString != null) { if (__selectedString.equals("1. An-naba\'")) { switchDisplayable(null, getList11()); }
Potongan kode program di atas menjelaskan tentang fungsi untuk memilih surat yang akan di tampilkan.
public Image getImage3() { if (image3 == null) { try { image3 = Image.createImage("/1.surat_Annaba\'.png"); } catch (java.io.IOException e) { e.printStackTrace(); } } return image3; }
Potongon kode program di atas menjelaskan tentang fungsi untuk menampilkan gambar yaitu gambat 1. Surat_An-naba.png.
4.4. Antarmuka Pada bab berikut akan dijelaskan implementasi antarmuka aplikasi Pembelajaran Baca Al-Qur’an Secara Mobile menggunakan emulator J2ME.
4.4.1 Jendela Inisialisasi Ketika pengguna ponsel akan menjalankan aplikasi Pembelajaran Baca AlQur’an, yang pertama kali ditampilkan kepada pengguna ponsel adalah jendela inisialisasi. Pada jendela tersebut pengguna ponsel dapat memulai aplikasi dengan terlebih dahulu menekan tombol bertuliskan ”Launch” seperti pada gambar 4.1 berikut ini.
Gambar 4.1. Tampilan Jendela Inisialisasi
4.4.2 Jendela Cover Petunjuk Pada saat aplikasi dijalankan akan muncul cover judul aplikasi Pembelajaran Baca Al-Qur’an. Kemudian akan langsung menuju menu utama. Seperti pada gambar 4.2 berikut ini.
Gambar 4.2 Tampilan Jendela Cover Judul Aplikasi
4.4.3 Jendela Menu Utama Setelah pengguna ponsel memasuki halaman cover judul, pengguna ponsel akan dibawa ke halaman menu utama, Pada halaman ini terdiri dari tombol menu dan tombol about, dimana tombol menu terdiri dari dua pilihan menu yaitu Pilih dan Exit sedangkan tombol About untuk melihat petunjuk dari aplikasi Pembelajaran Baca Al-Qur’an. Berikut adalah Gambar 4.3 :
Gambar 4.3 Tampilan Jendela Menu Utama
4.4.4
Jendela Halaman About Jika pengguna memilih menu about maka akan ditampilkan seperti pada
Gambar 4.4 dibawah ini. Menu ini berguna untuk menampilkan petunjuk/fitur pada aplikasi tersebut, untuk kembali kemenu utama pilih tombol back.
Gambar 4.4 Tampilan Jendela halaman Petunjuk Aplikasi
4.4.5 Jendela Daftar Menu Surat Pada halaman ini terdapat daftar surat pada Juz Amma’. Pengguna ponsel dapat memilih salah satu surat yang dinginkan. Untuk menampilkan surat beserta artinya arahkan kursor ke nama surat yang akan ditampilkan, kemudian tombol pilih. Tampilan daftar menu surat dapat dilihat pada Gambar 4.5.
Gambar 4.5. Tampilan jendela daftar menu surat.
4.4.6 Jendela Halaman Tampilan Surat Halaman surat ini akan tampil jika pengguna sudah memilih salah satu surat yang ada dengan menekan tombol Pilih. Maka akan tampil surat yang berisi huruf Arab beserta terjemahan. Pada halaman surat ini juga terdapat tombol back berfungsi untuk kembali ke menu surat yang menampilkan daftar surat, sedangkan tombol Exit untuk keluar. Halaman tampilan surat dapat dilihat pada Gambar 4.6.
Gambar 4.6. Jendela halaman tampilan surat
4.4.7 Jendela Daftar Menu Surat Per Ayat Pada halaman ini terdapat daftar surat per ayat pada Juz Amma’. Pengguna ponsel dapat memilih salah satu surat yang dinginkan. Untuk menampilkan daftar menu ayat beserta artinya arahkan kursor ke nama surat yang akan ditampilkan, kemudian tombol pilih. Tampilan menu surat dapat dilihat pada Gambar 4.7.
Gambar 4.7. Tampilan jendela daftar menu surat per ayat.
4.4.8 Jendela Daftar Menu Ayat Halaman daftar ayat ini akan tampil jika pengguna sudah memilih salah satu ayat yang ada dengan menekan tombol Pilih. Maka akan tampil surat per ayat yang berisi huruf Arab beserta terjemahan. Pada halaman surat ini juga terdapat tombol back berfungsi untuk kembali ke menu surat yang menampilkan daftar surat dan daftar ayat. Halaman daftar ayat dapat dilihat pada Gambar 4.8.
Gambar 4.8. Tampilan jendela daftar menu ayat.
4.4.9 Jendela Halaman Ayat Halaman surat per ayat ini akan tampil jika pengguna sudah memilih salah satu ayat yang ada dengan menekan tombol Pilih. Maka akan tampil surat yang berisi huruf Arab beserta terjemahan. Pada halaman surat ini juga terdapat tombol back berfungsi untuk kembali ke menu ayat yang menampilkan daftar ayat. Halaman surat dapat dilihat pada Gambar 4.9.
Gambar 4.9. Jendela halaman tampilan ayat.
4.4.10 Jendela Daftar Menu Tajwid Pada halaman ini terdapat daftar menu Tajwid. Pengguna ponsel dapat memilih salah satu tajwid yang dinginkan. Untuk menampilkan daftar menu tajwid arahkan kursor ke nama tajwid yang akan ditampilkan, kemudian tombol pilih. Tampilan daftar menu tajwid dapat dilihat pada Gambar 4.10.
Gambar 4.10. Tampilan jendela daftar menu tajwid.
4.4.11 Jendela Halaman Tajwid Halaman tajwid ini akan tampil jika pengguna sudah memilih salah satu tajwid yang ada dengan menekan tombol Pilih. Maka akan tampil tajwid yang berisi penjelasan tajwid. Pada halaman tajwid ini juga terdapat tombol back berfungsi untuk kembali ke daftar menu tajwid yang menampilkan daftar tajwid. Halaman tajwid dapat dilihat pada Gambar 4.11.
