P – 5
Bab 4 : GUI (Graphical User Interface)
4.1 Tujuan
Mahasiswa mampu :
•
Mengetahui pemrograman GUI dengan Java
•
Mengetahui dan memahami berbagai GUI dalam pemrograman java.
•
Mengetahui dan memahami pemrograman GUI dengan IDE NetBeans.
4.2 Materi
Komponen GUI dalam pemrograman java :
1. Frame
2. Label
3. Text Field
4. Radio Button
5. Combo Box
6. Check Box
7. Button
4.3 Review OOP
Class
: Mobil
4.4 GUI
•
Merupakan aplikasi dalam pemrograman Java yang berbasis grafis. Dalam pemrograman
Java terdapat dua kelas yang berperan dalam GUI, antara lain :
1.
Abstract Windowing Toolkit (AWT) → Di dalam paket : “java.awt”.
2.
Swing → Di dalam paket : “javax.swing”.
•
Package swing merupakan perkembangan dari package awt di pemrograman Java
sebelumnya.
Java Architecture
Sumber : http://www.write-technical.com/126581/session1/lecture1/archi_packages.gif
4.5 AWT
•
Komponen AWT dalam pemrograman Java antara lain seperti :
◦
Frame
◦
Font & Graphics
◦
Image
◦
Button
Frame
•
Class Frame merupakan class yang darinya dapat diturunkan sebuah frame (window).
•
Di atas window ini dapat dilakukan berbagai pekerjaan grafis seperti membuat garis,
kotak, lingkaran, elips, poligon, menulis teks atau menempatkan komponen antar
muka grafis seperti button, check box, radio button dan lain-lain.
•
Contoh :
Contoh Frame 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 /* * ContohFrame.java* author : SidiQ - UMBY --- */ import java.awt.*;
public class ContohFrame extends Frame {
public static void main(String args[]) {
Frame f = new Frame(); f.resize(250,150); // x,y f.show();
} }
Output :
•
Windows tersebut belum dapat ditutup dengan mengklik mouse pada tanda x dipojok
layar.
◦
Agar windows tersebut dapat ditutup dengan Ctrl-Alt-Del diakhiri dengan
EndTask.
◦
Agar suatu window dapat ditutup dengan normal (dengan mengklik x dipojok
kanan atas), perlu didefinisikan suatu method handleEvent() dari windows
sebagai berikut :
public boolean handleEvent(Event evt) {
if (evt.id == Event.WINDOW_DESTROY) System.exit(0); return false;
Font & Graphics
•
Kelas Font memungkinkan kita mengatur jenis huruf, ukuran huruf, model huruf
(tebal,italic dan lain-lain).
•
Contoh :
setFont(new Font("Calibri", Font.BOLD, 14)
Keterangan :
◦
Font
: Calibri
◦
Size
: 14 point - Bold (huruf normal 12 point)
•
Kelas Graphics merupakan class yang memungkinkan kita untuk menulis teks,
menggambar garis, kotak lingkaran dan lain-lain. Beberapa method dalam class
Graphics antara lain :
drawString(String s, x,y) //membuat string dikoordinat x,y drawLine(x1,y1,x2,y2) //membuat garis
drawRect(x1,y1,x2,y2) //membuat kotak fillRect(x1,y1,x2,y2) //mengisi kotak
drawOval(x1,y1,width,height) //membuat lingkaran atau oval drawRoundRect(x1,y1,x2,y2) //membuat kotak pojoknya bulat fillRoundRect(x1,y1,x2,y2) //mengisi kotak
drawPolygon(x1,y1,x2,y2) //mencetak poligon drawArc(x,y,widht,height,startangle,stopangle)
•
Untuk menuliskan suatu string di windows pada posisi kolom x dan baris y.
◦
Koordinat layar windows adalah : 0,0 berada pada pojok kiri atas;
◦
x=jumlah point kearah kanan dan
◦
y=jumlah point kearah bawah (vertikal),
seperti pada gambar berikut.
•
Untuk drawOval apabila widht dan height sama akan menghasilkan lingkaran dan
apabila tidak sama akan menghasilkan bentuk oval.
Contoh Font 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 /* * ContohFont.java
* author : SidiQ - UMBY --- */ import java.awt.*;
public class ContohFont extends Frame {
public ContohFont() {
setTitle("Contoh Font");//judul windows }
public void paint(Graphics g) {
g.drawRect(20,40,200,60);
g.drawString("Welcome To",30,60);
g.setFont(new Font("Calibri", Font.BOLD, 14)); g.drawString("Univ.Mercu Buana Yogyakarta ",30,80); }
public boolean handleEvent(Event evt) {
if (evt.id == Event.WINDOW_DESTROY) System.exit(0);
return false; }
public static void main(String args[]) {
Frame f = new ContohFont(); f.resize(300,150); f.show(); } }
Output :
Image
data Image dalam berbagai format, seperti GIF, PNG, BMP dan lain-lain.
•
Beberapa method yang penting yang berhubungan dengan class Image antara lain :
Toolkit.getDefaultToolkit().getImage(nmFILE)
•
Keterangan :
◦
nmFile → Yaitu untuk mengambil gambar yang tersimpan dalam file nmFILE.
◦
Dalam nmFILE termuat lengkap dengan nama directori dan subdirectory, kecuali
file gambar kita ada pada directory yang sama dengan file program.
drawImage(objekgambar,x,y,skalaX,skalaY,pengamatGambar);
Keterangan :
◦
Parameter pertama objekgambar adalah nama objek gambar yang telah diambil
dari file ke memory dengan method getImage().
◦
Parameter kedua dan ketiga :x,y adalah koordinat pojok kiri atas dari peletakan
gambar pada windows.
◦
Paramater kempat dan kelima adalah sekala horisontal dan vertikal dalam satuan
point dari gambar.
•
Contoh :
Contoh Image 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 /* * ContohImage.java* author : SidiQ - UMBY --- */ import java.awt.*;
import java.awt.Image.*;
public class ContohImage extends Frame {
String nmFILE="UMBY.PNG";
Image gb=Toolkit.getDefaultToolkit().getImage(nmFILE); public void paint(Graphics g)
{ setTitle("Contoh Image"); g.setColor(Color.magenta); g.drawString("Welcome !",85,180); g.drawImage(gb,60,50,this); }
public boolean handleEvent(Event evt) {
if (evt.id == Event.WINDOW_DESTROY) System.exit(0); return false;
25 26 27 28 29 30 31 32 33 }
public static void main(String args[]) {
Frame f = new ContohImage(); f.resize(240,200); f.show(); } }
Output :
Button
•
Contoh :
Contoh Button 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 /* * ContohImage.java* author : SidiQ - UMBY --- */ import java.awt.*;
public class ContohButton extends Frame { public ContohButton() { setTitle("Contoh Button"); setLayout(new FlowLayout()); add(new Button("Yellow")); add(new Button("Blue")); add(new Button("Orange")); add(new Button("Cyan")); add(new Button("Pink")); add(new Button("Red")); add(new Button("White")); }
21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56
public boolean handleEvent(Event evt) {
if (evt.id == Event.WINDOW_DESTROY) System.exit(0); return super.handleEvent(evt);
}
public boolean action(Event evt, Object arg) { if (arg.equals("Yellow")) setBackground(Color.yellow); else if (arg.equals("Blue")) setBackground(Color.blue); else if (arg.equals("Orange")) setBackground(Color.orange); else if (arg.equals("Cyan")) setBackground(Color.cyan); else if (arg.equals("Pink")) setBackground(Color.pink); else if (arg.equals("Red")) setBackground(Color.red); else if (arg.equals("White")) setBackground(Color.white); else return false;
repaint(); return true; }
public static void main(String[] args) {
Frame f = new ContohButton(); f.resize(320, 150);
f.show(); }
}
4.7 SWING
•
Komponen SWING dalam pemrograman Java antara lain seperti :
1. Frame
2. Label
3. Text Field
4. Radio Button
5. Combo Box
6. Check Box
7. Button
Frame
•
Frame merupakan tempat/bingkai untuk komponen lain ditempatkan.
•
Komponen di dalam Java yang digunakan untuk membuat Frame adalah JFrame.
•
Contoh Program :
Contoh Frame 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 /* * ContohFrame.java* author : SidiQ - UMBY
--- */ import javax.swing.*;
class ContohFrame extends JFrame // pewarisan {
ContohFrame() {
setTitle("Frame"); //judul di frame setLocation(300,100); //x,y
setSize(250,100); //panjang,lebar //mengaktifkan button close di frame
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); setVisible(true); //menampilkan frame
}
public static void main(String[]args) {
ContohFrame sq=new ContohFrame(); //object baru }
}
Label
•
Label merupakan komponen yang digunakan untuk membuat tulisan di frame.
•
Komponen di dalam Java yang digunakan untuk membuat Label adalah JLabel.
•
Contoh Program :
Contoh Label 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 /* * ContohLabel.java* author : SidiQ - UMBY
--- */ import javax.swing.*;
class ContohLabel extends JFrame // pewarisan {
//membuat object labelContoh
JLabel labelContoh=new JLabel("Label"); ContohLabel()
{
setTitle("Label"); //judul di frame setLocation(300,100); //x,y
setSize(250,100); //panjang,lebar //mengaktifkan button close di frame
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); }
void GUI() {
//mengatur letak komponen, null=koordinat manual getContentPane().setLayout(null);
// meletakkan object labelContoh di Frame getContentPane().add(labelContoh); // x,y,lebar,tinggi
labelContoh.setBounds(10,10,80,20); setVisible(true); //menampilkan frame }
public static void main(String[]args) {
ContohLabel sq=new ContohLabel(); //object baru sq.GUI(); // memanggil method GUI
} }
Text Field
•
Text Field merupakan komponen yang digunakan untuk memberikan input terhadap
program dalam bentuk teks (String).
•
Komponen di dalam Java yang digunakan untuk membuat Text Field adalah JTextField.
•
Contoh program :
Contoh TextField 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 /* * ContohTextField.java * author : SidiQ - UMBY--- */ import javax.swing.*;
class ContohTextField extends JFrame // pewarisan {
//membuat object textContoh, 35=lebar JTextField textContoh=new JTextField(35); ContohTextField()
{
setTitle("Text Field"); //judul di frame setLocation(300,100); //x,y
setSize(240,120); //panjang,lebar //mengaktifkan button close di frame
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); }
void GUI() {
//mengatur letak komponen, null=koordinat manual getContentPane().setLayout(null);
// meletakkan object textContoh di Frame getContentPane().add(textContoh); // x,y,lebar,tinggi
textContoh.setBounds(10,10,150,20); setVisible(true); //menampilkan frame }
public static void main(String[]args) {
//object baru
ContohTextField sq=new ContohTextField(); sq.GUI(); // memanggil method GUI
} }
Radio Button
•
Radio Button merupakan komponen yang digunakan untuk memberikan input
terhadap program dalam bentuk pilihan.
•
Komponen di dalam Java yang digunakan untuk membuat Radio Button adalah
JRadioButton.
•
Contoh program :
Contoh Radio Button 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 39 40 41 42 43 44 45 46 /* * ContohRadioButton.java * author : SidiQ - UMBY
--- */ import javax.swing.*;
class ContohRadioButton extends JFrame // pewarisan {
//membuat object radioContoh1
JRadioButton radioContoh1=new JRadioButton("Radio 1"); JRadioButton radioContoh2=new JRadioButton("Radio 2"); //menyatukan object
ButtonGroup groupContoh=new ButtonGroup(); ContohRadioButton()
{
setTitle("Radio Button"); //judul di frame setLocation(300,100); //x,y
setSize(240,120); //panjang,lebar //mengaktifkan button close di frame
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); }
void GUI() {
//mengatur letak komponen, null = koordinat manual getContentPane().setLayout(null);
// meletakkan object radioContoh1 di Frame getContentPane().add(radioContoh1); //x,y,lebar,tinggi
radioContoh1.setBounds(10,10,80,20); getContentPane().add(radioContoh2); radioContoh2.setBounds(10,30,80,20);
groupContoh.add(radioContoh1); //menyatukan object groupContoh.add(radioContoh2);
setVisible(true); //menampilkan frame }
public static void main(String[]args) {
//object baru
ContohRadioButton sq=new ContohRadioButton(); sq.GUI(); // memanggil method GUI
} }
Output :
Combo Box
•
Combo Box merupakan komponen yang digunakan untuk memberikan input terhadap
program dalam bentuk pilihan.
•
Komponen di dalam Java yang digunakan untuk membuat Combo Box adalah
JComboBox.
•
Contoh program :
Contoh Combo Box 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 /* * ContohComboBox.java * author : SidiQ - UMBY
--- */ import javax.swing.*;
class ContohComboBox extends JFrame // pewarisan {
//membuat object comboContoh
String[] Contoh={"ComboBox1","ComboBox2","ComboBox3"}; JComboBox comboContoh=new JComboBox(Contoh);
ContohComboBox() {
setTitle("Combo Box"); //judul di frame setLocation(300,100); //x,y
setSize(240,120); //panjang,lebar //mengaktifkan button close di frame
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); setVisible(true); //menampilkan frame
}
void GUI() {
//mengatur letak komponen, null = koordinat manual getContentPane().setLayout(null);
// meletakkan object comboContoh di Frame getContentPane().add(comboContoh); //x,y,lebar,tinggi
31 32 33 34 35 36 37 39 40 41 42
setVisible(true); //menampilkan frame }
public static void main(String[]args) {
//object baru
ContohComboBox sq=new ContohComboBox(); sq.GUI(); // memanggil method GUI
} }
Output :
Check Box
•
Check Box merupakan komponen yang digunakan untuk memberikan input terhadap
program dalam bentuk pilihan check.
•
Komponen di dalam Java yang digunakan untuk membuat Check Box adalah
JCheckBox.
•
Contoh program :
Contoh Check Box 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 /* * ContohCheckBox.java * author : SidiQ - UMBY
--- */ import javax.swing.*;
class ContohCheckBox extends JFrame // pewarisan {
//membuat object checkContoh
JCheckBox checkContoh1=new JCheckBox("CheckBox 1"); JCheckBox checkContoh2=new JCheckBox("CheckBox 2"); //menyatukan object
ButtonGroup groupContoh=new ButtonGroup(); JPanel panel1= new JPanel();
ContohCheckBox() {
setTitle("Check Box"); //judul di frame setLocation(300,100); //x,y
20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 39 40 41 42 43 44 45 46 47 48 setSize(240,120); //panjang,lebar //mengaktifkan button close di frame
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); }
void GUI() {
//mengatur letak komponen, null = koordinat manual getContentPane().setLayout(null);
// meletakkan object checkContoh1 di Frame getContentPane().add(checkContoh1); //x,y,lebar,tinggi
checkContoh1.setBounds(10,10,120,20); getContentPane().add(checkContoh2); checkContoh2.setBounds(10,40,120,20);
groupContoh.add(checkContoh1); //menyatukan object groupContoh.add(checkContoh2);
setVisible(true); //menampilkan frame }
public static void main(String[]args) {
//object baru
ContohCheckBox sq=new ContohCheckBox(); sq.GUI(); // memanggil method GUI
} }
Output :
Button
•
Button merupakan komponen berbentuk tombol yang digunakan untuk melakukan
eksekusi terhadap program.
•
Komponen di dalam Java yang digunakan untuk membuat Button adalah JButton.
•
Contoh Program :
Contoh Button 1 2 3 /* * ContohButton.java4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 39 --- */ import javax.swing.*;
class ContohButton extends JFrame // pewarisan {
//membuat object buttonSAVE
JButton buttonContoh=new JButton("Button"); ContohButton()
{
setTitle("Button"); //judul di frame setLocation(300,100); //x,y
setSize(240,120); //panjang,lebar //mengaktifkan button close di frame
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); }
void GUI() {
//mengatur letak komponen, null = koordinat manual getContentPane().setLayout(null);
// meletakkan object buttonContoh di Frame getContentPane().add(buttonContoh); //x,y,lebar,tinggi
buttonContoh.setBounds(10,10,100,20); setVisible(true); //menampilkan frame }
public static void main(String[]args) {
ContohButton sq=new ContohButton(); //object baru sq.GUI(); // memanggil method GUI
} }
