Komponen GUI

 Java menyediakan komponen-komponen untuk membuat program dengan

GUI, salah satu mekanisme untuk mengimplementasikannya adalah dengan
menggunakan paket javax.swing.

 GUI adalah singkatan dari Graphical User Interface,yang berarti komponen

grafis yang akan dilihat user/client nantinya, nah untuk membuat GUI java,
kita akan memakai Jframeform

Berikut ini adalah beberapa contoh Komponen GUI Pada Java :

 JFrame  JComboBox
 JLabel  JTextArea
  JCheckBox
JTextField
 JTable
 JButton
 JScrollPane
 JRadioButton
Jframe,JLabel.,JTextField

 JFrame adalah komponen dasar dalam pemrograman visual dengan java.

Frame berfungsi sebagai penampung komponen-komponen lainnya.

 JLabel adalah komponen yang digunakan untuk membuat tulisan atau

gambar pada frame sebagai suatu informasi untuk pengguna program.

 JTextField adalah komponen yang digunakan untuk memasukkan sebaris

string yang selanjutnya dapat digunakan sebagai input bagi proses
selanjutnya.
 Jbutton, JRadioButton,
JComboBox

 JButton adalah komponen berbentuk tombol. Komponen ini banyak

digunakan sebagai eksekusi terhadap tindakan yang diinginkan.

 JRadioButton adalah komponen yang digunakan ketika pengguna perlu

memilih satu diantara beberapa pilihan.

 JComboBox juga merupakan komponen yang digunakan untuk memilih

satu diantara sekian banyak pilihan yang berbentuk semacam TextField
dan ada panah ke bawah.
JTextArea, JCheckBox, JTable

 JTextArea merupakan komponen yang mirip dengan JtextField tetapi

dapat menampung lebih dari satu baris.

 JCheckBox adalah komponen yang digunakan ketika pengguna

memerlukan komponen untuk melakukan satu atau banyak pilhan
sekaligus.

 JTable digunakan untuk menampilkan data dalam bentuk tabel, suatu

bentuk yang banyak digunakan dalam pemrograman database.
JScrollPane

 JScrollPane adalah komponen yang digunakan untuk menggerakkan

obyek ke atas, ke bawah atau ke samping agar semua sebuah obyek
terlihat di layar.
CONTOH PROGRAM

import javax.swing.*;

class buku{
public static void main (String [] args){
JFrame f=new JFrame("Data Buku");
JLabel kb= new JLabel("Kode Buku");
JLabel jb= new JLabel("Judul Buku");
JLabel si= new JLabel("Sinopsis");
JLabel pg= new JLabel("Pengarang");
JLabel kt= new JLabel("Kategori");
JTextField tkode=new JTextField();
JTextField tjudul=new JTextField();
JTextArea aSin=new JTextArea();
JTextField tpengarang=new JTextField();
String [] kategori = {"Komputer","Kesehatan","Kuliner"};
JComboBox kat=new JComboBox(kategori);
JButton bsimpan=new JButton ("Simpan");
JButton bkeluar=new JButton ("Keluar");
CONTOH PROGRAM

kb.setBounds(10,10,100,20);
jb.setBounds(10,40,100,20);
si.setBounds(10,70,100,70);
pg.setBounds(10,150,100,20);
kt.setBounds(10,180,100,20);
tkode.setBounds(110,10,80,20);
tjudul.setBounds(110,40,120,20);
aSin.setBounds(110,70,100,70);
tpengarang.setBounds(110,150,100,20);
kat.setBounds(110,180,90,20);
bsimpan.setBounds(110,210,100,40);
bkeluar.setBounds(220,210,100,40);
f.add(kb);
f.add(jb);
f.add(si);
f.add(pg);
f.add(kt);
f.setSize(400,300);
f.setLayout(null);
f.setVisible(true);
}
}
Output
LAYOUT MANAGER

 Pengaturan layout digunakan untuk mengatur posisi dari komponen visual

penyusun program sesuai dengan desain user interface. Beberapa pilihan
layout telah disediakan java, dimana keputusan untuk menggunakan jenis
layout tertentu bergantung pada jenis aplikasi yang ingin dibuat serta tingkat
kerapian yang diinginkan. Pada bab-bab terdahulu, manajemen layout yang
digunakan adalah none layout, dimana pengaturan posisi komponen dalam
frame dilakukan sendiri oleh programmer.

 FlowLayout adalah jenis pengaturan layout yang paling sederhana, dimana

semua komponen akan tersusun dari kiri ke kanan sepanjang frame, dan akan
pindah ke bawah bila telah sampai batas kanan frame.
CONTOH PROGRAM

import javax.swing.*;
import java.awt.*;
class flow{
public static void main (String [] args){
JFrame f=new JFrame("Flow Layout");
FlowLayout fl=new FlowLayout(FlowLayout.CENTER);

JButton b1=new JButton("Posisi 1");

JButton b2=new JButton("Posisi 2");
JButton b3=new JButton("Posisi 3");
JButton b4=new JButton("Posisi 4");
JButton b5=new JButton("Posisi 5");

f.getContentPane().setLayout(fl);
f.getContentPane().add(b1);
f.getContentPane().add(b2);
f.getContentPane().add(b3);
f.getContentPane().add(b4);
f.getContentPane().add(b5);
f.setSize(500,80);
f.setVisible(true);
}
}
LAYOUT MANAGER

 BorderLayout merupakan jenis layout yang bekerja dengan membagi frame

menjadi lima bagian yaitu NORTH, EAST, SOUTH, WEST dan CENTER.

import javax.swing.*;
import java.awt.*;

class border{
public static void main (String [] args){
JFrame f=new JFrame("Border Layout");
BorderLayout bl=new BorderLayout();
f.getContentPane().setLayout(bl);

JButton b1=new JButton("NORTH");

JButton b2=new JButton("SOUTH");
JButton b3=new JButton("EAST");
JButton b4=new JButton("WEST");
JButton b5=new JButton("CENTER");
LAYOUT MANAGER

f.getContentPane().add(b1,BorderLayout.NORTH);
f.getContentPane().add(b2,BorderLayout.SOUTH);
f.getContentPane().add(b3,BorderLayout.EAST);
f.getContentPane().add(b4,BorderLayout.WEST);
f.getContentPane().add(b5,BorderLayout.CENTER);
f.pack();
f.setVisible(true);
}
}

 GridLayout adalah jenis layout yang bekerja berdasar baris dan kolom.
Dengan layout ini kita dapat memberikan argumen banyaknya baris dan
kolom sesuai dengan kebutuhan.
CONTOH PROGRAM

import javax.swing.*;
import java.awt.*;

class grid{
public static void main(String [] args){
JFrame f=new JFrame("Grid Layout");
JButton b1=new JButton("Satu");
JButton b2=new JButton("Dua");
JButton b3=new JButton("Tiga");
JButton b4=new JButton("Empat");
JButton b5=new JButton("Lima");

GridLayout gl=new GridLayout(3,2);

f.getContentPane().setLayout(gl);
f.getContentPane().add(b1);
f.getContentPane().add(b2);
f.getContentPane().add(b3);
f.getContentPane().add(b4);
f.getContentPane().add(b5);

f.pack();
f.setVisible(true);

}
}
EVENT

Event merupakan suatu kejadian yang dilakukan oleh user terhadap user interface.
Setiap objek dapat dinotifikasi jika suatu event terjadi sehingga objek tersebut
dapat memutuskan apa yang harus dilakukan untuk menanggapi event yang
bersangkutan.

Beberapa contoh event :

Event Listeners Deskripsi

ActionListener Bereaksi atas perubahan mouse atau keyboard

MouseListener Bereaksi atas pergerakan mouse

WindowListener Bereaksi atas perubahan window.

Membuat Form Login Sederhana

Langkah-langkah membuat form
Login Sederhana

Buka aplikasi Netbeans >> Klik menu File >> New Project

Pada step 1, pilih categories : Java dan Project : Java Application, Klik Next
Langkah-langkah membuat form Login
Sederhana

Pada step kedua, beri nama project dan atur project location. Contoh : nama
project BelajarVisual yang akan disimpan di D:/

Untuk membuat form login , Klik kanan pada belajarVisual >> New >> JFrame
Form
Langkah-langkah membuat form
Login Sederhana

Beri nama class , misal Login, klik Finish

Pada form login yang sudah dibuat, tambahkan komponen-komponen yang

dibutuhkan , yaitu JLabel, JTextField dan JButton
Langkah-langkah membuat form
Login Sederhana

Ubah text pada Jlabel dengan cara klik kanan pada label tersebut, kemudian pilih
edit Text

Tambahkan komponen-komponen lain agar tampilan menjadi sebagai berikut :

Langkah-langkah membuat form Login
Sederhana

Untuk merubah font dapat dilakukan melalui Properties >> Font

Ubah nama variabel textfield untuk username menjadi “tuser” dengan cara klik
kanan pada textfield tersebut.
Langkah-langkah membuat form
Login Sederhana

Ubah juga nama variabel passwordfield menjadi tpass, nama variabel button login
menjadi blog dan nama variabel button cancel menjadi bcan.
Untuk menambahkan event pada button login, Klik kanan button login >>
Events>> Action>> actionPerformed, Kemudian tulis syntax berikut :

Untuk menambahkan event pada button cancel, Klik kanan button Cancel>>
Events>> Action>> actionPerformed, Kemudian tulis syntax berikut :
Langkah-langkah membuat form Login
Sederhana

Untuk menambahkan background gambar pada form. Buat folder baru dengan
nama “gambar” di dalam folder src pada netbeans project (BelajarVisual).

Masukkan gambar-gambar yang dibutuhkan ke dalam folder “gambar” tersebut.

Buat java class baru dengan nama “bg2” pada package belajarVisual.
Langkah-langkah membuat form
Login Sederhana
Langkah-langkah membuat form Login
Sederhana

Klik kanan pada project >> Clean and Build

Buka form login, tarik class bg2.java ke dalam form login
Untuk menjalankan program, klik kanan form login >> Run File
Contoh Program menggunakan
Event keyPressed

Contoh Program Hitung Nilai

 Buat form Nilai sebagai berikut :

Contoh Program menggunakan
Event keyPressed

Beri Event keyPress pada textfield nilai tugas (ttgs) . klik kanan pada textfield
nilai tugas >> Event >> Key >> KeyPress, kemudian tulis syntax berikut :

Beri event keypress pada textfield nilai uts dan uas dengan cara yang sama.
Contoh Program menggunakan
Event keyPressed

Beri event actionPerformed pada button hitung :

Contoh Program menggunakan
Event keyPressed

Tambahkan event keyPress pada button hitung, isinya sama dengan

event actionPerformed pada button Hitung Nilai :
Contoh Program menggunakan
Event keyPressed

Beri event pada button Clear :

KONEKSI JAVA DATABASE

Koneksi ke database pada Java ditangani oleh JDBC (Java Database

Connectivity).
JDBC merupakan salah satu API (Application Programming Interface) yang
secara khusus ditujukan untuk menangani koneksi ke database.
Antarmuka ini memungkinkan pemrogram menulis sebuah program yang dapat
digunakan untuk mengakses database yang berbeda-beda, misalnya Oracle,
Access, atau MySQL.

Secara umum, untuk bekerja dengan JDBC, langkah yang dilakukan adalah :
 Me-load JDBC Driver ke dalam JVM. JDBC Driver dapat dipandang sebagai
library yang dibutuhkan untuk mengakses database tertentu.
 Membuat koneksi ke database yang direpresentasikan sebagai objek
java.sql.Connection.
 Membuat objek java.sql.Statement yang akan digunakan untuk mengirimkan
perintah SQL ke database.
 Menjalankan metode yang bersesuaian dari objek java.sql.Statement, seperti
executeQuery() atau executeUpdate().
KONEKSI JAVA DATABASE

 Melakukan koneksi ke database dapat dilakukan dengan : Meload driver dan

membuat koneksi itu sendiri.
 Cara meload driver adalah dengan meletakkan file jar database driver ke
dalam classpath. Kemudian load driver dengan menambahkan kode berikut:

Class.forName(“com.mysql.jdbc.Driver”);

 Nama class database driver untuk setiap DBMS berbeda-beda, nama class
tersebut bisa ditemukan dalam dokumentasi driver database yang digunakan.
 Dalam contoh ini, nama class database driver dari MySql adalah
com.mysql.jdbc.Driver.
 Memanggil method Class.forName secara otomatis membuat instance dari
database driver, class DriverManager secara otomatis juga dipanggil untuk
mengelola class database driver ini.
 Langkah berikutnya adalah membuat koneksi ke database menggunakan
database driver yang sudah diload sebelumnya.
 Class DriverManager bekerja sama dengan interface Driver untuk mengelola
driver-driver yang diload oleh aplikasi. Dalam satu sesi bisa meload beberapa
database driver yang berbeda. Ketika melakukan koneksi, JDBC Test Suite
akan melakukan serangkaian tes untuk menentukan driver mana yang akan
digunakan. Parameter yang digunakan untuk menentukan driver yang sesuai
adalah URL. Aplikasi yang akan melakukan koneksi ke database menyediakan
URL pengenal dari server database tersebut.
Membuat Koneksi

 Sebagai contoh adalah URL yang digunakan untuk melakukan koneksi ke

MySql :
jdbc:mysql://[host]:[port]/[schema]

contoh :
jdbc:mysql://localhost:3306/latihan

 Setiap vendor DBMS akan menyertakan cara untuk menentukan URL ini di
dalam dokumentasi.
 Method DriverManager.getConnection bertugas untuk membuat koneksi:
Connection conn = DriverManager.getConnection
(“jdbc:mysql://localhost:3306/latihan”);
 Dalam kebanyakan kasus juga harus memasukkan parameter username dan
password untuk dapat melakukan koneksi ke dalam database. Method
getConnection menerima Username sebagai parameter kedua dan pasword
sebagai parameter ketiga, sehingga kode diatas dapat dirubah menjadi :

Connection conn = DriverManager.getConnection

(“jdbc:mysql://localhost:3306/latihan”,”root”,””);
Membuat Koneksi

 Jika salah satu dari driver yang diload berhasil digunakan untuk melakukan
koneksi dengan URL tersebut, maka koneksi ke database berhasil dilaksanakan.
Class Connection akan memegang informasi koneksi ke database yang
didefinisikan oleh URL tersebut.

 Setelah sukses melakukan koneksi ke database, kita dapat mengambil data dari
database menggunakan perintah query ataupun melakukan perubahan terhadap
database. bagian berikut ini akan menerangkan bagaimana cara mengambil dan
memanipulasi data dari database.
Membuat Database dan Tabel

 Buka XAMPP Control Panel, Aktifkan Apache dan MySQL

 Buka phpMyAdmin melalui browser

Membuat Database dan Tabel

Buat database dengan nama Klinik

Buat tabel dengan nama pasien dengan jumlah kolom : 5

Buat field di dalam tabel pasien sebagai berikut :

Membuat Database dan Tabel

Setelah selesai klik save

Buat project baru dengan nama AplikasiKlinik

Membuat Database dan Tabel

Buat dua buah package dengan nama koneksi dan tampilan

Tambahkan driver JDBC dalam Libraries >> Add Library ... >> Pilih MySQL
JDBC Driver
Membuat Database dan Tabel

Setelah klik add Library maka MySQL JDBC Driver akan ada di dalam Libraries
project kita

Buat java class baru di dalam package koneksi dengan nama koneksi
Membuat Database dan Tabel

Tulis sintaks berikut di dalam class koneksi

Pada package tampilan, tambahkan JFrame Form dengan nama formPasien

Membuat Database dan Tabel

Buat tampilan formPasien sebagai berikut :

Ubah text dan nama variabel masing-masing komponen sebagai berikut

Membuat Database dan Tabel

Pada source ketik sintaks berikut :

Membuat Database dan Tabel

Buat method aktif(), kosong(), dan datatable sebagai berikut :

Membuat Database dan Tabel

Tambahkan method datatable di bawah initComponents();

Contoh program koneksi database
(Lanjutan)

Tambahkan event actionPerformed pada button Save :

Contoh program koneksi database
(Lanjutan)

Tulis sintaks berikut :

Tambahkan event mouseClicked pada tabelpasien :

Contoh program koneksi database
(Lanjutan)

Tulis sintaks berikut :

Tambahkan event actionPerformed pada button Edit, dan tulis

sintaks berikut :
Contoh program koneksi database
(Lanjutan)

Tambahkan event actionPerformed pada button Delete :

Tambahkan event actionPerformed pada button Exit :

Contoh program koneksi database
(Lanjutan)

Tambahkan event actionPerformed pada button Clear :

Contoh program koneksi database
(Lanjutan)

Tambahkan event actionPerformed pada button Cari :

Contoh program koneksi database
(Lanjutan)

Tambahkan event pada button cari dokter sebagai berikut :

 Tambahkan event pada button cari pasien sebagai berikut :

MENU

Merupakan kelas yang berguna untuk membuat menu bar yang biasa diletakkan di
bagian atas jendela dan bersifat pull-down. Dalam prakteknya, pembuatan menu
bar melibatkan kelas lain yang berhubungan dengan menu, yaitu JMenu dan
JMenuItem

Prinsip untuk membuat menu bar adalah sebagai berikut :

 Membuat objek JMenuBar
 Mengaitkan objek JMenuBar tersebut ke jendela melalui metode
setJMenuBar()
 Menciptakan sejumlah objek JMenu yang akan dijadikan sebagai menu dalam
menu bar
 Mengaitkan objek-objek JMenu ke Objek JMenuBar melalui metode add()
 Membuat sejumlah item menu melalui pembuatan objek JMenuItem untuk
masing-masing menu
 Mengaitkan item-item menu ke objek JMenu

.
MENU

 Buka Netbeans dan buat form baru

 Tambahkan Menu Bar, Menu, dan Menu Item sebagai berikut
MENU

Tambahkan event pada MenuItem Data Pasien

Tambahkan sintaks berikut untuk menampilkan form pasien jika

menu item data pasien di-klik:
CONTOH FORM TRANSAKSI

Buka XAMPP Control Panel, Aktifkan Apache dan MySQL

CONTOH FORM TRANSAKSI

Buka phpMyAdmin melalui browser

Pada database klinik yang sudah ada sebelumnya, buat tabel rekam
sebagai berikut
CONTOH FORM TRANSAKSI

Klik Save

Buat form Rekam medis sebagai berikut :

CONTOH FORM TRANSAKSI

Ubah nama variabel sebagai berikut

Tambahkan sintaks berikut pada source program:

CONTOH FORM TRANSAKSI

Tambahkan sintaks berikut pada source program:

Tambahkan sintaks berikut pada source program:

CONTOH FORM TRANSAKSI

Tambahkan sintaks berikut pada source program:

Pada button bcari_dokter , masukkan sintaks berikut :

CONTOH FORM TRANSAKSI

Pada button bcari_pasien , masukkan sintaks berikut

Pada button bsave , masukkan sintaks berikut :

CONTOH FORM TRANSAKSI

Pada button bclear dan bexit , masukkan sintaks berikut :\

Pada button bcari , masukkan sintaks berikut :

CONTOH FORM TRANSAKSI

Pada tabelrekam , tambahkan event berikut :

Report

 Buat package Laporan di dalam Source package

 Pada Package Laporan, buat Report dengan cara klik kanan
package Laporan>>New>>Report Wizard
Report

Pilih layout yang akan digunakan, bisa memilih template yang

sudah ada atau bisa juga memilih blank page (Blank A4/Blank A4
landscape/BlankLetter/Blank Letter Landscape)

Beri nama file laporan, contoh : LapPasien.jrxml , kemudian klik

Next
Report

Pada pilihan Connections / Data Sources, Pilih koneksi yang akan

digunakan. Jika belum ada atau ingin membuat koneksi baru, Klik
New

Pilih Database JDBC Connection

Report

Beri nama koneksi, contoh : koneksi_RS , kemudian isi seperti

berikut

Klik Test untuk melakukan test koneksi database. Jika sudah

berhasil Klik Save
Report

Connection /Datasource sudah terpilih sesuai yang sudah dibuat pada langkah
sebelumnya. Selanjutnya klik Design Query

Pilih tabel yang akan dipakai untuk membuat laporan. Contoh tabel pasien
Report

Klik OK, maka akan tampil seperti gambar dibawah. Kemudian klik Next

Setelah klik Next, akan ditampilkan sebagai berikut :

Report

Pilih field-field yang akan digunakan untuk membuat laporan ke area sebelah
kanan.

Lanjutkan langkah berikutnya sampai finish

Report

Lanjutkan langkah berikutnya sampai finish

Setelah berhasil maka akan tampil halaman design laporan seperti gambar di
bawah, Kemudian design laporan sesuai yang diinginkan.
Report

Contoh :
\

Untuk melihat preview hasil laporan, klik Preview

Lalu pada project yang sedang dibuat, tambahkan file jar pada
library.
Report

 Tambahkan button PRINT pada form untuk menampilkan laporan yang sudah
dibuat.
Report

 Tambahkan actionPerformed untuk button PRINT

 Masukan syntaks berikut :

Tambahkan juga sintaks berikut di bawah package tampilan:

Report