Pada kesempatan kali ini, penulis akan melanjutakan tutorial yang sebelumnya baru sampai pada tahap persiapan database connector dan operasi-operasi CRUD yang nantinya akan digunakan. Untuk dapat mengikuti tutorial ini, anda harus sudah menyelesaikan semua tahap pada tutorial part 2. Hal ini karena pada part ini, penulis akan memberikan tutorial pembuatan GUI-nya dan cara menggunakan class-class yang sudah dibuat sebelumnya dalam GUI java yaitu Swing.
1. Apa Itu Swing ?
Swing Merupakan API (Application Programming Interface) yang menyediakan Graphical User Interface (GUI) untuk program Java dan applet. Dengan dah Swing, kita dapat membuat GUI yang nantinya akan memudahkan pengguna aplikasi dalam mengoperasikan aplikasi.
2. Membuat Form Input
Sebelum memulai membuat design tampilan dari aplikasi, sebelumnya buatlah package baru dan beri nama ui, seperti yang nampak pada gambar dibawah ini :
Didalam package ui tersebut buatlah JFrame baru dengan nama FormBukuActivity, hasilnya seperti yang tampak pada gambar dibawah ini :
Untuk mulai mendesign tampilan ui-nya, anda dapat menarik setiap komponen yang anda butuhkan dari jendela palette netbeans seperti yang tampak pada gambar di bawah ini :
Sekarang buatlah design FormBukuActivity menjadi seperti yang tampak seperti dibawah ini :
Sekarang klik kanan pada kolom isian judul(JTextField) dan pilih change variable name sehingga muncul kotak dialog seperti dibawah ini :
Isikan kolom New Name menjadi judulField sehingga menjadi seperti yang tampak pada gambar dibawah ini :
Lakukan hal yang sama pada komponen terhadap komponen-komponen lainnya dengan ketentuan dibawah ini :
- JTextField pengarang nama variabelnya menjadi pengarangField.
- JLabel judul nama variabelnya menjadi titleActivity
- JRadioButton yudhistira nama variabelnya menjadi yudhistiraRb
- JRadioButton airlangga nama variabelnya menjadi airlanggaRb
- JRadioButton gramedia nama variabelnya menjadi gramediaRb
- JRadioButton yang lain nama variabelnya menjadi ygLainRb
- JComboBox tahun terbit nama variabelnya menjadi tahunTerbitCb
- JButton simpan nama variabelnya menjadi saveBtn
- JButton batal nama variabelnya menjadi cancelBtn
Jika sudah, maka pada jendela navigator akan tampak menjadi seperti dibawah ini :
Sekarang tambahkan komponen JButtonGroup ke design FormBukuActivity, komponen bukanlah komponen yang dapat dilihat pada design jadi untuk memastikan anda sudah menambahkan komponen tersebut dapat dilihat pada jendela navigator. Untuk lebih jelasnya anda dapat melihat gambar di bawah ini :
Sekarang masukkan setiap komponen JRadioButton yang kita punya kedalam JButtonGroup tersebut, caranya dapat dilihat melalui gambar dibawah ini :
Seperti yang terlihat diatas, pilih semua JRadioButton lalu ganti nilai properties buttonGroup menjadi buttonGroup1. Jika sudah sudah berhasil maka selesai sudah design FormBukuActivity.
3. Menyiapkan FormBukuActivity Event
FormBukuActivity merupakan form input yang nantinya akan digunakan untuk 2 kegiatan, yaitu untuk kegiatan penambahan data baru(Create) dan juga perubahan data(Update). Klik tab source seperti yang tampak pada gambar dibawah ini :
Ketikkan code ini dibawah deklarasi package :
package com.dika.ui; import com.dika.database.BukuDatasource; import com.dika.model.Buku; import java.sql.SQLException; import javax.swing.JOptionPane;
Sehingga kodenya menjadi seperti dibawah ini :
Kemudian ketikkan kode dibawah ini tepat dibawah constructor class dari FormBarangActivity :
private Buku buku; private void showError(String message) { JOptionPane.showMessageDialog(this, message, "Error", JOptionPane.ERROR_MESSAGE); } private void showSucceed(String message) { JOptionPane.showMessageDialog(this, message, "Sukses", JOptionPane.INFORMATION_MESSAGE); } private void showOldDataOf(Buku buku) { judulField.setText(buku.getJudulBuku()); pengarangField.setText(buku.getPengarang()); String penerbit = buku.getPenerbit(); switch (penerbit) { case "Yudhistira": yudhistiraRb.setSelected(true);break; case "Gramedia":gramediaRB.setSelected(true);break; case "Airlangga":airlanggaRB.setSelected(true);break; default:ygLainRb.setSelected(true);break; } tahunTerbitCb.setSelectedItem(String.valueOf(buku.getTahunTerbit())); } public void setBuku(Buku buku) { this.buku = buku; showOldDataOf(buku); } private String getSelectedPenerbit() { if (yudhistiraRb.isSelected()) { return "Yudhistira"; } else if (gramediaRB.isSelected()) { return "Gramedia"; } else if (airlanggaRB.isSelected()) { return "Airlangga"; } else if (ygLainRb.isSelected()) { return "Yang Lain"; } else { return ""; } } private boolean validateAllInput() { String judul = judulField.getText(); if (judul.isEmpty()) { showError("Judul buku masih kosong"); return false; } String pengarang = pengarangField.getText(); if (pengarang.isEmpty()) { showError("Pengarang buku masih kosong"); return false; } String penerbit = getSelectedPenerbit(); if (penerbit.isEmpty()) { showError("Penerbit belum ada yang dipilih"); return false; } String tahunTerbit = tahunTerbitCb.getSelectedItem().toString(); if (tahunTerbit.isEmpty()) { showError("Tahun terbit belum ada yang dipilih"); return false; } return true; } private void collectDataFor(Buku buku) { String judul = judulField.getText(); String pengarang = pengarangField.getText(); String penerbit = getSelectedPenerbit(); String tahunTerbit = tahunTerbitCb.getSelectedItem().toString(); buku.setJudulBuku(judul); buku.setPengarang(pengarang); buku.setPenerbit(penerbit); buku.setTahunTerbit(Integer.parseInt(tahunTerbit)); } private void saveNewData() { buku = new Buku(); collectDataFor(buku); BukuDatasource datasource = new BukuDatasource(); try { datasource.save(buku); showSucceed("Data buku berhasil disimpan"); } catch (SQLException e) { showError("Data buku gagal disimpan"); e.printStackTrace(); } } private void updateData() { collectDataFor(buku); BukuDatasource datasource = new BukuDatasource(); try { datasource.update(buku); showSucceed("Data buku berhasil diperbaharui"); } catch (SQLException e) { showError("Data buku gagal diperbaharui"); e.printStackTrace(); } } private void simpan() { if (!validateAllInput()) { return; } if (buku != null) { updateData(); } else { saveNewData(); } } @Override public void setTitle(String title) { super.setTitle(title); //To change body of generated methods, choose Tools | Templates. titleActivity.setText(title); }
Keterangan :
- Method showError digunakan untuk menampilkan dialog peringatan bahwa ada masalah pada saat suatu aksi dilakukan.
- Method showSucceed digunakan untuk menampilkan dialog info bahwa suatu aksi telah berhasil dilakukan.
- Method showOldDataOf digunakan untuk menampilkan data lama dari buku yang akan diperbaharui datanya.
- Method setBuku digunakan untuk menerima data buku yang akan diperbaharui datanya.
- Method getSelectedPenerbit digunakan untuk megambil pilihan penerbit dari pengguna aplikasi.
- Method validateAllInput digunakan untuk memvalidasi input dari pengguna aplikasi.
- Method collectDataFor digunakan untuk mengumpulkan input data buku dari pengguna aplikasi ke dalam sebuah object buku.
- Method saveNewData digunakan untuk menyimpan data buku baru ke dalam database.
- Method updateData digunakan untuk memperbaharui data buku dalam database.
- Method simpan digunakan sebagai aksi dari button simpan saat button tersebut diklik.
Sekarang kembali ke tab design dan beri aksi klik pada kedua button, baik itu button simpan maupun button cancel. Untuk lebih jelasnya lihat gambar dibawah ini :
Untuk memberi aksinya, kembali ke tab source dan ubah menjadi seperti ini :
Lakukan hal yang sama pada button cancel, hanya saja untuk aksinya menjadi seperti dibawah ini :
Sekarang edit properties defaultCloseOperation pada JFrame menjadi seperti apa yang tampak pada gambar dibawah ini :
4. Menyiapkan Form Data Manager Buku
Buatlah JFrame baru di dalam package ui dan beri namanya sebagai DataManagerBuku, lalu design seperti gambar dibawah ini :
Ubah nama variabel untuk komponen-komponen dibawah ini :
- JTable nama variabelnya menjadi tableBarang
- JButton tambah nama variabelnya menjadi addBtn
- JButton update nama variabelnya menjadi updateBtn
- JButton hapus nama variabelnya menjadi deleteBtn
- JButton tutup nama variabelnya menjadi closeBtn
Sehingga pada jendela navigator akan tampak seperti pada gambar dibawah ini :
Ketikkan code ini dibawah deklarasi package :
package com.dika.ui; import com.dika.database.BukuDatasource; import com.dika.model.Buku; import java.awt.Window; import java.awt.event.WindowAdapter; import java.awt.event.WindowEvent; import java.sql.SQLException; import java.util.List; import javax.swing.JOptionPane; import javax.swing.table.DefaultTableModel;
Ketikkan kode dibawah ini tepat dibawah constructor data DataManagerBuku :
/** * Creates new form DataManagerBuku */ public DataManagerBuku() { initComponents(); } private DefaultTableModel tableModel; private List<Buku> bukuList; private void showError(String message) { JOptionPane.showMessageDialog(this, message, "Error", JOptionPane.ERROR_MESSAGE); } private void showSucceed(String message) { JOptionPane.showMessageDialog(this, message, "Sukses", JOptionPane.INFORMATION_MESSAGE); } private void initTableModel() { String[] columns = new String[]{"ID Buku", "Judul", "Pengarang", "Penerbit", "Tahun Terbit"}; tableModel = new DefaultTableModel(columns, 0); tableBarang.setModel(tableModel); } private void addRowToTableFor(Buku buku) { tableModel.addRow(new Object[]{ buku.getId(), buku.getJudulBuku(), buku.getPengarang(), buku.getPenerbit(), buku.getTahunTerbit(), }); } private void addRowsToTableFor(List<Buku> bukuList) { for (Buku buku : bukuList) { addRowToTableFor(buku); } } private void loadDataBuku() { BukuDatasource datasource = new BukuDatasource(); if (tableModel.getRowCount() > 0) { tableModel.setRowCount(0); } try { bukuList = datasource.findAll(); addRowsToTableFor(bukuList); } catch (SQLException e) { showError("Tidak dapat memuat data buku"); e.printStackTrace(); } } private void open(Window activity) { activity.setLocationRelativeTo(this); activity.setVisible(true); activity.addWindowListener(new WindowAdapter() { @Override public void windowClosed(WindowEvent e) { super.windowClosed(e); //To change body of generated methods, choose Tools | Templates. loadDataBuku(); } }); } private void startAddBukuActivity() { FormBukuActivity activity = new FormBukuActivity(); activity.setTitle("Tambah Data Buku"); open(activity); } private void startUpateBukuActivity() { int selectedRow = tableBarang.getSelectedRow(); if (selectedRow < 0) { showError("Tidak ada data buku terpilih dalam tabel"); return; } Buku selectedBuku = bukuList.get(selectedRow); FormBukuActivity activity = new FormBukuActivity(); activity.setTitle("Update Data Buku"); activity.setBuku(selectedBuku); open(activity); } private void deleteBuku() { int selectedRow = tableBarang.getSelectedRow(); if (selectedRow < 0) { showError("Tidak ada data buku terpilih dalam tabel"); return; } Buku selectedBuku = bukuList.get(selectedRow); int confirm = JOptionPane.showConfirmDialog(this, "Yakin Hapus"+selectedBuku.getJudulBuku()+" ?"); if (confirm == JOptionPane.YES_OPTION) { BukuDatasource datasource = new BukuDatasource(); try { datasource.delete(selectedBuku); tableModel.removeRow(selectedRow); bukuList.remove(selectedBuku); showSucceed("Data buku berhasil dihapus"); } catch (SQLException e) { showSucceed("Data buku gagal dihapus"); e.printStackTrace(); } } }
Keterangan :
- Method showError digunakan untuk menampilkan dialog peringatan bahwa ada masalah pada saat suatu aksi dilakukan.
- Method showSucceed digunakan untuk menampilkan dialog info bahwa suatu aksi telah berhasil dilakukan.
- Method initTableModel digunakan untuk mendefenisikan kolom didalam table.
- Method addRowToTableFor digunakan untuk menambah satu data buku ke dalam table.
- Method addRowsToTableFor digunakan untuk menambah sejumlah data buku ke dalam table.
- Method loadDataBuku digunakan untuk mengambil data buku dari database dan menampilkannya pada table.
- Method open digunakan untuk menampilkan Window lain.
- Method startAddBukuActivity digunakan untuk membuka FormBukuActivity dan mengatur aktivitasnya menjadi tambah data baru.
- Method startUpateBukuActivity digunakan untuk membuka FormBukuActivity dan mengatur aktivitasnya menjadi update data.
- Method deleteBuku digunakan untuk menghapus data buku dari database.
Sekarang modifikasi constructornya menjadi seperti dibawah ini :
/** * Creates new form DataManagerBuku */ public DataManagerBuku() { initComponents(); initTableModel(); loadDataBuku(); }
Sekarang beri aksi klik pada masing JButton, yang aksinya dijelaskan melalui gambar dibawah ini :
Terakhir edit properties title pada JFrame menjadi seperti dibawah ini :