Modul 5

Java GUI

TIM PENYUSUN

Nama Kode Asisten

Afina Ramadhani NOY
Annisa Syafarani Callista CAL
Arsike Cipta Pelangi ARS
Bima Susila Mukti BIM
Desita Nur R. DST
Diva Jihan Safira DIV
Hamdan Dzikrurobbi DZI
I Komang Gede Andhi Kurniawan AND
Idellia Muthia Nurbaisa IDL
Ivan Priyambudi IVN
M. Arrasyid R. RDZ
M. Ikhsan Pratama P. ISP
M. Rifqi Rusandi RFR
Mukhammad Furqon WGS
Nafidzah Kiasati Shadrina NFZ
Rizky Azis Jayasutisna SKY
Sherly Fratista SHE
Syfa Nur Lathifah SYF
Wiguna Ramadhan WRZ

Object Oriented Programming 1

 Modul 5
Java GUI

DAFTAR ISI

TUJUAN PRAKTIKUM ........................................................................................................ 3

1. Landasan Teori ............................................................................................................ 3
2. Komponen-komponen Swing ............................................................................... 4
2.1 JFrame .................................................................................................................... 4
2.2 JPanel ..................................................................................................................... 5
2.3 JLabel ...................................................................................................................... 5
2.4 JTextField, JPasswordField, dan JTextArea ................................................ 6
2.5 JButton ................................................................................................................... 7
2.6 JCheckBox ............................................................................................................. 8
2.7 JRadioButton ..................................................................................................... 10
2.8 JComboBox ........................................................................................................ 11
2.9 JMenuBar ............................................................................................................ 12
3. Layout Manager........................................................................................................ 13
3.1 Flow Layout ........................................................................................................ 13
3.2 Border Layout .................................................................................................... 14
3.3 Grid Layout ......................................................................................................... 16
4. Event Handling .......................................................................................................... 18
5. JOptionPane ............................................................................................................... 19
CONTOH SOAL .................................................................................................................. 21
LATIHAN SOAL .................................................................................................................. 25
DAFTAR PUSTAKA ............................................................................................................ 27

Object Oriented Programming 2

 Modul 5
Java GUI

MODUL 5
Java Swing (GUI)

TUJUAN PRAKTIKUM

1. Praktikan mampu memahami konsep GUI

2. Praktikan mampu memahami komponen-komponen dan mampu

membuat aplikasi GUI menggunakan Library Swing

3. Praktikan mampu memahami konsep dan menerapkan Action

Listener

4. Praktikan mampu mengimplementasikan GUI serta Event Action

yang ada pada Java

1. Landasan Teori

Graphical User Interface (GUI) merupakan antar muka grafis

yang memfasilitasi interaksi antara pengguna dengan program

aplikasi. Pengguna berinteraksi dengan berbagai elemen grafis,

seperti button, dialog box, menu bar, field dan lain-lain.

Salah satu komponen dalam bahasa pemrograman Java

untuk membangun GUI adalah Swing. Komponen tersebut

diturunkan dari Abstract Windowing Toolkit (AWT) dalam paket

java.awt. Hirarki dari komponen Swing adalah sebagai berikut :

Object Oriented Programming 3

 Modul 5
Java GUI

2. Komponen-komponen Swing

2.1 JFrame
JFrame adalah sebuah fungsi yang sering digunakan
dalam pemakaian GUI. JFrame adalah tempat untuk

menampung fitur-fitur yang akan diletakkan. Size (width-

height) pada JFrame dapat diatur sesuai kebutuhan.

Object Oriented Programming 4

 Modul 5
Java GUI

2.2 JPanel
JPanel merupakan komponen untuk membuat
panel, dimana panel berfungsi sebagai container bagi

komponen java lainnya, seperti : label, button, textfield,

table, dan komponen lainnya

Berikut ini adalah contoh penggunaan JPanel :

2.3 JLabel
Label berfungsi untuk menampilkan suatu teks di GUI.

JLabel adalah komponen grafis yang menampilkan teks-

teks yang bersifat read-only.

Berikut adalah contoh penggunaan JLabel :

Object Oriented Programming 5

 Modul 5
Java GUI

2.4 JTextField, JPasswordField, dan JTextArea

JTextField dan JPasswordField adalah fungsi area yang

digunakan untuk menampilkan, mengedit, atau

menuliskan teks. Perbedaan diantara ketiganya adalah

JTextField menampilkan text yang terbatas, JTextArea

memuat text yang lebih panjang (paragraf),

JPasswordField penampilan text dengan format

asterisk(*). Berikut adalah contoh penggunaannya:

Object Oriented Programming 6

 Modul 5
Java GUI

2.5 JButton
JButton adalah komponen untuk menampilkan
tampilan grafis berupa tombol dan memiliki fungsi

sebagai command button. Command Button

mengaktifkan ActionEvent ketika diklik. Command button

diturunkan dari kelas AbstractButton dan dibuat bersama

dengan kelas JButton. Berikut adalah contoh

penggunaannya :

Object Oriented Programming 7

 Modul 5
Java GUI

2.6 JCheckBox
JCheckBox yaitu komponen grafis yang mempunyai
dua macam keadaan atau nilai (value) yaitu on/off atau

selected/deselected.
Selain JCheckBox, komponen lain yang juga

mempunyai dua macam keadaan atau nilai adalah

JRadioButton. Anda dapat berpindah (toggle) dari satu

keadaan ke keadaan yang lain dengan cara mengklik

untuk memberi tanda centang (selected) atau

menghilangkan tanda centang (deselected) di checkbox.

Method getStateChange pada kelas ItemEvent

mengembalikan nilai integer ItemEvent.Selected atau

ItemEvent.Deselected.

Object Oriented Programming 8

 Modul 5
Java GUI

Berikut adalah contoh JCheckBox:

Object Oriented Programming 9

 Modul 5
Java GUI

2.7 JRadioButton
JRadioButton adalah sebuah class yang digunakan
untuk membuat objek RadioButton. Objek Radio Button

digunakan untuk memilih hanya satu pilihan dari

beberapa pilihan.

JRadioButton memiliki dua status yaitu selected dan

deselected. Pada umumnya radio button ditampilkan

dalam sebuah grup yaitu ButtonGroup. Hanya satu radio

button di dalam suatu group yang dapat dipilih pada satu

waktu. Pemilihan satu button menyebabkan button lain

berstatus off.

Berikut adalah contoh Penggunaan JRadioButton

Object Oriented Programming 10

 Modul 5
Java GUI

2.8 JComboBox
JComboBox merupakan komponen yang berfungsi
untuk menampilkan daftar suatu item.

Setiap item di JComboBox diberi indeks numerik array.

Elemen pertama diberi indeks 0 dan elemen tersebut

dimunculkan sebagai item yang dipilih pada saat instance

JComboBox tampil untuk pertama kalinya.

Method penting JComboBox adalah sebagai berikut:

1. getSelectedIndex() mengembalikan indeks dari

item yang sedang dipilih

2. setMaximumRowCount(n) menentukan jumlah

maksimum elemen yang ditampilkan ketika

pengguna mengklik instance JComboBox. ScrollBar

secara otomatis dihasilkan.

Contoh Penggunaan:

Object Oriented Programming 11

 Modul 5
Java GUI

2.9 JMenuBar

JMenuBar digunakan untuk menampilkan menubar di

jendela atau bingkai (frame). JMenu adalah komponen

menu pull down yang ditampilkan di menubar. Objek

menu dipasang pada objek kelas yang memiliki method

setJMenuBar. JMenuBar juga memiliki ActionEvent

sehingga dapat dioperasikan.

Berikut adalah contoh penggunaan JMenuBar :

Object Oriented Programming 12

 Modul 5
Java GUI

3. Layout Manager

Layout Manager berfungsi untuk menyusun komponen-

komponen GUI diatas container. Penggunaan Layout Manager

memudahkan programmer untuk menyusun komponen-komponen

GUI dibandingkan dengan menentukan ukuran dan posisi setiap

komponen, sehingga para programmer akan lebih berkonsentrasi

terhadap urusan “look and feel” saja. Tipe-tipe layout dapat berupa
FlowLayout, BorderLayout, GridLayout.

3.1 Flow Layout

Flow Layout adalah layout yang menyusun komponen dari

kiri ke kanan, lalu ke baris berikutnya. Jika ukuran windows

diperbesar ukuran komponen pada FlowLayout tidak berubah.

Method-method penting dari FlowLayout adalah :

a. setAlignment(position_CONSTANT) adalah method

untuk menentukan posisi layout. Nilai

positition_CONSTANT dapat berupa FlowLayout.LEFT,

FlowLayout.CENTER, atau FlowLayout.RIGHT yang

masing-masing mengatur posisi rata kiri, rata tengah, atau

rata kanan.

Object Oriented Programming 13

 Modul 5
Java GUI

b. layoutContainer(Container) method untuk melakukan

update container.

Contoh Penggunaan :

3.2 Border Layout

Border Layout merupakan default manager untuk

ContentPane. Layout ini menempatkan komponen dengan

Object Oriented Programming 14

 Modul 5
Java GUI

pendekatan arah mata angin. Komponen-komponen pada layout

ini ditempatkan pada posisi north, south, west, center, east.

Komponen-komponen dapat diletakkan pada :

a. North/South komponen diregion ini dapat diperluas

secara horizontal

b. East/West komponen diregion ini dapat diperluas secara

vertical

c. Center komponen diregion ini dapat diperluas secara

vertical dan horizontal

Method-method penting yang dapat digunakan pada

BorderLayout adalah :

a. Konstruktor BorderLayout(hGap,vGap) argumen hGap

adalah ukuran gap horizontal antar region. Argumen vGap

adalah ukuran gap vertikal antar region. Nilai defaultnya

adalah 0 baik untuk vertikal maupun horizontal

b. myContainer.add(component,position) menambahkan

komponen ke layout. Argumen component menunjukkan

komponen yang ditambahkan ke layout, sedangkan

argumen position menunjukkan posisi peletakkan

komponen, sebagai contoh BorderLayout.NORTH,
BorderLayout.SOUTH, BorderLayout.EAST,
BorderLayout.WEST atau BorderLayout.CENTER

Object Oriented Programming 15

 Modul 5
Java GUI

Contoh Penggunaan :

3.3 Grid Layout

Grid Layout membagi Container kedalam suatu grid.

Komponen diletakkan dalam suatu baris dan kolom dan memiliki

ukuran lebar dan tinggi yang sama. Komponen-komponen

ditambahkan mulai dari kiri atas, selanjutnya ke kanan. Jika baris

sudah penuh, maka komponen diletakkan dibaris selanjutnya,

kemudian dari kiri ke kanan.

Object Oriented Programming 16

 Modul 5
Java GUI

Konstruktor GridLayout adalah sebagai berikut :

a. GridLayout (rows, columns, hGap, vGap) konstruktor ini

mendefinisikan jumlah baris, kolom, dan ukuran gap

horizontal/vertical antar elemen pixel

b. GridLayout (rows, columns) sama halnya dengan

konstruktor pertama, namun dengan nilai default hGap dan

vGap sama dengan 0

Contoh Penggunaan :

Object Oriented Programming 17

 Modul 5
Java GUI

4. Event Handling

Event merupakan sebuah respon yang memicu sebuah

komponen untuk melakukan sebuah method yang telah ditentukan

sebelumnya. Event menyatakan perubahan keadaan dari suatu objek.

Misalnya kita ingin membuat sebuah button yang jika diklik akan

memunculkan komponen lain, maka bisa dilakukan dengan

menggunakan event.

Object Oriented Programming 18

 Modul 5
Java GUI

5. JOptionPane

JOptionPane merupakan komponen GUI yang dapat memunculkan

jendela dialog. Jendela dialog bisa saja menampilkan pesan error,

menampilkan message, menampilkan konfirmasi, dan lain-lain.

Pada JOptionPane terdapat 4 fungsi yang sering kali digunakan,

yaitu :

showConfirmDialog() Berfungsi untuk menampilkan

dialog konfirmasi

showInputDialog() Berfungsi untuk menampilkan

dialog input

showMessageDialog() Berfungsi untuk menampilkan

dialog pesan/informasi

showOptionDialog() Befungsi untuk menampilkan

dialog pilihan

Object Oriented Programming 19

 Modul 5
Java GUI

Object Oriented Programming 20

 Modul 5
Java GUI

CONTOH SOAL

Buatlah sebuah program untuk menentukan tingkat gizi seseorang

berdasarkan tinggi dan berat badan, yang memiliki tampilan :

Ketika diinput sesuai dengan ketentuan, maka tampilan outputnya

adalah sebagai berikut :

Object Oriented Programming 21

 Modul 5
Java GUI

Dan apabila diinput tidak sesuai dengan ketentuan, maka output

program adalah sebagai berikut :

Object Oriented Programming 22

 Modul 5
Java GUI

Berikut adalah source code latihan soal :

Object Oriented Programming 23

 Modul 5
Java GUI

Object Oriented Programming 24

 Modul 5
Java GUI

LATIHAN SOAL

Buatlah sebuah program menggunakan java GUI yang berguna

untuk menghitung suhu celcius ke reamur,fahrenheit dan kelvin dan ketika

di run akan tampil seperti berikut

Dan ketika diisi dengan nilai celcius kemudian di convert akan

tampil seperti berikut

Object Oriented Programming 25

 Modul 5
Java GUI

Fahrenheit = celcius *1.8 + 32

Reamur=celcius*0.8

Kelvin=celcius+273

Object Oriented Programming 26

 Modul 5
Java GUI

DAFTAR PUSTAKA

Laboratory, E. (2018). Modul Praktikum. Modul 6 Java GUI. Bandung.

Wu, C. T. (2010). An Introduction to Object Oriented Programming with Java, 5th Edition.

Object Oriented Programming 27