Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 1

Membuat Laporan Menggunakan iReport 5.1 Implementasi Pada

Editor Netbeans 7.3

(Aplikasi Penjualan Komputer)

A. Membuat Laporan Tanpa Menggunakan Parameter Inputan

Untuk membangun sebuah aplikasi penjualan maka perancangan laporan dipandang perlu

untuk memberikan informasi baik internal maupun eksternal. Sehingga kita perlu merancang

sebuah laporan

Laporan tanpa menggunakan parameter inputan merupakan sebuah laporan yang tidak

memiliki filterisasi terhadap data yang akan di tampilkan dalam membentuk sebuah laporan.

1. Laporan Daftar Barang

Laporan ini digunakan untuk memberikan informasi mengenai daftar barang yang tersedia

disebuah toko, sehingga pihak manajemen dan pihak lainnya yang membutuhkan informasi

mengenai daftar barang bisa didapatkan dan diakses dengan mudah menggunakan aplikasi yang

telah dirancang.

Berikut langkah – langkah untuk merancang sebuah laporan dan konfigurasinya di editor

netbeans :

1. Persiapan

Adapun persiapan yang perlu dilakukan untuk merancang laporan adalah sebagai berikut :

Pastikan database yang ingin anda gunakan untuk membuat laporan telah tersedia/tercipta di

database MySQL (penulis disini menggunakan dbs_penjualan)

Menginstall aplikasi / editor untuk menciptakan/merancang sebuah laporan dalam hal ini

penulis menggunakan editor iReport 5.1 (bisa memakai versi sebelumnya yang mendukung)

Setelah editor tersebut sudah selesai di install silahkan anda buka editor tersebut dengan

mengklik double shortcut yang telah tersedia di dekstop

Gambar 1 : Shortcut iReport 5.1.0

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 2

Maka akan tampil awal iReport 5.1 seperti berikut ini :

Gambar 2 : Tampilan Awal Editor iReport 5.1.0

Sebelum merancang sebuah laporan yang terintegrasi pada database maka hal yang harus

dilakukan adalah membuat sebuah koneksi kedatabase. Adapun langkah untuk membuat

koneksi ke database adalah sebagai berikut :

Klik icon datasource yang berada disebelah combo box yang bertuliskan Empty

Datasource, sehingga akan menghasilkan wizad untuk membuat koneksi seperti

berikut.

Gambar 3 : Jendela wizard pembuatan koneksi kedatabase

Klik new untuk membuat koneksi baru. Maka akan tampil form pemilihan type

koneksi datasource seperti berikut kemudian pilih Database JDBC Connection,

(karena driver yang kita gunakan untuk koneksi ke database mysql secara default

JDBC Connection), Klik Next untuk melanjutkan.

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 3

Gambar 4 : Pemilihan type datasource

Kemudian akan tampil form untuk menentukan koneksi kedatabase yang kita

gunakan. Isikan Nama dari koneksi yang kita buat misalkan koneksi_dbs_penjualan

pada textbox “Name”, Pada combobox JDBC driver pilihlah driver yang sesuai untuk

koneksi ke database anda disini penulis menggunakan koneksi ke database mysql

maka kita pilih “MySQL(com.mysql.jdbc.Driver)” pada combobox tersebut. Pada

textbox JDBC URL anda hanya disarankan untuk mengganti “Database Name” nya

saja misalkan “jdbc:mysql://localhost/dbs_penjualan”. Selanjutnya pada textbox

Username dan password isikan username & password anda yang telah ada / dibuat di

database mysql untuk masuk kedatabase yang ingin anda buat koneksi, oleh karena

penulis tidak menggunakan password untuk koneksi kedatabase maka kita cukup

memberikan Usernamenya saja (root). Lanjutkan dengan menekan Test untuk

melakukan pengecekan koneksi kedatabase.

Gambar 5 : Form pengisian nama koneksi, driver, url dan autentifikasi user

Maka akan tampil dialog pengisian password, olehkarena penulis tidak menggunakan

password untuk koneksi ke database maka klik saja OK tanpa mengisi password. Jika

tampil pesan “Connection test succesful!” maka koneksi telah berhasil dilakukan.

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 4

Klik OK dan klik save untuk menyimpan dan mengakhiri konfigurasi koneksi ke

database.

Gambar 6 : Pengujian koneksi ke database

Maka secara otomatis pada combobox data source akan diarahkan pada koneksi yang

telah kita buat tadi “koneksi_dbs_penjualan”

Gambar 7 : Pembuatan koneksi ke database telah berhasil

Pada tahap ini persiapan telah selesai kita lakukan, selanjutnya akan kita lanjutkan dengan

merancang laporan.

2. Perancangan Laporan Daftar Barang

Adapun langkah – langkah yang untuk merancang laporan adalah sebagai berikut :

Pada menu File Klik New untuk membuat project laporan baru yang akan kita buat. Maka

akan tampil wizard untuk membuat laporan anda !

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 5

Gambar 8 : Pemilihan Template Laporan

Pilihlah template laporan yang anda sukai, klik “open this Template” untuk membuka

template yang telah kita pilih. Maka akan muncul kotak pengisian name and location output

project anda.

Gambar 9 : Memberikan Nama Report dan lokasi !

Catatan : Pada textbox location arahkan penyimpanan laporan anda pada folder project

netbeans anda dengan mengklik Browse, contoh

“C:\Users\Depandi\Documents\NetbeansProjects\Aplikasi Toko Komputer\src\report”.

Kemudian Klik Next dan Finish

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 6

Akan tampil area desain laporan anda seperti gambar dibawah ini !

Gambar 10 : Tampilan awal desain report baru

Pada bagian Report Inspector Klik Kanan Laporan_Daftar_Barang, seperti gambar dibawah

ini ! kemudian pilih Edit Query.

Gambar 11 : Memasukkan Query

Maka akan tampil jendela report query pada tab Report Query Masukkan sintak query yang

kita butuhkan untuk merancang sebuah laporan yang diambil dari database yang telah

terkoneksi. Pada contoh ini penulis ingin mengambil data pada tabel barang dengan query :

“select * from tbl_barang” lanjutkan dengan mengklik read fields maka akan timbul

autentifikasi password. Oleh karena penulis tidak menggunakan password pada koneksi ke

database klik ok untuk melanjutkan.

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 7

Gambar 12 : Memasukkan query ke laporan

Pada bagian report inspector klik bagian Fileds maka akan tampil beberapa fields yang telah

diimport pada tabel yang kita includekan.

Gambar 13 : Nama-nama field yang telah diimport dari tabel

Pada bagian desainer silahkan tarik garis-garis halus yang membatasi setiap bagian laporan

hingga menjadi sepert tampilan dibawah ini :

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 8

Gambar 14 : Pengaturan Layar Kerja Laporan

Rancanglah laporan anda seperti tampilan berikut dengan mengambil komponen Static Text,

Text Field, Rectangle dan Image pada bagian kiri palette :

Gambar 15 : Layar Kerja Laporan

Untuk memasukkan isi dari text field silahkan anda drag field yang ada pada Field di report

inspector ke dalam lembar kerja. Maka otomatis fied tersebut akan muncul beserta static

textnya

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 9

Gambar 16 : Field yang telah diincludekan pada laporan

Silahkan anda atur sedemikian rupa hingga tampilan akhirnya seperti berikut :

Gambar 17 : Desain Laporan

Jika perancangan laporan sudah benar maka akan tampil preview Laporan Daftar Barang

sebagai berikut :

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 10

Gambar 18 : Preview Laporan

Pada tahapan ini perancangan laporang di iReport telah selesai. Setelah perancangan laporan

di iReport selesai maka kita akan melakukan konfigurasi project netbeans kita dengan

laporan yang telah kita buat.

3. Konfigurasi project netbeans ke laporan daftar barang.

Adapun langkah-langkah untuk mengkonfigurasi project netbeans anda ke laporan daftar

barang yang telah anda buat adalah sebagai berikut :

Buka project netbeans anda, disini penulis menggunakan project “Aplikasi Toko

Komputer”

Gambar 19 : Project Aplikasi di Editor Netbeans

Klik kanan pada project yang anda buat klik properties

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 11

Gambar 20 : Pengaturan Libraries Project

Maka akan tampil tampilan seperti berikut klik Libraries untuk menambahkan libraries

dalam project anda.

Gambar 21 : Penambahan File yang Dibutuhkan Untuk Menjalankan Laporan

Pada Libraries klik button Add Jar Folder maka akan tampil jendela browse untuk

menambahkan file eksternal yang dibutuhkan untuk menjalankan laporan yang telah anda

buat

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 12

Gambar 22 : Alamat Directory File yang Dibutuhkan

Arahkan pada directory dengan alamat seperti gambar diatas “C:\Program

Files\Jaspersoft\iReport-5.1.0\ireport\modules\ext” tambahkan beberapa file dengan

nama "commons-beanutils-1.8.2.jar" "commons-collections-3.2.1.jar" "commons-

digester-2.1.jar" "commons-javaflow-20060411.jar" "commons-logging-1.1.jar" "groovy-

all-2.0.1.jar" "jasperreports-5.1.0.jar" "jasperreports-extensions-3.5.3.jar" "jdt-compiler-

3.1.1.jar" "log4j-1.2.15.jar". Jika telah ditambahkan maka file-file tersebut akan

digunakan untuk mengkonfigurasi dalam membuka laporan. Klik OK untuk

menyelesaikan konfigurasi.

Gambar 23 : File yang Telah Ditambahkan di Libraries Project Anda

Setelah menambahkan file-file eksternal yang dibutuhkan hal selanjutnya yang harus

dilakukan adalah menambahkan potongan source code (methode) untuk mencetak

laporan daftar barang.

Komponen yang dibutuhkan :

1 buah button dengan nama “btnCetak”

Source Code (Metode) untuk mencetak laporan :

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 13

private void cetak_laporan(){

try{

Var.koneksi();

HashMap map = new HashMap();

try{

JasperPrint jasperPrint =

JasperFillManager.fillReport("src/report/Laporan_Daftar_Barang.jas

per", map, Var.con);

JasperViewer jasperViewer = new JasperViewer(jasperPrint, false);

jasperViewer.setTitle("Laporan Daftar Barang");

jasperViewer.setVisible(true);

}catch (Exception e){

System.out.println("Report gagal ditampilkan disebabkan : " + e);

}

}catch (Exception e){

System.out.println(e);

}

/* event yang terjadi pada saat btnCetak di lakukan pengklikan maupun enter

*/

private void btnCetakActionPerformed(java.awt.event.ActionEvent evt) {

cetak();

}

Klik btn cetak untuk menguji laporan yang telah anda buat. Jika berhasil maka akan

tampil laporan yang telah anda buat tadi di editor netbeans project, seperti dibawah ini.

Gambar 24 : Preview Laporan Daftar Pelanggan

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 14

B. Membuat Laporan Dengan Menggunakan Parameter Inputan

Laporan dengan menggunakan parameter inputan merupakan sebuah laporan yang

memiliki filterisasi terhadap data yang akan di tampilkan dalam membentuk sebuah laporan.

1. Laporan Berdasarkan Filterisasi Transaksi Nama Pelanggan

Laporan ini digunakan untuk memberikan informasi mengenai transaksi pelanggan yang

telah melakukan transaksi di toko, sehingga pihak manajemen dan pihak lainnya yang

membutuhkan informasi mengenai transaksi pelanggan bisa didapatkan dan diakses dengan

mudah menggunakan aplikasi yang telah dirancang.

Berikut langkah – langkah untuk membuat laporan berdasarkan filterisasi transaksi nama

pelanggan :

1. Rancanglah sebuah laporan baru dengan nama “Laporan Nama Pelanggan”. Langkah-

langkah untuk membuat laporan sama halnya dengan prosedur yang telah dijelaskan

sebelumnya. Sehingga hasil akhir perancangan layout laporan seperti ini.

Gambar 25 : Perancangan Laporan

Catatan : Untuk mencari Total dari Sub Total adalah dengan menambahkan variabel baru

yang bernama “vTotal” dengan cara sebagai berikut :

o Pada bagian Report Inspector Klik kanan pada Variables, klik Add Variables rubah

nama variabel yang baru dibuat tersebut dengan nama “vTotal”

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 15

Gambar 26 : Membuat Variabel “vTotal”

o Klik pada variabel “vTotal” maka akan tampil jendela “vTotal Properties” disebelah

kanan sudut bawah.

o Pada pilihan combo box Variables Class pilih type variable “java.lang.Double”

o Pada pilihan combo box Calculation pilih type “Sum”

o Pada pilihan Reset Type pilih Coloumn

o Pada pilihan Variable Expression pilih $F{SUB_TOTAL} seperti gambar dibawah

ini, klik OK untuk menyimpan settingan.

Gambar 27 : Pengaturan Variabel “vTotal”

Pada tahapan ini proses perancangan laporan dengan menggunakan parameter input telah

selesai dikerjakan.

2. Setelah proses perancangan selesai langkah selanjutnya ialah memberikan 2 buah parameter

inputan yang akan dijadikan kondisi untuk memfilterisasi data laporan anda. Langkahnya

adalah sebagai berikut :

Pada bagian Report Inspector klik kanan Parameter kemudian klik add parameter

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 16

Gambar 28 : Menambahkan Parameter

Maka akan tampil parameter baru dengan nama parameter1. Ubahlah nama parameter

tersebut menjadi “pNamaPelanggan” dengan mengklik rename. Lakukan hal yang

sama untuk membuat parameter “pTanggalTransaksi”.

Gambar 29 : Membuat Parameter Inputan

Hasil akhir pembuatan parameter inputan laporan :

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 17

Gambar 30 : Parameter Inputan Nama Pelanggan dan Tanggal Transaksi

3. Langkah selanjutnya ialah merubah query yang kita gunakan, dengan menambahkan 2 buah

parameter inputan sebagai parameter untuk memfilterisasi terhadap data yang ingin

ditampilkan. Querynya dapat dilihat sebagai berikut :

Gambar 31 : Pengeditan Query dengan menambahkan parameter inputan

Pada query yang diblok terdapat nama pelanggan dan tanggal transaksi diperoleh dari 2 buah

parameter inputan yang telah kita buat tadi untuk memfilterisasi data laporan. Klik OK untuk

merubah query.

Setelah itu lakukan privew terhadap laporan yang anda buat dengan mengklik preview. Maka

akan tampil kotak dialog pengisian parameter inputan yang anda buat tadi secara berurutan.

Isikan textbox pengisian parameter “pNamaPelanggan” misalnya “Agus” Klik OK untuk

melanjutkan.

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 18

Gambar 32 : Pengisian parameter Nama Pelanggan

Setelah pengisian parameter “pNamaPelanggan” maka akan tampil kotak dialog selanjutnya

untuk pengisian parameter “pTanggalTransaksi” isikan misalnya “08/06/2013”. Klik OK

untuk melanjutkan.

Gambar 32 : Pengisian parameter Tanggal Transaksi

Pada pengisian dialog password isikan password jika anda memakai autentifikasi password

untuk terkoneksi ke database, jika tidak memerlukan password klik ok saja tanpa mengisikan

password. Maka akan tampil preview “Laporan Nama Pelanggan” seperti berikut :

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 19

Gambar 33 : Preview Laporan Berdasarkan Nama Pelanggan

4. Sekarang pengerjaan laporan di iReport telah selesai di kerjakan lanjutkan dengan

menuliskan Source Code (metode cetak) untuk melakukan pencetakan laporan dengan

parameter input.

Komponen yang dibutuhkan ialah :

1 buah button dengan nama “btnCetak”

Source Code (Metode) untuk mencetak laporan :

Var.l = JOptionPane.showInputDialog(this, "Silahkan Masukkan Nama

Pelanggan", "Nama Pelanggan",JOptionPane.OK_CANCEL_OPTION);

try{

if(Var.l.length()>0){

Var.m = JOptionPane.showInputDialog(this,"Silahkan Masukkan

Tanggal Transaksi, Format (dd/mm/yyyy) !", "Tanggal Transaksi

Pelanggan",JOptionPane.OK_CANCEL_OPTION);

if(Var.m.length()>0){

Var.koneksi();

try {

HashMap map = new HashMap();

map.put("pNamaPelanggan", Var.l);

map.put("pTanggalTransaksi", Var.m);

try {

JasperPrint jasperPrint =

JasperFillManager.fillReport("src/report/Laporan_Nama_Pelanggan.jasper

", map, Var.con);

JasperViewer jasperViewer = new JasperViewer(jasperPrint, false);

jasperViewer.setTitle("Transaksi Penjualan Berdasarkan Nama

Pelanggan");

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 20

jasperViewer.setVisible(true);

jasperViewer.setFitPageZoomRatio();

} catch (Exception e) {

System.out.println("Report gagal ditampilkan disebabkan : " + e);

}

} catch (Exception e) {

System.out.println(e);

}

}else{

JOptionPane.showMessageDialog(this, "Tanggal Transaksi Masih Kosong,

Silahkan di isi !");

}

}else{

JOptionPane.showMessageDialog(this, "Nama Pelanggan Masih Kosong,

Silahkan di isi !");

}

}catch(NullPointerException e){

System.out.println("Anda membatalkan perintah");

}

Pada saat button cetak diklik maka akan menampilkan kotak/form dialog untuk

memasukkan nama pelanggan, masukkan nama pelanggan “Agus” Klik OK

Gambar 34 : Pengisian parameter Nama Pelanggan

Setelah pengisian nama pelanggan dimasukkan untuk selanjutnya akan menampilkan

form dialog yang kedua anda diminta untuk memasukkan tanggal transaksi dari nama

pelanggan atas nama “Agus” yang terjadi pada tanggal “08/06/2013”. Klik OK untuk

melanjutkan.

Java Desktop Application

Pemrogram Berorientasi Objek I –2013 Hal 21

Gambar 35 : Pengisian parameter Tanggal Transaksi

Setelah mengisikan data dengan benar maka akan menampilkan laporan berdasarkan

nama pelanggan.

Gambar 36 : Laporan Berdasarkan Nama Pelanggan