BAB 9

LATIHAN MEMBUAT APLIKASI JAVA

9.1 Tujuan
Setelah mempelajari bab ini, mahasiswa diharapkan
1. Mampu membuat aplikasi GUI konversi suhu
2. Mampu membuat aplikasi GUI kalkulator sederhana menggunakan Netbeans
3. Mampu membuat aplikasi GUI Sistem Informasi Perpustakaan menggunakan
database MySQL
9.2 Aplikasi I : Membuat Program Konversi Suhu
Komponen SWING
Kali ini kita akan membuat project konversi suhu dari Celcius ke Fahrenheit
menggunakan komponen SWING pada java. Tampilan hasil akhirnya seperti berikut
ini

Gambar 9.1 Tampilan akhir aplikasi.

Langkah Pembuatan :
1. Buat project baru pada Netbeans dan beri nama ProjectKonversiSuhuTT2D
2. Klik kanan pada nama project dan pilih New JFrame Form dan beri nama
Framenya dengan nama KonversiCelciusTT2D
3. Maka pada layar akan tampil

4.

Gambar 9.2 Jframe untuk Aplikasi

5. Dari palette tempatkan TextField, Button dan dua buah Label sehingga tampak
seperti berikut

Gambar 9.3 Penempatan TextField,label dan button

6. Pada Inspector, klik satu kali JFrame

Gambar 9.4 Tab Inspector

Pada propertinya, disebelah kanan, title diisi dengan Konversi Celcius
7. Klik kanan pada TextField seperti gambar berikut

Gambar 9.5 Mengedit teks pada TextField

Untuk jTextField dikosongkan, untuk JButton diubah menjadi Ubah, untuk
jLabel1 menjadi Celcius dan untuk jLabel2 menjadi Fahrenheit . Hasil
akhirnya tampak pada gambar berikut;

Gambar 9.6 Hasil Akhir Desain

8. Pada kolom inpector, ubah keempat variabel seperti berikut

Gambar 9.7 Mengubah nama Variable

Untuk jTextField diganti menjadi tempTextField

Gambar 9.8 Variable jTextField diubah menjadi tempTextField

Lakukan hal yang sama untuk jButton diganti menjadi convertButton, jLabel1
menjadi celciusLabel dan jLabel2 menjadi fahrenheitLabel. Hasil alhirnya sebagai
berikut

Gambar 9.9 Hasil perubahan nama variable pada Inspector

9. Tambahkan even pada button ubah dengan cara

Gambar 9.10 Pemberian Event pada tombol Ubah

Maka akan muncul ...

Gambar 9.11 Letak Kode yang ditambahkan

Tambahkan kode program berikut pada method convertButtonActionPerformed
int

tempFahr

(int)((Double.parseDouble(tempTextField.getText()))*

1.8 + 32);
fahrenheitLabel.setText(tempFahr + " Fahrenheit");

sehingga pada Source, akan tampil sebagai berikut

Gambar 9.12 Kode yang telah ditambahkan

Kode yang ditambahkan.
Eksekusi aplikasi tadi dan perhatikan hasilnya:

Gambar 9.13 Hasil Eksekusi

Input sebesar 32 oC dan outputnya 89 o Fahrenheit.

Aplikasi II : Membuat Kalkulator Sederhana

Program kalkulator merupakan program yang digunakan untuk menghitung bilangan
dengan operasi kali, bagi, tambah dan kurang.
Pengerjaan
Aplikasi dibuat dengan tiga tahap
1. membuat prototype program untuk penghitungan bilangan
2. membuat user interface berupa tampilan grafis dengan Netbeans
3. Membuat tampilan grafis menjadi interaktif dan dapat digunakan untuk dapat
melakukan perhitungan
Tujuan
Setelah membuat program kalkulator, diharapkan anda mampu :
1. Merencanakan pembuatan program berbasis obyek
2. Menggunakan operasi aritmetika pada java
3. Merencanakan dan membuat method yang akan dipakai dalam program
4. Membuat tampilan grafis untuk user interface, termasuk membuat about box
5. Menggunakan method yang dibuat ke dalam program
Method Kalkulator
Sebelum dibuat harus dipikirkan dulu algoritma dan cara kerja kalkulator nantinya.
Berikut detail pengolahan data yang akan dilakukan program kalkulator:

Kalkulator selalu mengolah dua buah nilai. Dua nilai tersebut akan disimpan
dalam variabel nilai1 dan nilai2. Misal : nilai1+nilai2 dan
seterusnya.

Kalkulator dilengkapi dengan fungsi untuk menghitung kedua bilangan yang

diolah. Operasi tersebut meliputi : tambah, kurangi, kali dan bagi. Masingmasing fungsi akan dibuatkan method tersendiri

Pada kalkulator, penghitungan baru akan dijalankan ketika tombol = atau

Enter ditekan

Pada kalkulator terdapat fungsi C untuk menghapus layar ke nilai 0.

Berikut contoh kerja kalkulator untuk menghitung 95 + 3.

1. Saat tombol angka 9 diklik, nilai angka tersebut akan disimpan di variabel
nilai1. Jadi nilai1 = 9.
2. Saat tombol angka 5 diklik, variable nilai1 akan dikalikan 10 lalu ditambah
5. Jadi nilai1=(9x10)+5=95.
3. Saat tombol tambah + ditekan, angka pada variable nilai1 akan
dimasukan ke dalam variable nilai2. Setelah itu nilai1 diset menjadi 0. Jadi
nilai2=nilai1 dan nilai1=0.
4. Saat tombol 3 ditekan, nilai angka tersebut akan dimasukan ke variable
nilai1, jadi nilai1 = 3.
5. Saat tombo samadengan = ditekan, nilai2 diubah menjadi nilai2 +
nilai1, jadi nilai2 = 95 + 3 = 98 dan nilai1 = 3.
Setelah deskripsi program dibuat, maka langkah selanjutnya adalah membuat
kerangka kode kemudian baru didefinisikan isi dari masing-masing method. Semua
method untuk perhitungan akan dimasukan ke dalam sebuah class dengan nama
MesinKalkulator.
class MesinKalkulator {
int nilai1;
int nilai2;
void
void
void
void
}

clear(){} //saat tombol C ditekan

digit() {} //saat tombol-tombol angka ditekan
operasi() {} //saat tombol +, -, * dan / ditekan
hitung() {} //saat tombol = ditekan
Gambar 9.14 Kerangka kode (sceleton code)

Method clear()
Method ini digunakan untuk melakukan penghapusan data pada nilai1 dan nilai2.
void clear() {
nilai1 = 0;
nilai2 = 0;
}

Method digit()
Penulisan angka-angka pada kalkulator menggunakan tombol-tombol. Karena itu
diperlukan method untuk membentuk nilai tersebut. Misalnya ketika mengklik tombol
1, 5 dan 0 secara berturut-turut, maka harus menghasilkan nilai 150.
void digit(int x) {
nilai1 = nilai1*10 + x;
}
Method hitung()
Dalam kalkulator, terdapat empat jenis perhitungan : tambah, kurangi, kali dan bagi.
Perhitungan akan dibuat dalam satu method saja. Tiap operasi apakah itu tambah,
kurangi, kali ataupun bagi hanya dibedakan oleh nilai variable operasi
void hitung() {
if(operasi == +)
nilai2 = nilai2 + nilai1;
else if(operasi == -)
nilai2 = nilai1 nilai2;
else if(operasi == *)
nilai2 = nilai2 * nilai1;
else if(operasi == /)
nilai2 = nilai1 / nilai2;
}
Method operasi()
Method ini dijalankan ketika tombol operasi ditekan. Dalam method inilah variabel
operasi ditentukan
char operasi;
void tambah() {
nilai2 = nilai1;
nilai1 = 0;

operasi = '+';
}
void kurangi() {
nilai2 = nilai1;
nilai1 = 0;
operasi = '-';
}
void kali() {
nilai2 = nilai1;
nilai1 = 0;
operasi = '*';
}
void bagi() {
nilai2 = nilai1;
nilai1 = 0;
operasi = '/';
}
Pengetesan Kode
Setelah kode dibuat, perlu dites apakah kode program dapat berjalan atau tidak.
Pengetesan awal dapat dilakukan dengan membuat class baru yakni Kalkulator,
kemudian dibuat obyek baru dengan tipe MesinKalkulator yang dilakukan untuk
melakukan perhitungan 13 + 10
public class Kalkulator {
public static void main(String arg[]) {
MesinKalkulator c = new MesinKalkulator ();
c.digit(1);
c.digit(3);
c.tambah();
c.digit(1);
c.digit(0);
c.hitung();
System.out.println(c.nilai2);

}
}
Apa hasilnya? Jika hasilnya seperti berikut, maka kemungkinan program sudah benar

Gambar 9.15 Hasil Test Program

Tampilan Grafis Kalkulator
Pembuatan tampilan grafis menggunakan IDE Netbeans. Lakukan langkah berikut :
1. Buat Project baru, pilih Java pada Category dan Java Desktop Application
pada Project.

Gambar 9.16 Langkah awal membuat Project

2. Ketikan Kalkulator pada Project Name dan pastikan Basic Application
dipilih. Klik tombol Finish
3. Pada pallete, klik label dan button, tempatkan pada frame

Gambar 9.17 Pemberian komponen palette pada JFrame

4. Ubah nama variabel jLabel1 menjadi layar dan edit Text jButton1 menjadi 1,
seperti berikut

Gambar 9.18 Mengubah text dan variable

5. Copy jButton1 hingga berjumlah 16 buah dan edit textnya hingga seperti
berikut (untuk jLabel1, textnya dihilangkan sehingga di frame tidak muncul)

Gambar 9.19 Tampilan Akhir Kalkulator

6. Ubah nama variable untuk masing-masing tombol sebagai berikut
Tabel 9.1 Komponen Palette dan nama variablenya
Tombol
0
1
2
3
4
... 9
/
*
+
=
C

Nama Variable
tb0
tb1
tb2
tb3
tb4
tb9
tbBagi
tbKali
tbTambah
tbKurangi
tbSamaDengan
tbC

7. Pada project, klik kanan package Kalkulator, pilih New Java Class

Gambar 9.20 Pembuatan Class baru

8. Beri nama class name dengan MesinKalkulator lalu tekan Finish.
9. Buka clas MesinKalkulator.java, copy dan pastekan method penghitungan,
yakni isi dari class MesinKalkulator

yang telah dibuat diawal. Letakkan

dibawah deklarasi class MesinKalkulator.

10. Karena penghitungan dengan MesinKalkulator tidak perlu membuat Object,
maka dibuat agar semua penghitungan dan variabel dideklarasikan sebagai
static.
static int nilai1, nilai2;
static char operasi;
MesinKalkulator() {
}
static void clear(){
nilai1=0;
nilai2=0;
}

static void digit(int x) {

nilai1 = nilai1*10 + x;
}
static void hitung(){
if (operasi == '+')
nilai2 = nilai1 + nilai2;
else if (operasi == '-')
nilai2 = nilai1 - nilai2;
else if (operasi == '*')
nilai2 = nilai1 * nilai2;
else if (operasi == '/')
nilai2 = nilai1 / nilai2;
nilai1 = 0;
}
static void tambah() {
nilai2 = nilai1;
nilai1 = 0;
operasi = '+';
}
static void kurangi() {
nilai2 = nilai1;
nilai1 = 0;
operasi = '-';
}
static void kali() {
nilai2 = nilai1;
nilai1 = 0;
operasi = '*';
}
static void bagi() {
nilai2 = nilai1;
nilai1 = 0;
operasi = '/';

}
Menangani Event Handling
Setelah file penghitungan dimasukan ke dalam project, langkah berikutnya adalah
memfungsikan tombol melalui Event Handling. Langkahnya adalah sebagai berikut
1. Kembali ke design tampilan Kalkulator, yakni file KalkulatorView.java, klik
kanan pada tombol 1 pilih Event Action actionPerformed dan
tambahkan kode
private void tb1ActionPerformed(java.awt.event.ActionEvent evt)
{
MesinKalkulator.digit(1);
}

2. Lakukan hal yang sama untuk tombol 0 sampai 9 dengan mengubah

MesinKalkulator.digit(1);

menjadi

MesinKalkulator.digit(9);

misalnya untuk tombol 9.

3. Tambahkan Event Handling berikut untuk tombol lainnya
Tabel 9.2 Nama tombol dan Kode Eventnya
Nama Tombol
tbTambah
tbKurangi
tbBagi
tbKali
tbC
tbSamaDengan

Kode Event
MesinKalkulator.tambah()
MesinKalkulator.kurangi()
MesinKalkulator.bagi()
MesinKalkulator.kali()
MesinKalkulator.clear()
MesinKalkulator.hitung()

4. Saat ini program sudah dapat dijalankan, hanya saja belum dapat ditampilkan
pada layar kalkulator (label layar). Agar dapat tampil, perlu ditambahkan kode
untuk mengganti teks pada label layar. Method yang dijalankan adalah
label.setText(teks);
Pada semua tombol angka, tambahkan kode berikut tepat di bawah
MesinKalkulator.digit().
layar.setText(""+MesinKalkulator.nilai1);
Pada tbSamaDengan yang ditampilkan adalah hasilnya, jadi gunakan kode
berikut :

layar.setText(""+MesinKalkulator.nilai2);
Karena pada penekanan tombol operasi tidak mengubah tampilan layar, maka
tidak perlu ditambahkan kode.
Informasi Tentang Operasi
Sampai tahap ini, aplikasi Kalkulator sudah dapat digunakan. Untuk melengkapinya,
informasi pada Kalkulator perlu diedit. Anda dapat melihat informasi tentang aplikasi
Kalkulator ini pada menu Help lalu About
1. Agar tampilan lebih baik, gambar dapat diganti sesuai dengan keinginan kita.
Copy gambar dari folder yang anda pilih kemudian pastekan pada folder
kalkulator.resources pada project Kalkulator,
2. Pada Project, buka file KalkulatorAboutBox.java, klik kanan pada gambar
dan arahkan mouse pada Properties. Pada icon, pilih gambar yang telah kita
pastekan tadi
3. Jangan lupa mengedit tulisan pada AboutBox
4. Judul pada AboutBox juga dapat diganti. Caranya, arahkan kursor mouse pada
Inspector lalu klik [JDialog]. Jika Inspector tidak muncul, klik menu Window
Navigating Inspector
5. Arahkan kursor pada bagian Properties, ganti judul dengan mengetikkan
variable untuk title.
Distribusi Aplikasi Java
Setelah ditest dan tidak ada kesalahan, anda dapat mengkompilasi program java yang
akan didistribusikan. Misalnya project yang akan didistribusikan diberinama
iKalkulator.
Langkahnya :
1. Jalankan perintah Build dengen menekan tombol Build Main Project atau
tekan tombol F11.
2. Pastikan terdapat pesan BUILD SUCCESSFUL. Folder tempat menyimpan
hasil

kompilasi

dapat

dilihat

D:\DATA\java\Kalkulator\dist

pada

pesan

itu

juga.

Misalnya

3. Anda dapat mendistribusikan program dengan cara menyalin file jar

(Kalkulator.jar) dan folder lib ke komputer lain. Misalnya simpan file
Kalkulator.jar, folder lib dan file README.TXT ke dalam folder
iKalkulator.
4. Copykan folder ini ke komputer lain, misalnya ada di D:\DATA\iKalkulator
5. Untuk menjalankan programnya, melalui command prompt beri perintah
D:\DATA\iKalkulator>java jar Kalkulator.jar
Aplikasi III : Sistem Informasi Perpustakaan menggunakan MySQL
Tujuan Aplikasi
1. Membuat database Perpustakaan menggunakan MySQL
2. Mengkoneksikan database Perpustakaan dengan Netbeans 6.8
3. Membuat user interface GUI database Perpustakaan menggunakan Netbeans
6.8
Tahap Pembuatan
A. Design database
Database perpustakaan yang akan dibuat terdiri dari 3 tabel yakni

Tabel Anggota

Tabel Buku

Tabel Peminjaman

Dengan relasi antar table sebagai berikut

Sebelumnya harus diinstall terlebih dahulu aplikasi MySQL versi 5 ke atas

Gambar 9.21 Relasi Tabel Database Perpustakaan

B. Pembuatan Database
1. Pada MySQL command line buatlah database perpustakaan dengan perintah
mysql>create database perpustakaan;
2. Pastikan database tersebut sudah terbentuk dengan perintah
mysql>shows databases;
Bila nama dari database perpustakaan telah tercantum, berarti database
tersebut telah terbentuk.
C. Koneksi dengan Database MySQL
1.

Dengan koneksi terhadap MySQL masih berlangsung,

bukalah aplikasi Netbeans dan pada Running Windows, pilihlah service seperti
tampak pada gambar

Gambar 9.22 Koneksi dengan database

2. Klik tanda + pada folder Databases, lalu klik tanda + pada folder Drivers dan
klik kanan pada MySQL(Connector/J driver), kemudian pilih Connect
Using... maka akan muncul jendela berikut

Gambar 9.23 New Database Connection

Masukan localhost pada Host, 3306 pada Port, perpustakaan pada Database,
root pada User Name, isikan password jika ada (default root pada MySQL
adalah tanpa password), dan beri tanda centang pada Show JDBC URL seperti
Gambar 3 di atas.
3. Bila ketika tekan OK ada tampilan berikut berarti koneksi database berhasil
dilakukan

Koneksi berhasil

Gambar 9.24 Koneksi berhasil

Bila muncul simbol

berarti koneksi berhasil, sebaliknya jika muncul

berarti koneksi gagal dan ulangi lagi dengan mengklik kanan simbol tersebut
4. Dari deretan database yang ada pilihlah database perpustakaan

Gambar 9.25 Daftar Database pada MySQL

5. Untuk membuat tabel, klik kanan pada folder Tables dan pilih create table

Gambar 9.26 Pembuatan Tabel

6. Beri nama tabel dengan Buku, lalu klik Add Column dan isikan name dengan
KodeBuku, Type dengan varchar dan sizenya 50 dan pada Constraint beri
tanda check pada Primary key (isikan sesuai dengan Gambar 1)
7. Lakukan hal yang sama dengan kolom yang lain, misalnya kolom Eksemplar
berikut

Gambar 9.27 Penambahan Kolom

Sampai seperti gambar berikut

Gambar 9.28 Tabel Buku dan Field-fieldnya

Bila sudah terbentuk tabel Buku, maka pada folder tables akan muncul seperti
berikut

Gambar 9.29 Tabel buku telah terbentuk

8. Buat table kedua yakni tabel anggota menggunakan MySQL server
commands. Klik kanan tables dan pilih Execute Command... maka akan
muncul SQL Editor sebagai berikut dan ketikan

Gambar 9.30 Pembuatan tabel anggota dengan perintah SQL

9. Untuk mengeksekusinya klik ikon

run SQL. Bila tidak ada yang salah

akan muncul

Gambar 9.31 Hasil Eksekusi perintah SQL

10. Untuk memasukan data pada tabel yang telah kita buat, klik kanan pada nama
table dan pilih Execute Commands.

Gambar 9.32 Memasukan data pada tabel

11. Pada SQL Editor masukan perintah berikut

Gambar 9.33 Perintah SQL untuk memasukan data pada tabel

Eksekusi perintah di atas dan check apakah ada yang salah.
12. Untuk melihat data yang telah kita masukan, klik kanan pada nama tabel dan
pilih View Data. Akan tampil

Gambar 9.34 Data hasil

13. Bila kita telah memiliki file SQL script, misalnya untuk pembuatan tabel
pinjam, dapt dieksekusi di Netbeans. Sebagai contoh tulis script berikut
menggunakan Notepad. Jika telah selesai simpan dengan nama file pinjam.sql.
CREATE TABLE pinjam (
NoPinjam varchar(50) NOT NULL PRIMARY KEY,
Tanggal datetime NOT NULL,
KodeBuku varchar(50) NOT NULL,
KodeAnggota varchar(50) NOT NULL);
14. Buka file pinjam.sql melalui menu file pilih open file, seperti gambar berikut

Gambar 9.35 Upload file sql

Browse file seperti berikut, bila sudah ketemu, pilih Open

Gambar 9.36 File sql yang akan diupload

Pada SQL Command Editor akan muncul seperti berikut lalu tekan

untuk

mengeksekusi.

Gambar 9.37 File sql yang telah diupload ke netbeans

Pilih database connection :msql://localhost:3306/perpustakaan[root on Default
schema] lalu klik OK.

Gambar 3.38 Pemilihan koneksi ke database

Klik kanan pada folder table di database perpustakaan dan pilih refresh, check
apakah tabel pinjam sudah terbentuk.

Membuat Aplikasi Gui Dengan Netbeans

Langkahnya adalah :
1. Buat Project Baru di Netbeans
2. Pilih jenis project adalah Java Desktop Application, beri nama projectnya
dengan Perpustakaan dan Choose Application Shell nya adalah Database
Application.
3. Pilih database connection-nya adalah msql://localhost:3306/perpustakaan[root
on Default schema]
4. Untuk aplikasi pertama, pilih database tablenya adalah Anggota

Gambar 3.39 Pemilihan koneksi dan tabel

5. Horee!!!!, kita telah berhasil membuat sebuah aplikasi database lengkap
dengan button-button pendukungnya. Coba eksekusi, dan hasilnynya adalah

Gambar 3.40 Tampilan standar hasil eksekusi

6. Ada tombol-tombol yang bisa dicoba. Pada tab design juga bisa diubah
layoutnya. Selamat mencoba......
9.5 Tugas/Latihan
1. Buat project untuk mengubah nilai suhu dari Fahrenheit ke Celcius,
tampilannya seperti berikut

2. Ubah project di atas dimana outputnya diletakan pada TextField seperti

Gambar berikut

Input dalam Fahrenheit

Output dalam Celcius ada di dalam TextField
3. Terapkan metode yang sama pada Aplikasi III untuk dua tabel lainnya !

DAFTAR PUSTAKA
1) Rachmad Hakim S. Dan Ir. Sutarto, M.Si, Mastering Java, Penerbit Elex Media
Computindo
2) Sun Micro System, The Java Tutorial, http://java.sun.com/docs/books/tutorial/