Creating Graphical User Interfaces [1]

with Java
By: De Rosal Ignatius Moses Setiadi

APIs for Anatomy of

GUI
The
Mathematical Java GUI Application Top-Level
Containers
Concept of GUIs

Basic
Components
Uneditable Special-
Information Purpose
Using Swing Displays Containers
Components

Interactive
Displays of Highly
Swing GUI
Components
Formatted
Information

General-Purpose
Tugas Containers

Konten
 • The Mathematical Concept of
GUIs
• GUI Concept in Java
• Using Swing Components
–JFrame
–JLabel
Abdul Kadir, Pemrograman Java 2 (Bab
28 Halaman 601)
 Layar Komputer
• Memiliki 2 koordinat
– Horisontal (sumbu x)
– Vertikal (sumbu y)
• Titik awal ada pada (x=0, y=0) pada kiri atas
layar
• Jarak diukur dalam pixel
– dengan sumbu x koordinat meningkat ke
sebelah kanan
– dan sumbu y koordinat meningkat ke bawah
Standard Algebraic Standard Computer-Screen
Coordinate System Coordinate System
 Contoh
• A window: Sumbu X increasing rightwards

Sumbu Y
– x = 150, Window
Bounds=(150,325,600,350)
325
– y = 325,
– width = 600,
– 125
height = 350 125
• Its contains a button: 100

increasing downwards
150 350

– x = 125, 300
– y = 125,
600
– width = 300,
Button
– height = 100 Bounds=(125,125,100,300)

Bounds=( x, y, width, height)

 AWT (Abstract Window Toolkit )
• Merupakan komponen GUI (java.awt) yang
pertama kali dikenalkan oleh Sun Java.
• Penggunaan komponen GUI AWT sudah tidak
direkomendasikan untuk development baru.
 Swing or JFC (Java Foundation
Class):
• Merupakan library dan komponen GUI
(javax.swing) versi baru dan
direkomendasikan untuk development GUI
programming saat ini.
• Komponen Swing components banyak
diturunkan dari AWT and lebih lengkap dari
AWT
• Basic Components
• Interactive Displays of Highly Formatted
Information
• Uneditable Information Displays
• Top-Level Containers
• General-Purpose Containers
• Special-Purpose Containers
JButton
JCheckBox
JList
JComboBox
JMenu
JRadioButton
JSpinner
JTextField
JPasswordField
JSlider
JColorChooser
JEditorPane
JTextArea
JTable
JTree
JFileChooser
JProgressBar
JLabel
JToolTip
JSeparator
JFrame
JDialog
JApplet
JPanel
JScrollPane
JSplitPane
JTabbedPane
JToolBar
JInternalFrame
JlayeredPane
Rootpane
 Internal JFrame
structure
JFrame JPanel

containers

JPanel JButton

JButton JLabel JLabel

Component
 JFrame (Top-Level Containers)
• Sebuah frame biasanya merupakan bagaian
dari “window”
• JFrame merupakan Top-Level Containers
dalam komponen swing.
• JFrame menyediakan atribut dasar dan
perilaku “window”(misalnya, title bar dan
tombol untuk minimaze, maximize dan
close).
 JFrame [Metode]
Metode JFrame yang sering digunakan:
• void setSize (int x, int y)  mengatur ukuran frame
• void setDefaultCloseOperation(int operation)  mengatur
cara menutup frame
• void setLocation(int x, int y)mengatur lokasi frame
• void setLocationRelativeTo(Component c)  mengatur lokasi
frame dari komponen tertentu
• void setResizable(boolean b)  menentukan dapat diubah
ukurunya atau tidak
• void setVisible (boolean b)  menentukan dapat dilihat atau
tidak
• void setBounds(int x, int y, int width, int height)  kombinasi
setLocation dan setSize
Contoh Kode Membuat JFrame
[dengan Metode]

Set title of Frame

Metode setDefaultCloseOperation
• EXIT_ON_CLOSE  quits the application;
• DO_NOTHING_ON_CLOSE  does nothing;
• HIDE_ON_CLOSE  makes the window
invisible but keeps it in memory for
redisplay;
• DISPOSE_ON_CLOSE  destroys the window
and frees up associated memory.
Contoh Kode Membuat JFrame
[dengan Konstruktor]
 Menambahkan Konten pada
•
JFrame
Dibutuhkan “Container” untuk menampilkan
konten dari window
– Container adalah wadah untuk komponen2 lain.
• Kelas Container terdapat dalam AWT
– Tersedia jika kita melakukan import kelas AWT
– import java.awt.*;
• Untuk membuat instan dari kelas kontiner,
gunakan:
– kata kunci “new”
– Dan metode getContentPane( )
http://docs.oracle.com/javase/1.4.2/docs/api/j
ava/awt/Container.html
Contoh Kode Menambahkan Konten
JLabel
Contoh Kode Menambahkan Konten
Jlabel [2]
Contoh Kode Menambahkan Konten
Jlabel [2]
lanjut
 JLabel
Adalah area
untuk
menampilkan
tulisan
pendek atau
gambar
Bagaimana menambahkan 2
konten?

What is the result?

Hasil MyFrame5.java

Mengapa?
 Jlabel - Constructor

ocs.oracle.com/javase/1.4.2/docs/api/javax/swing/JLabel.html
Menampilkan Teks dan Gambar dengan
JLabel
Hasil MyFrame6.java
 Tugas 1
• Buat tampilan seperti
dibawah ini:
• Clue:
– Gunakan layout atau text
alignment
 Tugas 2
• Buat tampilan seperti dibawah ini:
• Clue: Gunakan ImageIcon