Feeds:
Posts
Comments

Tutorial  Java Desktop sebelumnya akan saya lanjutkan  dengan Tutorial Pembuatan Aplikasi Java Desktop dan IReport. Semoga bermanfaat bagi Java mania 🙂

Diharapkan sebelum membaca tutorial pembuatan aplikasi Java Desktop  dan IReport terlebih dahulu disarankan anda telah membaca dan mencoba mempraktekkan sendiri tulisan saya sebelumnya yang berjudul Tutorial Aplikasi Java Desktop Menggunakan Netbeans.

Pada tulisan kali ini saya  menggunakan Netbeans Versi 6.7.1IReport Versi 3.6.1 dan XAMPP for Windows versi 1.7.2 .

Ada beberapa langkah yang harus diikuti :

  • Pembuatan Database Akademik  pada Xampp
  • Pembuatan Frame Utama
  • Pembuatan Form Insert Data Mahasiswa
  • Pembuatan Laporan/Report  Data Mahasiswa menggunakan IReport

I.  PEMBUATAN DATABASE

Untuk pembuatan database langkah yang dilakukan hampir sama  dengan tulisan sebelumnya.  Buatlah sebuah database di XAMP atau WAMP anda dengan nama database : akademik.

II.  PEMBUATAN FRAME UTAMA

Setelah pembuatan database tahap selanjutnya adalah pembuatan frame utama. Selanjutnya buka Netbeans. Pada  jendela Netbeans buat project baru dengan cara File -> New Project->Java->Java Desktop Application -> Klik Finish. Berikutnya akan tampil jendela New Desktop Application.  Pada Project Name isi nama project : Sistem Akademik.

Klik Finish, selanjutnya jendela Frame Utama akan muncul.Klik kanan Source Package -> New -> Java Package. Buatlah sebuah package (direktori) dengan Package Name: Image. Package ini akan kita gunakan untuk menyimpan semua image atau gambar yang dibutuhkan untuk pembuatan aplikasi ini nantinyaKemudian copy sebuah  file background bertipe jpg ke dalam direktori Image pada tutorial ini saya .menggunakan file MOLOKINI.JPG.
Modifikasi tampilan frame utama dengan memasukkan sebuah image pada background frame utama. Hal ini dapat dilakukan dengan menambahkan sebuah JLabel yang terletak pada pane  Swing Control. Pada pane Properties dari JLabel pilih icon properties.

Untuk melihat output tampilan background Frame utama aplikasi, klik kanan project Sistem Akademik->Run . Sehingga tampilan frame utama akan menjadi sepertil gambar dibawah ini.
Untuk sementara tampilan form Utama dari aplikasi kita anggap selesai dulu. Tutorial akan dilanjutkan dengan pembuatan Form Insert Data Mahasiswa.

    3. PEMBUATAN FORM INSERT DATA MAHASISWA

Untuk pembuatan form dilakukan dengan cara klik kanan  package sistemakademik->New->JInternalFrame Form
Isi Class Name pada jendela New JInternalFrame From dengan InsertDataMahasiswa kemudian klik Finish.
Tahap selanjutnya kita akan menambahkan komponen GUI (Graphical User Interface ) ke dalam JInternalFrameForm. Hal ini dapat dilakukan dengan cara Klik-Drag and Drop komponen GUI yang ada pada Swing Control di Task Pane Pallete dari Netbeans . Adapun Komponen Swing Control yang digunakan adalah Label, TextField, RadioButton dan Button.
Untuk Mengganti warna background dari frame silahkan klik  background Properties pada bagian JInternalFrame Properties. Pilih warna background yang akan digunakan.

Untuk mengganti warna tulisan klik terlebih dahulu  masing-masing Komponen GUI kemudian  pada bagian properties  klik foreground.  Contoh pada tulisan ini properties warna tulisan yang diubah adalah properties komponen JLabel. Selanjutnya Klik tombol OK.
Modifikasilah tampilan seperti gambar dibawah ini.

kemudian ganti  Variable Name masing masing button dengan cara : Klik Kanan Komponen JButton -> Change Variable Name->New Name ->btnSimpan untuk tombol SIMPAN.

Hal yang sama juga dilakukan untuk komponen button lainnya , btnUbah untuk tombol UBAH, btnBatal untuk tombol BATAL, btnExit untuk tombol EXIT dan btnPrint untuk tombol PRINT

    Untuk mengganti gambar pada pada masing-masing tombol dapat dilakukan dengan mengganti properties icon pada masing-masing JButton. Untuk penggantian image icon ini langkah yang dilakukan sama dengan pengantian gambar background yang sudah kita lakukan sebelumnya.

PEMBERIAN AKSI (ACTION PERFORMED) PADA MASING-MASING TOMBOL

Pemberian Aksi ketika tombol ditekan dapat dilakukan dengan Klik kanan JButton->Events->Action->actionPerformed

1. TOMBOL SIMPAN


A. KONEKSI DATABASE MYSQL DENGAN NETBEANS

Buat database “akademik” dengan  MySQL menggunakan PhpMyAdmin pada Wamp/Xampp. Pada Netbeans kita  tidak dapat secara langsung  membuat database MySQL. Namun ada wizard untuk membuat Java database untuk Derby database. Setelah menyelesaikan pembuatan database, keluar dan buka NetBeans.

img1

Bila NetBeans IDE telah dibuka , pilih Service Pane, buka Folder Databases klik tanda plus yang ada di folder Databasesimg2

Catt: Jika Anda Menggunakan Netbeans versi yang lebih rendah dari 6.1, anda tidak akan menemukan Driver MySQL(Connector/J driver) pada folder driver database. Driver ini dapat ditambahkan dengan cara: Klik kanan folder Drivers > New Driver sehingga akan keluar window berikut ini:

img3

Tekan Tombol Add sehingga akan tampil page select driver, pilih mysql-connector-java.jar dari direktori kerja anda.  Tekan tombol Open.

Sehingga pada folder driver databases anda akan muncul MySQL (Connector/J driver)

img4

Klik kanan MySQL(Connector/J driver) > Connect Using

img5

Berikutnya Akan keluar jendela New Database Connection

img6

Pada Database URL  masukkan URL database dengan format berikut:

jdbc:mysql://<hostname>:<database_port_number>/<database_name>

contoh  : jdbc:mysql://localhost:3306/akademik

Ketentuan:

hostname : localhost

database_portnumber : nomor port mysql database :3306

databasename : nama database : akademik

UserName : root

Password : Password MySQL (jika ada)

Klik Tombol OK. Jika koneksi database MySQL anda telah berhasil maka pada jendela New Database Driver akan tampil Connection established.img7

Sekarang anda telah terhubung dengan MySQL database dan Netbeans. Pada Service pane  akan muncul  Koneksi database yang telah berhasil dibuat.

img8

B. MEMBUAT TABEL

Langkah berikutnya  adalah membuat tabel dan mengisi tabel  dengan contoh data sampel. Pada Nama Kolom stud_date_of_birth pada  tabel student_record berikut ini akan memberikan  permasalahan . Tapi hal ini dapat diatasi nanti. Hal ini disebabkan  tidak kompatibel antara java.util.date dan java.sql.date.

Pada database terpilih , klik kanan Table> Execute Command, kemudian  keikkan Perintah berikut

img9

Langkah selanjutnya adalah mengisi tabel studentrecord

img10

Kemudian pada SQL Command ketikkan perintah berikut ini:

select * from studentrecord

img11

C. MEMBUAT APLIKASI JAVA DESKTOP

Buka Netbeans kemudian pada toolbar klik File > New Project

Pilih Categories  > Java > Java Desktop Application pada  Projects. Klick Next

img12

Klik Next > Isi Project Name dengan nama project dengan DesktopApp

img13

Pada Database Connection pilih koneksi database akademik, Database Table : studentrecord

img14

Secara default Radio Button pada TextField akan di centang. Biarkan saja demikian

img15

Klik Finish sehingga jendela Opening Projects muncul.

img16

Berikutnya akan muncul design GUI dari aplikasi Desktop anda.

img17Klikimg18untuk melihat Design Preview dari tampilan GUI anda.

D. MENJALANKAN PROJECT

Untuk menjalankan project , pilih  folder DesktoppApp pada Project pane > klik kanan > pilih menu Run

img20

Permasalahan terjadi terjadi  karena ketika project dijalankan hanya 3 dari 8 JTextfield yang  berisi data. Hal ini disebabkan tidak kompatibel antara java.util.date dan java.sql.date . Untuk mengatasi hal ini dapat dilakukan dengan menggunakan tipe int atau String untuk stud_date_of_birth atau kita dapat memisahkan tahun, bulan hari dengan nama kolom tabel yang berbeda ).

Tutup aplikasi, kemudian kembali ke design. Pilih text field Stud Date Of Birth. Pada Properties klik Binding

img21

Pada text Preferred  Binding Expression pilih tipe int pada date, dengan cara klik pada studDateOfBirth java.util.Date dan pilih date int > OK.

img22

Kembali jalankan project dan lihat perubahan yang terjadi, jika salah satu data pada tabel di klik maka pada textfiled Stud Date Of Birth hanya menampilkan tanggal. Bisa dikatakan program ini baru berjalan 90 %.

img23

Jika anda ingin menambahkan  komponen tanggal lainnya untuk ditampilkan ke textfield tergantung pada kreatifitas anda sekarang ^_^ (Good Luck).