Studi Kasus Membangun Aplikasi GUI

Studi Kasus Aplikasi GUI

1.     Aplikasi Konversi Suhu

2.     Aplikasi Pertambahan Dua Angka

3.     Aplikasi Kalkulator

Tahapan Membuat Aplikasi GUI

1.   Membuat Project baru

2. Menambahkan JFrame Form (top level container)

3. Diatas JFrame diletakkan JPanel (intermediate container)

4. Tempelkan atomic (GUI) component

5. Edit text dari tiap component

6. Edit nama variable dari tiap component (untuk mempermudah coding)

7.  Rapikan tampilan dengan mengedit JFrame, JPanel dan mengubah Layout

8. Pilih component yang akan mengelola event dan pilih jenis event sesuai dengan kebutuhan

9. Tambahkan kode di method event yang disediakan.

Aplikasi Konversi Suhu

1   1.     Membuat Project Baru

    2.     Memberi Nama Project

      Nama Project: CelciusToFahrenheit

      Uncheck: Create Main Class

3. Menambahkan JFrame Form Pada Project

    Nama Frame: CelciusToFahrenheitGUI

    Package: GUI 

Menempatkan GUI Component ke Design (Frame)

4.     Mengubah Text dari GUI Component (Edit Text)

   JTextField1: Kosongi

    JLabel1: Celcius

    JLabel2: Fahrenheit

    JButton1: Convert

5. Mengubah Nama Variable dari Setiap GUI Component (Change Variable Name)

            JTextField1: celciusTextField

            JLabel1: celciusLabel

            JLabel2: fahrenheitLabel

            JButton1: convertButton 

6. Rapikan Tampilan Frame Program Kita (Potong Yang Tidak Perlu)

     7. Buat Event untuk Convert Button

8. Buat Code untuk Event Handling di Convert Button

  

      9. Kompilasi (Build, F11) Project

  10. Jalankan (Run, F6) Project

Taraaaaaaaaaa, ini dia hasilnya~

*untuk menambah keindahan design bisa dengan mengobrak abrik wilayah properti – properti pada Netbeans Anda, hhe ^_^

    Aplikasi Pertambahan Dua Angka

     GUI Component:  Panel, Label, TextField, Button

     Logic Programming: if-else

     Events: actionPerformed

     Features: requestFocus, Sistem.exit(0)

1.   Angka Pertama dan Angka Kedua dimasukkan oleh user

2. Tombol Tambah diklik maka akan keluar hasil pertambahan di field ketiga

3. Tombol Hapus untuk membersihkan layar

4. Setelah tombol Hapus, arahkan fokus ke TextField Angka Pertama.

Aplikasi Operasi Dua Angka

         GUI Component:  Panel, Label, TextField, Button

         Logic Programming: if-else

         Event: actionPerformed, keyTyped

         Features: pembuatan method baru

     Aplikasi Kalkulator

   Tahapan Kerja Kalkulator

    7              +        8           =     15

    operandSatu   operator   operandDua   samadengan   hasil

1.   operandSatu: tampilkan angka yg ditekan di layar
2.   operator:
1.   Ambil yang ada di layar, simpan sebagai variable operandSatu
2.   Beri tanda operator apa yg dijalankan (+, -, *, dst)
3.   operandDua: tampilkan angka yg ditekan di layar
4.   samadengan:
1.   Ambil yang ada di layar, simpan sebagai variable operandDua
2.   Buat keputusan (if or switch), operator apa yang digunakan dan proses apa yg dilakukan

      if(operator.equals(“+”)){

            layar.setText(operandSatu + operandDua);

      }else if(){ ...

     }