15.
GUI (GRAPHICAL
USER INTERFACE)
Oleh : Lely Panca Andriyanto
GUI
Pengertian Graphical User Interface (GUI) ?
“Graphical User Interface (GUI) adalah antarmuka pengguna yang memungkinkan
interaksi dengan perangkat lunak melalui elemen grafis seperti tombol, teks,
gambar, dan menu”
GUI
1. Framework GUI di Java:
• AWT (Abstract Window Toolkit)
• Swing
• JavaFX
GUI
1. AWT (Abstract Window Toolkit)
“AWT adalah toolkit GUI asli Java sebelum Swing diperkenalkan. AWT
lebih sederhana dan menggunakan sumber daya sistem asli untuk
komponen GUI”
Contoh Komponen AWT :
o Frame : Window utama aplikasi.
o Panel : Container untuk mengatur komponen lain.
o Button : Tombol.
o Label : Label teks.
o TextField : Field teks untuk input pengguna.
o TextArea : Area teks.
o List : Daftar item.
GUI
Tampilan AWT (Abstract Window Toolkit)
GUI
2. Swing
“Swing adalah salah satu toolkit GUI paling populer di Java yang merupakan bagian
dari Java Foundation Classes (JFC)”
Contoh Komponen Swing :
• JFrame : Window utama aplikasi.
• JPanel : Container untuk mengatur komponen lain.
• JButton : Tombol.
• JLabel : Label teks.
• JTextField: Field teks untuk input pengguna.
• JTextArea : Area teks.
• JTable: Tabel untuk menampilkan data dalam format grid.
• JList : Daftar item.
GUI
Tampilan Swing
GUI
• JavaFX
JavaFX adalah framework untuk membangun aplikasi GUI modern di Java. Dibuat
untuk menggantikan Swing, JavaFX menawarkan desain yang lebih fleksibel,
dukungan multimedia, animasi, dan gaya kustom melalui CSS.
Contoh Komponen JavaFX:
•Stage: Window utama aplikasi.
•Scene: Container untuk mengatur semua komponen lain.
•Button: Tombol.
•Label: Label teks.
•TextField: Field teks untuk input pengguna.
•TextArea: Area teks.
•TableView: Tabel untuk menampilkan data.
•ListView: Daftar item.
•WebView: Komponen untuk menampilkan konten web.
GUI
Tampilan JavaFX
GUI
2. Container dan Component GUI
container
component GUI
GUI
Kontainer (Containers)
Kontainer adalah komponen yang dapat menampung komponen lain dan
mengatur tata letaknya. Berikut adalah beberapa contoh kontainer Swing:
o JFrame: Jendela utama dalam aplikasi Swing.
o JPanel : Panel untuk menampung komponen lain.
o JDialog : Jendela dialog yang digunakan untuk interaksi sementara dengan
pengguna.
o JScrollPane : Kontainer yang menambahkan kemampuan scroll ke komponen
lain.
o JTabbedPane : Kontainer dengan tab yang memungkinkan navigasi di antara
beberapa panel.
o JSplitPane : Kontainer yang membagi ruang antara dua komponen.
GUI
• Komponen (Components)
Komponen adalah elemen dasar dari GUI. Berikut adalah beberapa contoh komponen
Swing:
▪ JButton: Tombol yang dapat diklik.
▪ JLabel: Label untuk menampilkan teks atau gambar.
▪ JTextField: Field teks untuk input teks satu baris.
▪ JTextArea: Area teks untuk input teks multi-baris.
▪ JCheckBox: Kotak centang yang dapat dipilih atau tidak dipilih.
▪ JRadioButton: Tombol radio yang biasanya digunakan dalam grup untuk
memilih satu dari beberapa opsi.
▪ JComboBox: Kotak kombinasian yang memungkinkan pengguna memilih satu
dari beberapa opsi.
▪ JList: Daftar item.
▪ JTable: Tabel untuk menampilkan data dalam bentuk grid.
GUI
• Komponen (Components)
GUI
package latihan_gui; //5. Membuat Tombol
• Contoh JButton btn_submit=new JButton("Submit");
import [Link]; btn_submit.setBounds(160, 180, 100, 30);
program GUI [Link](btn_submit);
import [Link];
import [Link].*;
Lanjut //6. MEMBUAT FUNGSI TOMBOL
public class Main { btn_submit.addActionListener(new ActionListener(){
public static void main(String[] args) { @Override
//1. Buat Frame public void actionPerformed(ActionEvent e){
JFrame frame1=new JFrame("Aplikasi Pertama Saya"); String nama=txt_nama.getText();
[Link](500, 500);
[Link](JFrame.EXIT_ON_CLOSE);
[Link](null); if([Link]()){
[Link](frame1, "Tidak
//2. Menambahkan Label Boleh Kosong");
JLabel lbl_nama=new JLabel("Masukan nama Anda : "); }else{
lbl_nama.setBounds(20, 20, 150, 20); [Link]("Perkenalkan nama Saya "+nama);
[Link](lbl_nama); }
//3. membuat text Field }
JTextField txt_nama=new JTextField();
txt_nama.setBounds(160, 20, 200, 20);
[Link](txt_nama); });
//4. membuat Text Area
JTextArea txtArea=new JTextArea(); //Menampilkan Frame
[Link](160, 60, 200, 100); [Link](true);
[Link](false);
[Link](txtArea); }
}
GUI
• Hasilnya :
