DIALOG BERBASIS INTERAKSI GRAFIK

(GUI)

NAMA ANGGOTA KELOMPOK:

I WAYAN JNANA PARANTAPA 15045050
I KADEK TEO PRAYOGA KARTIKA 1504505086
KETUT WAHYU ARIPRASASMITA 1504505088

PROGRAM STUDI TEKNOLOGI INFORMASI

FAKULTAS TEKNIK
UNIVERSITAS UDAYANA
2016
KATA PENGANTAR
 DAFTAR ISI

BAB I PENDAHULUAN-------------------------------------------------------
LATAR BELAKANG----------------------------------------------------
RUMUSAN MASALAH------------------------------------------------
TUJUAN--------------------------------------------------------------------
BAB II PEMBAHASAN-----------------------------------------------------------
PENGERTIAN-------------------------------------------------------------
KOMPONEN PENJELASAN DAN CONTOH-----------------------
CONTOH APLIKASI------------------------------------------------------
PERKEMBANGAN APLIKASI-----------------------------------------
BAB III PENUTUP------------------------------------------------------------------
KESIMPULAN------------------------------------------------------------
DAFTAR PUSTAKA------------------------------------------------------
 BAB I
PENDAHULUAN

Latar Belakang
Hingga saat ini, kita selalu membuat program berupa console based
dimana interaksi dengan user selalu memakai command prompt dan menggunakan
teks. Pada kenyataan sebenarnya, jika kita ingin membuat program yang terlihat
profesional dan berkualitas, penggunaan GUI dapat dikatakan merupakan
keharusan. User pada umumnya lebih senang berinteraksi dengan GUI
dibandingkan dengan sekumpulan teks karena dengan GUI, program akan terlihat
lebih menarik dan terkesan user friendly.

Rumusan Masalah
1. Pengertian
2. Komponen dan Penjelasan beserta Contoh untuk masing- masing
komponen
3. Contoh Aplikasi
4. Perkembangan Aplikasi

Tujuan
1. Mengetahui Pengertian GUI
2. Mengetahui komponen dan penjelasan beserta contoh dari masing- masing
komponen
3. Mengetahui contoh Aplikasi
4. Mengetahui perkembangan Aplikasi
 BAB II
PEMBAHASAN

Pengertian Dialog Berbasis Interaksi Grafik

Dialog berbasis Interaksi Grafik (GUI) adalah dialog yang menggunakan
bentuk- bentuk visual, seperti grafik, ikon, dan animasi. Contoh: pada Microsoft
Word ketika kursor mendekati suatu ikon akan muncul pesan yang menunjukkan
arti ikon tersebut.

*hierarki komponen dari swing

 Istilah Penting Dalam GUI
1. Container
Adalah wadah untuk meletakkan komponen- komponen GUI
2. Komponen GUI
Seperti Button, Text, Edit, Radio Button, dan lain- lain
3. Event
Adalah Sinyal yang dibangkitkan untuk merespon aksi dari user.
Contoh: aksi dari klik mouse/ keyboard. Aksi tersebut akan ditangani oleh Event
Handler.
4. Dialog
Adalah sebuah window kecil untuk menampilkan info sederhana pada user.
5. Layout
Adalah sebuah window utama dapat terdiri dari beberapa komponen yang dapat
disesuaikan dengan layout.
6. Menu
Adalah sekumpulan perintah yang dapat dipilih user untuk menjalankan perintah
tertentu. Menu dibuat untuk memudahkan user mengetahui fasilitas yang tersedia
pada suatu program.
 Komponen penjelasan beserta contoh untuk masing- masing
komponen
A. Bagian- Bagian Swing
Terdapat 5 bagian swing yang akan sering digunakan secara umum, yaitu:
1. Top- Level Container, merupakan container dasar dimana komponen
lainnya akan diletakkan. Contoh container seperti ini, yaitu Frame, Dialog,
dan Applet yang diimplementasikan berupa class Jframe, Jdialog, dan
Japplet pada Java.
2. Intermediate Container, merupakan container perantara dimana
komponen lainnya akan diletakkan, salah satu contohnya pane yang
diimplementasikan berupa class Jpanel.
3. Atomic Component, merupakan komponen yang memiliki fungsi yang
spesifik, dimana umumnya user langsung berinteraksi dengan komponen
jenis ini. Contoh: Jbutton, Jlabel, JtextField, dan JtextArea pada Java.
4. Layout Manager, berfungsi untuk mengatur bagaimana tata letak atau
posisi komponen yang akan diletakkan, satu sama lain di dalam suatu
container. Contoh: BorderLayout, BoxLayout, FlowLayout, GridLayout,
dan GridBagLayout.
5. Event Handling, untuk menangani event yang dilakukan oleh user seperti
menakan tombol, memperbesar atau memperkecil ukuran frame dan lain-
lain.
 Top Level Container
1. JFrame
Untuk membuat Frame dalam Java, Anda dapat menggunakan class Jframe
menggunakan kedua konstruktor dibawah ini:
Jframe( )
Jframe(String title)

JUDUL FRAME

JFrame menyediakan top-level window seperti title, border, minimize, maximize,

and close buttons.
2. JDialog
JDialog tidak dibuat berdiri sendiri, melainkan dibuat bersama-sama dengan
frame sebagai parentnya. Jika frame parent-nya ditutup, maka dialog akan dihapus
dari memori. Kemunculan dialog akan membuat semua input terhadap frame
parent-nya akan terblokir sampai dialog tersebut ditutup. Berikut contoh JDialog.
 LayOut Manager
Layout manager berfungsi untuk menyusun komponen-komponen GUI di atas
container. Penggunaan layout manager memudahkan programer untuk menyusun
komponen-komponen GUI.
1. Border Layout
BorderLayout merupakan default manager untuk ContentPane. Layout ini
menempatkan komponen dengan pendekatan arah mata angin. Komponen-
komponen pada layout ini ditempatkan pada posisi north, south, west, center, east.

2. Flow Layout
FlowLayout adalah layout yang menyusun komponen dari kiri ke kanan,
selanjutnya ke baris berikutnya. Jika ukuran windows diperbesar ukuran
komponen pada FlowLayout tidak berubah.
 3. Box Layout
Layout jenis ini meletakkan komponen-komponen dalam satu baris atau satu
kolom saja.

4. Card Layout
Card Layout menampilkan container-container/panel-panel seperti tumpukan
kartu. Hanya satu container yang akan tampil untuk satu waktu.

5. Grid Layout
Grid layout merupakan layout manager berbentuk grid. Semua komponen
dalam layout ini memiliki ukuran yang sama.
 6. Grid Bag Layout
Grid bag layout adalah pengaturan layout yang dapat digunakan untuk
meletakkan komponen secara bebas. Setiap komponen dapat menempati ukuran
yang berbeda dengan komnponen lainnya.

7. Spring Layout
Ini adalah pengaturan tata letak yang sangat fleksibel, dan dapat meniru fitur-fitur
layout manager yang lain. Pada layout ini, ukuran komponen dapat berubah-ubah
secara ototmatis jika ukuran window diubah.
 Atomic Component
1. JButton
Button merupakan bentuk yang paling sederhana dan sering digunakan.
Biasanya hanya digunakan untuk menerima input dari user berupa penekanan
button tersebut. Berikut beberapa konstruktor yang dapat digunakan untuk
membuat objek Jbutton ini:
Jbutton( )
Jbutton(Icon icon)
Jbutton(String Text, Icon icon)

BUTTON

2. JCheckBox
CheckBox biasanya digunakan untuk menampilkan beberapa pilihan kepada
user. User diberikan kebebasan penuh untuk menentukan pilihannya, sehingga
user dapat saja memilih hanya salah satu saja, lebih dari satu, semua, atau bahkan
tidak memiliki satupun dari pilihan yang disediakan. Berikut beberapa konstruktor
yang dapat digunakan untuk membuat objek Jbutton ini:
JCheckBox( )
JCheckBox(Icon icon)
JCheckBox(Icon icon,boolean selected)
JCheckBox(String text)
JCheckBox(String text,Boolean selected)

CHECKBOX
 3. JRadioButton
RadioButton berfungsi untuk menyediakan pilihan kepada user, namun user
dibatasi hanya boleh memilih maksimum satu saja dari pilihan yang disediakan.
Karena sifatnya ini, maka biasanya sejumlah radio button dikelompokkan dalam
satu grup tertentu dan dalam grup tersebut hanya satu saja yang boleh dipilih.
Untuk keperluan ini, java menyediakan sebuah class yang dapat digunakan untuk
mengelompokkan sejumlah radiobutton sesuai keinginan, yaitu class
ButtonGroup.

RADIOBUTTON

4. JLabel
Merupakan komponen GUI sederhana yang umumnya hanya digunakan untuk
menampilkan teks atau gambar statis.

LABEL
 5. JTextField
TextField diimplementasikan berupa class JTextField, berfungsi untuk
menampilkan input maupun output dari perintah user. Berikut beberapa
konstruktor yang dapat digunakan untuk membuat objek ini:
JTextField( )
JTextField(int columns )

TEXTFIELD

6. JPasswordField
Password Field diimplementasikan berupa class JPasswordField dimana class
ini sendiri merupakan turunan dari class JTextField sehingga cara penggunaannya
sama. Yang membedakan hanyalah teks yang ditampilkannya bukan berupa teks
yang diketik oleh user melainkan teks yang berupa karakter tertentu, yang
memang sengaja digunakan agar orang lain tidak tahu apa yang sedang diketikkan
oleh user.

PASSWORDFIELD
 7. JTextArea
TextArea ini pada dasarnya sama dengan TextField namun dengan beberapa
kelebihan yang tidak dimiliki oleh TextField, seperti mampu menampilkan teks
lebih dari satu baris dan fungsi wrapping(pindah baris secara otomatis jika teks
yang ditampilkan tidak mencukupi untuk ditampilkan dalam satu baris).

TEXTAREA

8. JComboBox
Pada dasarnya combo box digunakan untuk menampilkan sekumpulan daftar
pilihan yang dapat dipilih oleh user, dimana dalam kondisi normal hanya pilihan
yang sedang aktif saja yang ditampilkan. Jika combo box diklik barulah daftar
menu pilihan yang lebih lengkap ditampilkan agar user dapat memilihnya.

COMBO BOX
 9. JList
List Box juga digunakan untuk menampilkan sekumpulan daftar pilihan yang
dapat dipilih. Berbeda dengan combo box yang hanya akan menampilkan daftar
pilihannya jika user mengklik komponen tersebut, list box selalu menampilkan
daftar pilihannya.

LIST
 Event Handler
Event adalah peristiwa atau kejadian yang dibangkitkan atau distimulasi oleh
pengguna terhadap GUI. Untuk mendeteksi dan menangani apa yang dilakukan
oleh pengguna terhadap GUI, diperlukan suatu mekanisme yang disebut Event
Handling. Mekanisme event handling pada bahasa Java ditangani oleh event
handling component, yang terbagi menjadi dua bagian, yaitu event listener dan
event handler.
Event Listener adalah kelas yang mengimplemetasi interface Listener.
Beberapa event listener yang sering digunakan adalah:
1. ActionListener : listener yang bereaksi jika terjadi event pada mouse atau
keyboard.
2. MouseListener: listener yang bereaksi atas event yang terjadi pada mouse.
3. MouseMotionListener: menyediakan beberapa method untuk memantau
perubahan mouse seperti drag atau perpindahan mouse.
4. WindowListener: listener yang bereaksi atas event yang terjadi pada window.
 BAB III
PENUTUP

Kesimpulan
 DAFTAR PUSTAKA

https://translate.google.co.id/translate?hl=id&sl=en&u=https://en.wikipedia.org/w
iki/Graphical_user_interface&prev=search
https://ilkomitt.files.wordpress.com/2012/05/gui.pdf
http://staff.uny.ac.id/sites/default/files/Labsheet_Pemrog2_06.pdf