Modul Pemrograman Visual 1 2011

MODUL KULIAH PEMROGRAMAN VISUAL 1
Disusun Oleh : RONNY FASLAH, S.KOM
LABORATORIUM KOMPUTER BISNIS POLITEKNIK NEGERI BANJARMASIN JURUSAN ADMINISTRASI BISNIS BANJARMASIN 2009
Pemrograman Visual 1 Ronny Faslah - 2010 1
DAFTAR ISI
DAFTAR ISI ..................................................................... 2 ATURAN PENGERJAAN LATIHAN .................................................. 4 PENILAIAN ..................................................................... 4 DAFTAR SHORTCUT ................................................................ 4 IDE DELPHI ..................................................................... 5 PROPERTY DAN EVENT ............................................................ 8 VARIABEL, PROCEDURE DAN FUNCTION....................................... 15 Latihan Latihan Latihan Latihan Latihan Latihan Latihan Latihan Latihan Latihan Latihan Latihan Latihan Latihan Latihan Latihan 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 : : : : : : : : : : : : : : : : Hello World! .................................................... 18 Kalkulator ....................................................... 20 Kalkulator Lagi! ................................................ 23 Tugas 1 .......................................................... 24 Curriculum Vitae ............................................... 25 Gaji Karyawan .................................................. 29 Discount! ........................................................ 32 Tarif Operator Telekomunikasi .............................. 33 Horoscope ....................................................... 35 Jangan bilang siapa-siapa! ................................... 38 Listrik Untuk Kehidupan yang Lebih Baik .................. 39 Grafik ............................................................ 42 Data Pegawai ................................................... 48 Music Player .................................................... 55 Text Editor ...................................................... 65 Image Viewer ................................................... 73
PROYEK SISTEM INFORMASI RENTAL VCD/DVD ............................... 84 Latihan 17 : Membuat Database Rental .................................... 86 Latihan 18 : Membuat Form Utama ........................................ 92 Latihan 19 : Membuat Form Login .......................................... 99 Latihan 20 : Membuat Form Setup ........................................ 104 Latihan 21 : Membuat Form Member ...................................... 107 Latihan 22 : Membuat QuickReport Kartu Member ..................... 118 Latihan 23 : Membuat Form Koleksi ....................................... 122 Latihan 24 : Membuat Form Pemasok ..................................... 133 Latihan 25 : Membuat Form Karyawan.................................... 137 Latihan 26 : Membuat Form Peminjaman ................................ 142 Latihan 27 : Membuat QuickReport Nota Peminjaman ................. 155 Latihan 28 : Membuat Form Pengembalian .............................. 161 Latihan 29 : Membuat QuickReport Nota Pengembalian ............... 173 Latihan 30 : Membuat Form Daftar Member ............................. 180 Latihan 31 : Membuat Form Daftar Koleksi .............................. 187 Latihan 32 : Membuat Form Statistik ..................................... 195 Latihan 33 : Membuat Form Laporan Peminjaman ...................... 207 Latihan 34 : Membuat QuickReport Laporan Peminjaman ............. 214 Latihan 35 : Membuat Form Laporan Pengembalian .................... 219
Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34
Latihan Latihan Latihan Latihan Latihan Latihan
36 37 38 39 40 41
: : : : : :
Membuat QuickReport Laporan Pengembalian ........... 226 Membuat Form Laporan Koleksi Belum Kembali ......... 231 Membuat QuickReport Laporan Koleksi Belum Kembali. 237 Membuat Form Laporan Pendapatan ...................... 243 Membuat Form About ........................................ 250 Membuat Form Splash ........................................ 253
FREQUENTLY ASK QUESTION (FAQ)........................................... 255
ATURAN PENGERJAAN LATIHAN

1. Baca petunjuk dengan seksama. 2. Kerjakan latihan sesuai dengan urutan langkah-langkah yang tertulis. Pastikan setiap langkah tidak tertinggal atau terlewat dikerjakan. 3. Setelah mengetikkan perintah biasakan menekan Ctrl+F9 untuk mengcompile dan mengecek kesalahan penulisan perintah. 4. Simpan masing-masing latihan dalam folder yang terpisah. 5. Simpanlah pekerjaan Anda secara regular untuk mencegah kehilangan data akibat mati lampu. 6. Segera minta penjelasan kepada dosen/instruktur apabila ada yang tidak dimengerti. 7. Segera lapor kepada dosen/instruktur apabila aplikasi sudah berjalan dengan benar untuk mendapatkan penilaian hasil latihan.
PENILAIAN
Keterangan Selesai Pertamakali Selesai Kedua dst. Hadir tapi tidak selesai Izin/Sakit/Alpa 70 0 Min Max 100 85 75 65 Status Lulus Tidak Lulus Nilai 66 - 100 0 - 65
DAFTAR SHORTCUT
Shortcut Ctrl+F9 F9 Keterangan Compile atau pengecekan kesalahan Run, menjalankan aplikasi. Untuk menutup aplikasi yang sedang berjalan tekan Ctrl+F4. Ctrl+F2 Program Reset, kalau terjadi kesalahan. Ctrl+Shift+S Save All, menyimpan project dan semua unit. F11 Menampilkan Object Inspector. F12 Menampilkan Form Designer atau Unit Editor. Ctrl+F12 Menampilkan Unit Editor Shift+F12 Menampilkan Form Designer. F7 / F8 Trace, menelusuri jalannya aplikasi. F5 Watch, mengamati perubahan variable. Ctrl+Alt+F11 Menampilkan Project Manager.
Pemrograman Visual 1 Ronny Faslah - 2010
IDE DELPHI
Integrated Development Environment (IDE)
Delphi merupakan aplikasi pengembangan system informasi dalam lingkungan visual yang terintegrasi. Delphi mempunyai code editor, compiler dan debugger yang terintegrasi bahkan Delphi juga mendukung berbagai platform system database.
Berikut adalah bagian-bagian dalam IDE Delphi :

1. Menu
2. Toolbar
3. Tab Komponen / Component Pallette
4. Form Editor
5. Code Editor
6. Object TreeView
7. Object Inspector
PROPERTY DAN EVENT

Property
1. Dalam modul ini perubahan property komponen dituliskan dalam bentuk table seperti ini :
Komponen Label1 GroupBox1 Label2 Edit1 Label1, Label2
Tab Standard Standard Standard Standard
Parent Form1 Form1 GroupBox1 GroupBox1
Property Font.Color Font.Style.fsBold Caption Caption Text Font.Style.fsItalic
Value clBlack True Departemen Bagian True
a. Kolom Komponen menyatakan komponen yang akan diubah propertynya, jadi pastikan komponen tersebut telah terpilih dengan benar. b. Kolom Tab menyatakan dimana komponen tersebut berada dalam komponen palet, pada contoh di atas komponen Label terdapat dalam tab Standard. c. Kolom Parent menyatakan dimana komponen tersebut harus diletakkan. Pada contoh di atas Label1 dan GroupBox1 diletakkan di Form1 sedangkan Label2 dan Edit1 harus diletakkan di dalam GroupBox1. d. Kolom Property menunjukkan property atau subproperty apa yang harus diubah. Property suatu komponen ditampilkan dalam Object Inspector. e. Kolom Value menunjukkan nilai yang harus dipilih, diubah atau diisikan pada property yang bersangkutan. f. Apabila dalam kolom Komponen terdapat lebih dari satu komponen ditulis bersamaan, hal ini berarti komponen-komponen tersebut harus dipilih baru diubah nilai propertynya. Pada contoh table di atas (baris ke lima), pilih Label1 dan Label2 kemudian ubah nilai property Font.Style.fsItalic menjadu True. 2. Untuk menambahkan komponen ke dalam suatu form, pilih tab dimana komponen berada.
Arahkan kursor mouse di atas komponen, tunggu beberapa saat untuk menampilkan nama komponen. Kemudian lakukan salah satu langkah berikut untuk menambahkan komponen ke Form : a. Klik dua kali komponen yang dipilih. Delphi akan menambahkan komponen tersebut pada tengah-tengah form. b. Klik komponen yang akan ditambahkan, klik di form untuk menambahkan. Delphi secara otomatis akan menampilkan komponen dalam ukuran default, jadi tidak perlu didrag seperti pada aplikasi Visual Basic. 3. Sebelum mengubah property suatu komponen, pastikan komponen tersebut sudah dipilih dengan benar. Untuk memilih komponen lakukan salah satu cara di bawah ini : a. Langsung dipilih pada form.
b. Memilih melalui Object TreeView.
c. Memilih melalui Object Inspector.
4. Sedapat mungkin pilih nilai property dari pilihan yang tersedia.

Komponen Form1 Tab Parent Property Position Value poDesktopCenter
5. Tanda + di depan nama property menunjukkan adanya subproperty dibawahnya, klik tanda + untuk membuka subproperty.
Komponen Label1 Tab Standard Parent Form1 Property Font.Color Font.Style.fsBold Value clBlack True
10
6. Tombol Ellipsis [] pada property menunjukkan adanya wizard atau jendela untuk pengisian nilai property. Klik tombol ellipsis untuk membuka jendela wizard.
11
7. Khusus property warna, warna yang ditampilkan dalam pilihan adalah warna-warna standard ditambah dengan warna yang berlaku pada color scheme windows. Untuk membuat warna baru, klik dua kali pada nilai warna di Object Inspector untuk membuka jendela warna.
Klik tombol Define Custom Color, atur level Hue, Sat dan Lum atau atur level Red, Green dan Blue. Klik Add to Custom Color, klik OK untuk melanjutkan.
12
Hue Sat Lum
Events
1. Setiap komponen mempunyai event masing-masing. Event terletak pada tab Event di Object Inspector.
2. Event merupakan procedure standard yang digunakan untuk memberikan reaksi terhadap suatu tindakan user, misalkan event OnClick merupakan reaksi yang akan kita berikan apabila user mengklik suatu object. 3. Untuk membuat event, pilih komponen, klik tab Event pada Object Inspector, klik dua kali di samping kanan nama event untuk membuka jendela editor, ketikkan perintah diantara blok begin .. end.
13
Tugas :
1. Buat program sederhana untuk memasukkan Nama, Tempat Lahir, Tanggal Lahir, Agama, Pendidikan Terakhir, Alamat, dan Kota. Lakukan pengujian untuk Nama, Tanggal Lahir, Alamat dan Kota wajib diisi. 2. Tugas dikumpul pada pertemuan teori berikutnya!
14
VARIABEL, PROCEDURE DAN FUNCTION

Deklarasi Variabel
1. Setiap variable yang digunakan dalam aplikasi harus dideklarasikan berikut dengan type datanya. 2. Variabel dapat dideklarasikan pada berbagai level antara lain : a. Pada Local Procedure, variable yang dideklarasikan pada level ini hanya dikenali pada procedure atau function ini saja. Pada gambar di bawah ini, variable I hanya bisa dipakai pada procedure tersebut.
b. Pada blok Private, variable yang dideklarasikan pada level ini hanya akan dikenali oleh semua procedure/function yang ada pada Unit tersebut. Pada gambar berikut, variable I hanya bisa dipakai dalam procedure/function di dalam Unit2.
15
c. Pada blok Public, variable yang dideklarasikan pada blok ini bisa dikenali oleh procedure/function yang ada di dalam Unit yang sama dan Unit lain yang menggunakan Unit tersebut. Pada gambar berikut, variable I bisa dipakai baik oleh Unit2 maupun Unit1.
Membuat Procedure atau Function

1. Procedure merupakan pengelompokan perintah untuk membuat program lebih mudah dibaca, dipahami atau dimodifikasi. 2. Function sama seperti procedure akan tetapi mempunyai nilai hasil (result value). 3. Dalam Delphi, Event selalu dibuat dalam bentuk procedure, sedangkan function terdapat dalam method yang dimiliki oleh suatu komponen.
4. Seperti halnya variable, procedure atau function juga harus dideklarasikan. Deklarasi procedure meliputi nama procedure dan parameter yang akan digunakan, sedangkan function meliputi nama function, parameter dan type data yang akan dihasilkan.
16
5. Procedure dan Function dapat dideklarasikan pada blok Private, Public atau pada local procedure/function lain. 6. Untuk membuat procedure/function pada blok Private/Public, ketikkan kata [procedure][function] diikuti nama procedure/function yang akan dibuat.
Tekan tombol Ctrl+Shift+C procedure/function.
di
keyboard
untuk
membuat
blok
Ketikkan perintah/statement diantara blok Begin..End.
17
Latihan 1 : Hello World!
Membuat aplikasi untuk menampilkan input nama dan alamat. Apabila tombol submit ditekan, kalau nama dan alamat diisi maka tampilkan pesan Terima Kasih jika tidak maka tampilan pesan Nama dan Alamat harus diisi. Langkah-langkah : 1. Klik Start All Programs Borland Delphi 6 Delphi 6 untuk menjalankan Borland Delphi 6. 2. Pilih Form1 pada Object TreeView, ubah property seperti pada table di bawah ini :
Komponen Form1 Tab Parent Property Caption Name Position Value Latihan 1 FLatihan1 poDesktopCenter
3. Klik menu File Save All untuk menyimpan project, simpan Unit1 menjadi UFLatihan1.pas dan Project1 menjadi Latihan1.dpr. Simpan dalam folder Latihan1. 4. Tambahkan 2 buah Label, 2 buah Edit dan 1 buah Button dari tab Standard ke dalam FLatihan1, atur property seperti table di bawah ini :
Komponen Label1 Tab Standard Parent FLatihan1 Property Caption Font.Color Font.Style Caption Font.Color Font.Style Text Text Caption Value Nama clRed [fsBold, fsItalic] Alamat clBlue [fsBold, fsItalic]
Label2
Standard
FLatihan1
Edit1 Edit2 Button1
Standard Standard Standard
FLatihan1 FLatihan1 FLatihan1
Submit
5. Atur layout Form1 seperti gambar di bawah ini :
6. Pilih Button1 pada Object TreeView, klik tab Event pada Object Inspector, klik dua kali event onClick untuk membuka jendela editor. Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34 18
7. Ketikkan perintah berikut pada blok procedure yang baru dibuat.

Komponen Button1 Event OnClick Code procedure TForm1.Button1Click(Sender: TObject); begin If (Edit1.Text <> '') And (Edit2.Text <> '') then MessageDlg('Terima Kasih', mtInformation, [mbOK], 0) Else MessageDlg('Nama dan Alamat Harus Diisi', mtError, [mbOK], 0); end;
8. Tekan Ctrl + F9 untuk compile, atau F9 untuk menjalankan. 9. Simpan hasil pekerjaan dengan langkah sebagai berikut : a. Buat folder dengan nama Latihan1. b. Klik File Save All. c. Ganti nama file Unit1 menjadi ULatihan1.Pas, klik Save untuk menyimpan unit tersebut. d. Ganti nama file Project1 menjadi Latihan1.dpr, klik Save untuk menyimpan project tersebut.
19
Latihan 2 : Kalkulator
Membuat aplikasi kalkulator sederhana untuk operasi pembagian.
Langkah-langkah : 1. Klik File New Application untuk membuat aplikasi baru. 2. Ubah property Form1 seperti table di bawah ini :
Komponen Form1 Tab Parent Property Caption Name Position Value Latihan 2 FLatihan2 poDesktopCenter
3. Tambahkan 3 buah Label dan 3 buah Edit dari tab Standard, atur property 4. Tambahkan komponen pada form untuk membuat tampilan seperti di bawah ini :
5. Ubah property komponen berikut ini pada saat runtime melalui event OnCreate Form1 (lihat Latihan 1 point 3) :
Komponen Form1 Tab Parent Property Caption Name Position Caption Caption Caption Text Value Latihan 2 FLatihan2 poDesktopCenter Bilangan 1 Bilangan 2 Hasil 0
Label1 Label2 Label3 Edit1
Standard Standard Standard Standard
Form1 Form1 Form1 Form1
20
Edit2 Edit3 Button1
Standard Standard Standard
Form1 Form1 Form1
Text Text Caption
0 0 Bagi
6. Buat event OnClick pada Button1 :

Komponen Button1 Event OnClick Code procedure TFLatihan2.Button1Click(Sender: TObject); Var X, Y : Integer; Z : Real; begin X := strtoint(Edit1.Text); Y := strtoint(Edit2.Text); Z := X / Y; Edit3.Text := Floattostr(Z); end; procedure TFLatihan2.Edit1KeyPress(Sender: TObject; var Key: Char); begin if not (Key in ['0'..'9','.',#8]) then Key := #0; end;
Edit1 Edit2
OnKeyPress
7. Tekan F9 untuk menjalankan. 8. Apabila aplikasi dijalankan dan bilangan kedua diisi dengan 0 maka akan terjadi muncul pesan error Floating Point Division by Zero atau error karena adanya pembagian dengan angka 0. Untuk memperbaiki hal tersebut ubah event OnClick Button1 seperti di bawah ini :
Komponen Button1 Event OnClick Code procedure TFLatihan2.Button1Click(Sender: TObject); Var X, Y : Integer; Z : Real; begin X := strtoint(Edit1.Text); Y := strtoint(Edit2.Text); If Y <> 0 then Begin Z := X / Y; Edit3.Text := Floattostr(Z); End Else ShowMessage('Bilangan 2 = 0'); end;
9. Untuk melakukan formatting bilangan real pada hasil pembagian dapat digunakan fungsi FormatFLoat(Format, Bilangan), ubah event OnClick Button1 menjadi :
Komponen Button1 Event OnClick Code procedure TFLatihan2.Button1Click(Sender: TObject); Var X, Y : Integer; Z : Real;
21
begin X := strtoint(Edit1.Text); Y := strtoint(Edit2.Text); If Y <> 0 then Begin Z := X / Y; Edit3.Text := FormatFLoat(0.00, Z); End Else ShowMessage('Bilangan 2 = 0'); end;
10. Simpan dalam folder Latihan 2, ubah nama Unit1 menjadi ULatihan2.pas dan Project1 menjadi Latihan2.dpr (lihat Latihan 1 point 6).
22
Latihan 3 : Kalkulator Lagi!
Melengkapi kalkulator pada latihan 2 dengan menambahkan button untuk operasi Kali, Tambah dan Kurang.
Langkah-langkah : 1. Tambahkan 3 button untuk operasi Kali, Tambah dan Kurang. 2. Buat event OnClick pada masing-masing button yang baru ditambahkan (lihat Latihan 2 point 4). 3. Simpan dalam folder Latihan 3. 4. Bandingkan jawaban Anda dengan jawaban pada bagian akhir modul ini.
23
Latihan 4 : Tugas 1
24
Latihan 5 : Curriculum Vitae
Membuat aplikasi untuk memasukkan data Riwayat Hidup Karyawan. Langkah-langkah : 1. Buat aplikasi baru (lihat Latihan 2 point 1). 2. Tambahkan komponen pada Form1, ubah property masing-masing komponen seperti pada table di bawah ini :
3. Buat event OnCreate pada Form1, ubah property masing-masing komponen seperti pada table di bawah ini. Listing program dapat dilihat pada table di bawahnya, perhatikan cara mengisikan items pada Combobox1 dan ListBox1.
Komponen Form1 Tab Parent Property Caption Name Position BorderStyle Caption Alignment Font.Name Font.Size Caption Caption Value Latihan 5 FLatihan3 poDesktopCenter bsSingle Daftar Riwayat Hidup taCenter Trebuchet MS 18 Nama Tempat, Tanggal Lahir
Label1
Standard
Form1
Label2 Label3
Standard Standard
Form1 Form1
25
Komponen DateTimePicker1 Label4 RadioButton1 RadioButton2 Label5 Combobox1
Tab Win32 Standard Standard Standard Standard Standard
Parent Form1 Form1 Form1 Form1 Form1 Form1
Property Date Caption Caption Caption Caption Items
Label6 ListBox1
Standard Standard
Form1 Form1
Style Caption Items
Label7 Label8 Edit3 Button1 Button2 Button3
Standard Standard Standard Standard Standard Standard
Form1 Form1 Form1 Form1 Form1 Form1
Sorted Caption Caption MaxLength Caption Caption Caption
Value Now Jenis Kelamin Pria Wanita Agama Islam Katolik Protestan Hindu Budha csDropDownList Pekerjaan PNS Swasta TNI/Polri Petani/Nelayan Lainnya True; Alamat Kodepos 5 Save Reset Close
Komponen FLatihan3
Event OnCreate
Code procedure TFLatihan3.FormCreate(Sender: TObject); begin Caption := 'Latihan 5'; Position := poDesktopCenter; BorderStyle := bsSingle; Label1.Caption := 'Daftar Riwayat Hidup'; Label1.Alignment := taCenter; Label1.Font.Name := 'Trebuchet MS'; Label1.Font.Size := 18; Label2.Caption := 'Nama'; Label3.Caption := 'Tempat, Tanggal Lahir'; //Menampilkan tanggal sekarang. DateTimePicker1.Date := Now; Label4.Caption := 'Jenis Kelamin'; RadioButton1.Caption := 'Pria'; RadioButton2.Caption := 'Wanita'; Label5.Caption := 'Agama'; //Menambahkan pilihan pada Combobox1 Combobox1.Items.Add('Islam'); Combobox1.Items.Add('Katolik'); Combobox1.Items.Add('Protestan'); Combobox1.Items.Add('Hindu'); Combobox1.Items.Add('Budha');
26
Combobox1.Style := csDropDownList; Label6.Caption := 'Pekerjaan'; //Menambahkan pilihan pada Listbox1 ListBox1.Items.Add('PNS'); ListBox1.Items.Add('Swasta'); ListBox1.Items.Add('TNI/POLRI'); ListBox1.Items.Add('Petani/Nelayan'); ListBox1.Items.Add('Lainnya'); ListBox1.Sorted := True; Label7.Caption := 'Alamat'; Label8.Caption := 'Kodepos'; Edit3.MaxLength := 5; Button1.Caption := 'Save'; Button2.Caption := 'Reset'; Button3.Caption := 'Close'; //Prosedur untuk mengosongkan form, lihat point 4. ResetForm; End;
4. Buat procedure ResetForm untuk menghapus isian form dengan langkah sebagai berikut : a. Ketikkan procedure ResetForm; pada blok private/public. b. Tekan Ctrl + Shift + C untuk membuat blok procedure. c. Ketikkan statement di bawah ini :
Komponen FLatihan3 Procedure ResetForm Code procedure TFLatihan3.ResetForm; begin Edit1.Text := ''; Edit2.Text := ''; DateTimePicker1.Date := Now; Memo1.Text := ''; Edit3.Text := ''; End;
5. Buat Event On Click untuk Button1, Button2 dan Button3.

Komponen Button1 Event OnClick Code procedure TFLatihan3.Button1Click(Sender: TObject); begin ShowMessage('Terima Kasih ' + Edit1.Text + #13 + 'Anda telah mengisi Daftar Riwayat Hidup'); end; procedure TFLatihan3.Button2Click(Sender: TObject); begin ResetForm end; procedure TFLatihan3.Button3Click(Sender: TObject); begin Application.Terminate; end;
Button2
OnClick
Button3
OnClick
27
6. Tekan F9 untuk menjalankan. 7. Simpan dalam folder Latihan 5.
28
Latihan 6 : Gaji Karyawan
PT. Nusantara Jaya mempunyai 3 Departemen yaitu Administrasi, Keuangan dan Marketing. Untuk jenjang karier karyawan terdapat 4 Golongan yaitu I, II, III, dan IV. Departemen dan Golongan menentukan Gaji Pokok karyawan seperti pada table berikut ini :
Administrasi Keuangan Marketing I 750000 1000000 1250000 II 1000000 1250000 1500000 III 1250000 1500000 1750000 IV 1500000 1750000 2000000
Hanya Karyawan pria yang menikah mendapatkan Tunjangan Istri dan Tunjangan Anak. Tunjangan Istri sebesar 10% dari Gaji Pokok. Tunjangan Anak dihitung berdasarkan jumlah anak dengan aturan maksimal 2 anak yang diperhitungkan sebesar 5% dari Gaji Pokok. Total Gaji adalah gabungan Gaji Pokok, Tunjangan Istri dan Tunjangan Anak. Langkah-langkah : 1. Buat aplikasi baru (lihat Latihan 2 point 1), tambahkan komponen dan atur tata letaknya seperti gambar di bawah ini :
29
2. Ubah property masing-masing komponen seperti pada table di bawah ini, lakukan perubahan menggunakan metode Design Time yaitu langsung melakukan perubahan nilai property pada Object Inspector :
Komponen Form1 Tab Property Caption Name Position Color Caption Font.Style Caption Caption Caption Caption Caption Caption Caption Caption Caption Caption Items Value Latihan 6 FLatihan6 poDesktopCenter $00FF80FF PERHITUNGAN GAJI KARYAWAN [fsBold] Nama Departemen Golongan Jenis Kelamin Status Jumlah Anak Gaji Pokok Tunjangan Istri Tunjangan Anak Total Gaji Administrasi Keuangan Marketing csDropDownList I II III IV Pria Wanita Menikah 10 Hitung Reset Close
Label1 Label2 Label3 Label4 Label5 Label6 Label7 Label8 Label9 Label10 Label11 Combobox1
Standard Standard Standard Standard Standard Standard Standard Standard Standard Standard Standard Standard
ListBox1
Style Items
RadioButton1 RadioButton2 CheckBox1 SpinEdit1 Button1 Button2 Button3
Standard Standard Standard Samples Standard Standard Standard
Caption Caption Caption MaxValue Caption Caption Caption
3. Buat event On Click untuk Button1, Button2, Button3 :

Komponen Button1 Event OnClick Code procedure TFLatihan6.Button1Click(Sender: TObject); Const GajiPokok : Array [0..2,0..3] of Real = ((750000, 1000000, 1250000, 1500000), (1000000, 1250000, 1500000, 1750000), (1250000, 1500000, 1750000, 2000000)); var GP, TI, TA, TG : Real; begin GP := GajiPokok[Combobox1.ItemIndex,ListBox1.ItemIndex]; TI := 0; TA := 0; TG := 0;
30
Button2
OnClick
Button3
OnClick
If CheckBox1.Checked And RadioButton1.Checked Then Begin TI := GP * 10 /100; If strtoint(SpinEdit1.Text) <= 2 then TA := strtoint(SpinEdit1.Text) * GP * 5/100 Else TA := 2 * GP * 5/100; End; TG := GP + TI + TA; Edit2.Text := FormatFloat(',0', GP); Edit3.Text := FormatFLoat(',0', TI); Edit4.Text := FormatFloat(',0', TA); Edit5.Text := FormatFLoat(',0', TG); end; procedure TFLatihan6.Button2Click(Sender: TObject); begin Edit1.Text := ''; Combobox1.ItemIndex := -1; ListBox1.ItemIndex := -1; CheckBox1.Checked := False; SpinEdit1.Text := '0'; Edit2.Text := '0'; Edit3.Text := '0'; Edit4.Text := '0'; Edit5.Text := '0'; end; procedure TFLatihan6.Button3Click(Sender: TObject); begin Close; end;
4. Tekan F9 untuk menjalankan. 5. Simpan dalam folder Latihan 6, ubah Unit1 menjadi ULatihan6.pas dan ubah Project1 menjadi Latihan6.dpr.
31
Latihan 7 : Discount!
Suatu Departemen Store menetapkan harga berdasarkan jenis kelamin dan ukuran pakaian dengan tabel berikut ini :
Pria Wanita S 50000 45000 M 55000 50000 L 60000 55000
Selain harga, departemen store tersebut juga memberikan discount 10% untuk pelanggan yang terdaftar.
Langkah-langkah : 1. Buat aplikasi baru (lihat Latihan 2 point 1), tambahkan komponen dan atur tata letaknya seperti contoh aplikasi. 2. Buat event onCreate pada Form1 untuk inisialisasi komponen (lihat Latihan 5 point 3 atau Latihan 6 point 2). 3. Buat event onClick untuk Button1, Button2, Button3 (lihat Latihan 6 point 3). Untuk event OnClick Button1, gunakan percabangan If/Then/Else untuk menentukan harga dan discount, total harga = Harga Discount. 4. Save All dalam folder Latihan 7 (lihat Latihan 1 point 6). 5. Bandingkan jawaban Anda dengan jawaban pada bagian akhir modul ini.
32
Latihan 8 : Tarif Operator Telekomunikasi
Setiap operator selular mempunyai beberapa produk yang mempunyai sistem tarif yang berbeda. Contohnya Indosat mempunyai produk Mentari, IM3 dan StarOne. Telkomsel mempunyai produk KartuHalo, Simpati dan As. Mobile 8 mempunyai produk Fren dan Hepi, sedangkan Excelcomindo mempunyai produk Bebas, Jempol dan Xplor. Masing-masing produk mempunyai sistem tarif yang berbeda untuk sesama operator dan ke operator lain seperti pada tabel berikut ini :
Operator Telkomsel Produk KartuHalo Simpati AS Mentari IM3 StarOne Bebas Jempol Xplor Fren Hepi Sesama 100 150 200 150 200 250 200 250 300 250 300 Op. Lain 200 300 400 300 400 500 400 500 600 500 600
Indosat
Excelcomindo
Mobile 8
(Harga hanya rekayasa, bukan yang sebenarnya)
Langkah-langkah : 1. Buat aplikasi baru (lihat Latihan 2 point 1), tambahkan komponen dan atur tata letaknya seperti contoh aplikasi. 2. Isi Property Items Combobox1 dengan nama masing-masing Operator Telekomunikasi. 3. Buat event onChange pada Combobox1 untuk mengisi/mengubah pilihan pada Combobox2. 4. Buat event onChange pada Combobox2 untuk mengisi/mengubah data Tarif ke Sesama dan Ke Operator Lain. 5. Buat event untuk OnClick untuk button1.
33
6. Save All dalam folder Latihan 8 (lihat Latihan 1 point 6). 7. Bandingkan jawaban Anda dengan jawaban pada bagian akhir modul ini.
34
Latihan 9 : Horoscope
Aplikasi ini merupakan ramalan bintang digital, input yang diperlukan adalah nama dan tanggal lahir, kemudian aplikasi akan menampilkan form baru yang berisikan nama zodiac dan ramalannya.
Tanggal Lahir 21 Jan 19 Feb 20 Feb 21 Mar 22 Mar 20 Apr 21 Apr 22 Mei 23 Mei 23 Jun 24 Jun 23 Jul 24 Jul 23 Agt 24 Agt 23 Sep 24 Sep 23 Okt 24 Okt 22 Nop 23 Nop 21 Des 22 Des 20 Jan Zodiac Aquarius Pisces Aries Taurus Gemini Cancer Leo Virgo Libra Scorpio Sagitarius Capricorn Isi Ramalan
Langkah-langkah : 1. Buat aplikasi baru (lihat Latihan 2 point 1), tambahkan komponen dan atur tata letaknya seperti contoh aplikasi.
2. Buat event OnCreate untuk Form1, atur property komponen seperti pada table di bawah ini :
Komponen Form1 Tab Property Caption Name Position Caption Glyph Value Latihan 6 FLatihan9 poDesktopCenter Close C:\Program Files\Common Files\Borland Shared\Images\
SpeedButton1
Additional
35
Komponen
Tab
Property NumGlyphs Flat
Value Buttons\DoorShut.bmp 2 True
Komponen FLatihan9
Event OnCreate
Code procedure TFLatihan9.FormCreate(Sender: TObject); begin SpeedButton1.Caption := 'Close'; SpeedButton1.Glyph.LoadFromFile('C:\Program Files\Common Files\' + 'Borland Shared\Images\Buttons\' + 'Doorshut.Bmp'); SpeedButton1.NumGlyphs := 2; SpeedButton1.Flat := True; //property yang lain atur sendiri ya! end;
3. Buat event onChange dan onUserInput pada komponen DateTimePicker1, untuk merespon perubahan tanggal lahir baik melalui pemilihan di combobox tanggal maupun dengan input langsung.
Komponen DateTimePicker1 Event OnChange Code procedure TForm1.DateTimePicker1Change(Sender: TObject); Const Hari : Array [1..7] of String = ('Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jum''at', 'Sabtu'); Zodiac : Array [1..12] of String = ('Aquarius', 'Pisces', 'Aries', 'Taurus', 'Gemini', 'Cancer', 'Leo', 'Virgo', 'Libra', 'Scorpio', 'Sagitarius', 'Capricorn'); Ramalan : Array [1..12] of String = ('Isi ramalan Aquarius', 'Isi ramalan Pisces', 'Isi ramalan Aries', 'Isi ramalan Taurus', 'Isi ramalan Gemini', 'Isi ramalan Cancer', 'Isi ramalan Leo', 'Isi ramalan Virgo', 'Isi ramalan Libra', 'Isi ramalan Scorpio', 'Isi ramalan Sagitarius', 'Isi ramalan Capricorn'); var Yr, Mn, Dy : Word; Z : Integer; begin //Mengambil nilai Tahun, Bulan dan Tanggal DecodeDate(DateTimePicker1.Date, Yr, Mn, Dy); Case Mn of 1 : Case Dy Of 1..20 : Z := 12; 21..31 : Z := 1; End; 2 : Case Dy Of 1..19 : Z := 1; 20..29 : Z := 2; End; 3 : Case Dy Of 1..21 : Z := 2; 22..31 : Z := 3; End; 4 : Case Dy Of 1..20 : Z := 3; 21..30 : Z := 4; End; 5 : Case Dy Of
36
Komponen
Event
Code 1..22 : Z := 4; 23..31 : Z := 5; End; 6 : Case Dy Of 1..23 : Z := 5; 24..30 : Z := 6; End; 7 : Case Dy Of 1..23 : Z := 6; 24..31 : Z := 7; End; 8 : Case Dy Of 1..23 : Z := 7; 24..31 : Z := 8; End; 9 : Case Dy Of 1..23 : Z := 8; 24..30 : Z := 9; End; 10 : Case Dy Of 1..23 : Z := 9; 24..31 : Z := 10; End; 11 : Case Dy Of 1..22 : Z := 10; 23..30 : Z := 11; End; 12 : Case Dy Of 1..21 : Z := 11; 22..31 : Z := 12; End; End; Edit1.Text := Hari[DayofWeek(DateTimePicker1.Date)]; Edit2.Text := Zodiac[Z]; Memo1.Text := Ramalan[Z]; end; procedure TForm1.DateTimePicker1UserInput(Sender: TObject; const UserString: String; var DateAndTime: TDateTime; var AllowChange: Boolean); begin AllowChange := True; end;
OnUserInput
4. Buat event onClick pada SpeedButton1, untuk menutup aplikasi. 5. Sempurnakan program, jalankan. 6. Simpan dalam folder Latihan 9.
37
Latihan 10 : Jangan bilang siapa-siapa!
Buat program untuk mengubah nilai angka menjadi nilai terbilang. Angka yang dimasukkan maksimal 3 digit. Yang harus dilakukan pertama kali adalah memisahkan angka menjadi angka ratusan (R), puluhan (P) dan satuan (S). Angka := strtoint(Edit1.Text); R := Angka Div 100; 123 Div 100 = 1. P := (Angka Mod 100) Div 10; (123 Mod 100) Div 10 = 23 Div 10 = 2. S := (Angka Mod 100) Mod 10; (123 Mod 100) Mod 10 = 23 Mod 10 = 3.
Langkah-langkah : 1. Buat aplikasi baru (lihat Latihan 2 point 1), tambahkan komponen dan atur tata letaknya seperti contoh di atas. 2. Buat event onCreate pada Form1 untuk inisialisasi komponen. 3. Buat event OnChange pada Edit1 untuk mengupdate perubahan pada Memo1 (terbilang). Gunakan statement Case Of untuk mendefinisikan teks ratusan, puluhan dan satuan. Gunakan operator + untuk menggabungkan teks ratusan, puluhan dan satuan. Gunakan fungsi TrimLeft(teks) untuk membuang spasi berlebih pada awal teks. 4. Simpan dalam folder Latihan 10.
38
Latihan 11 : Listrik Untuk Kehidupan yang Lebih Baik
Buat aplikasi untuk menghitung tarif pemakaian listrik pelanggan berdasarkan table berikut ini :
Golongan Daya (VA) 450 Sosial 900 15000 Biaya Beban (Rp/KVa) 10000
450
11000
Rumah Tangga
900
20000
1300 450 Bisnis 900 1300
30100 23500 26500 28200
Golongan Sosial
Daya (VA) 450
900
Rumah Tangga
450
900
1300
Bisnis
450
900
1300
Blok (KwH) 0 30 31 60 > 60 0 30 31 60 > 60 0 30 31 60 > 60 0 30 31 60 > 60 0 30 31 60 > 60 0 30 31 60 > 60 0 30 31 60 > 60 0 30
Biaya Pemakaian (Rp/Kwh) 123 265 360 200 295 360 169 360 495 275 445 495 385 445 495 254 420 470 420 465 515 470
39
31 60 > 60
473 523
Contoh perhitungan : Misalkan golongan Sosial dengan daya 900 Watt dan jumlah pemakaian 123 Kwh maka : Biaya Beban Biaya Pemakaian 123 = 900 / 1000 * 15000 = 123 * 360 = 13.500,= 44.280,= 57.780,= 1.733,= 59.513,=0 = 59.513,-
Total Biaya Listrik Pajak Penerangan Jalan Umum (3%) Materai Total Tagihan
Catatan : 1. Pajak penerangan jalan umum (PPJU) sebesar 3% dari tagihan listrik. 2. Jika total biaya listrik + PPJU < 250.000 maka Materai = 0, Jika total biaya listrik + PPJU antara 250.000 1.000.000 maka Materai = 3000, Jika total biaya listrik + PPJU > 1.000.000 maka Materai = 6000.
40
Langkah-langkah : 1. Buat aplikasi baru, tambahkan komponen dan atur tata letak komponen seperti contoh. 2. Gunakan struktur data Array untuk menyimpan data Biaya Beban dan Biaya Pemakaian. 3. Buat event onClick pada RadioGroup1 untuk mengupdate perubahan item Daya pada RadioGroup2. 4. Buat event onClick pada Button1 untuk melakukan perhitungan tarif. 5. Uji aplikasi, pilih Golongan, pilih Daya dan isi jumlah pemakaian, klik button hitung untuk melihat hasil perhitungan. 6. Simpan dalam folder Latihan 11.
41
Latihan 12 : Grafik
Membuat berbagai bentuk grafik bentuk dasar dan turunannya. Pada aplikasi juga dapat dipilih warna garis, ketebalan garis, style garis, warna latar dan style latar. Untuk menampilkan grafik digunakan menubar yang menyediakan pilihan tampilan masing-masing bentuk grafik. Grafik ditampilkan pada form terpisah dan terbagi dalam empat buah tabsheet.
Langkah-langkah : 1. Buat aplikasi baru, tambahkan komponen MainMenu (ada pada tab Standard), double klik untuk membuka Menu Designer, buat MenuItem dan atur property komponen lain seperti dibawah ini :
42
File Exit
Shape Rectangle Round Rectangle Ellipse Polygon

Property Caption Name Position Items Value Latihan 12 FLatihan12 poDesktopCenter (Menu)
Komponen Form1
Tab
MainMenu1 Statusbar1
Standard Win32
2. Klik menu File New Form, untuk membuat form baru (Form2). Tambahkan komponen dan atur property seperti pada table di bawah ini :
Komponen Form2 Tab Parent Property Caption Name Position Height Width Value Standard Shape FGrafik poDesktopCenter 513 416
Toolbar1 Toolbar2 ColorBox1 SpinEdit1 Combobox1
Win32 Win32 Additional Sample Standard
Form2 Form2 Toolbar1 Toolbar1 Toolbar1
Selected Value Items
ColorBox2 Combobox2
Additional Standard
Toolbar2 Toolbar2
Style Selected Items
PageControl1 TabSheet1 TabSheet2 TabSheet3 TabSheet4 PaintBox1 PaintBox2 PaintBox3
Win32
System System System
Form2 PageControl1 PageControl1 PageControl1 PageControl1 TabSheet1 TabSheet2 TabSheet3
Style Align Caption Caption Caption Caption Align Align Align
clBlack 1 psSolid psDash psDot psDashDot psDashDotDot psClear csDropDownList clRed bsClear bsSolid bsCross bsHorizontal bsBDiagonal bsFDiagonal bsDiagCross bsVertical csDropDownList alClient Rectangle Round Rectangle Ellipse Polygon alClient alClient alClient
43
Komponen PaintBox4
Tab System
Parent TabSheet4
Property Align
Value alClient
3. Buat function PenStyle pada Form2, ketikkan function PenStyle(S:Integer):TPenStyle; di blok private, tekan Ctrl + Shift + C, ketikkan statement berikut :
Komponen FGrafik Procedure PenStyle Code function TFGrafik.PenStyle(S: Integer): TPenStyle; var PS : TPenStyle; begin Case S Of 0 : PS := psSolid; 1 : PS := psDash; 2 : PS := psDot; 3 : PS := psDashDot; 4 : PS := psDashDotDot; 5 : PS := psClear; End; Result := PS; end;
4. Buat function BrushStyle pada Form2, ketikkan function BrushStyle(S:Integer):TBrushStyle; di blok private, tekan Ctrl + Shift + C, ketikkan statement berikut :
Komponen FGrafik Procedure BrushStyle Code function TFGrafik.BrushStyle(S: Integer): TBrushStyle; var BS : TBrushStyle; begin Case S Of 0 : BS := bsClear; 1 : BS := bsSolid; 2 : BS := bsCross; 3 : BS := bsHorizontal; 4 : BS := bsBDiagonal; 5 : BS := bsFDiagonal; 6 : BS := bsDiagCross; 7 : BS := bsVertical; End; Result := BS; End;
5. Buat variable baru pada blok public dengan nama Shape:Integer untuk menampung pilihan bentuk yang ingin ditampilkan. 6. Buat event onCreate dan onShow pada Form2, ketikkan statement berikut ini :
Komponen FGrafik Event oCreate Code procedure TFGrafik.FormCreate(Sender: TObject);
44
onShow
begin Shape := 1; PageControl1.ActivePage := TabSheet1; end; procedure TFGrafik.FormShow(Sender: TObject); begin Case Shape Of 1 : PageControl1.ActivePage := TabSheet1; 2 : PageControl1.ActivePage := TabSheet2; 3 : PageControl1.ActivePage := TabSheet3; 4 : PageControl1.ActivePage := TabSheet4; End; end;
7. Buat event onPaint pada komponen PaintBox1, PaintBox2, PaintBox3 dan PaintBox4 di Form2, ketikkan statement berikut ini :
Komponen PaintBox1 Event OnPaint Code procedure TFGrafik.PaintBox1Paint(Sender: TObject); begin With PaintBox1 do Begin Canvas.Pen.Color := ColorBox1.Selected; Canvas.Pen.Width := SpinEdit1.Value; Canvas.Pen.Style := PenStyle(ComboBox1.ItemIndex); Canvas.Brush.Color := ColorBox2.Selected; Canvas.Brush.Style := BrushStyle(Combobox2.ItemIndex); Canvas.Rectangle(20, 20, PaintBox1.Width - 20, PaintBox1.Height - 20); End; end; procedure TFGrafik.PaintBox2Paint(Sender: TObject); begin With PaintBox2 do Begin Canvas.Pen.Color := ColorBox1.Selected; Canvas.Pen.Width := SpinEdit1.Value; Canvas.Pen.Style := PenStyle(ComboBox1.ItemIndex); Canvas.Brush.Color := ColorBox2.Selected; Canvas.Brush.Style := BrushStyle(Combobox2.ItemIndex); Canvas.RoundRect(20, 20, PaintBox2.Width - 20, PaintBox2.Height - 20, 30, 30); End; end; procedure TFGrafik.PaintBox3Paint(Sender: TObject); begin With PaintBox3 do Begin Canvas.Pen.Color := ColorBox1.Selected; Canvas.Pen.Width := SpinEdit1.Value; Canvas.Pen.Style := PenStyle(ComboBox1.ItemIndex); Canvas.Brush.Color := ColorBox2.Selected; Canvas.Brush.Style := BrushStyle(Combobox2.ItemIndex); Canvas.Ellipse(20, 20, PaintBox3.Width - 20, PaintBox3.Height - 20);
PaintBox2
OnPaint
PaintBox3
OnPaint
45
End; end;
PaintBox4
OnPaint
procedure TFGrafik.PaintBox4Paint(Sender: TObject); Const PI = 22/7; var P : Array[0..360] of TPoint; a, R, count, CenterX, CenterY : Integer; c : real; begin Count := 8; C := 2*PI/Count; R := (PaintBox4.Width - 40) div 2; CenterX := PaintBox4.Width div 2; CenterY := PaintBox4.Height Div 2; For A := 0 to Count - 1 do Begin P[A].X := CenterX - Round(R * Cos(A*C+PI/2)); P[A].Y := CenterY - Round(R * Sin(A*C+PI/2)); End; With PaintBox4 do Begin Canvas.Pen.Color := ColorBox1.Selected; Canvas.Pen.Width := SpinEdit1.Value; Canvas.Pen.Style := PenStyle(ComboBox1.ItemIndex); Canvas.Brush.Color := ColorBox2.Selected; Canvas.Brush.Style := BrushStyle(Combobox2.ItemIndex); Canvas.Polygon(Slice(P, Count)); End; end;
8. Buat event onChange untuk komponen ColorBox1, SpinEdit1, Ketikkan statement Combobox1, ColorBox2 dan Combobox2. berikut ini :
Komponen ColorBox1 Event OnChange Code procedure TForm2.ColorBox1Change(Sender: TObject); begin Case PageControl1.TabIndex of 0 : PaintBox1Paint(Self); 1 : PaintBox2Paint(Self); 2 : PaintBox3Paint(Self); 3 : PaintBox4Paint(Self); End; end; ColorBox1Change(Self); ColorBox1Change(Self); ColorBox1Change(Self); ColorBox1Cahnge(Self);
SpinEdit1 Combobox1 ColorBox2 Combobox2
onChange onChange onChange onChange
46
9. Kembali ke FLatihan12, buat event onClick pada masing-masing MenuItem, ketikkan statement berikut ini :
Komponen Exit1 Event onClick Code procedure TFLatihan12.Exit1Click(Sender: TObject); begin Application.Terminate; end; procedure TFLatihan12.Rectangle1Click(Sender: TObject); begin FGrafik.Shape := 1; FGrafik.ShowModal; end; procedure TFLatihan12.RoundRectangle1Click(Sender: TObject); begin FGrafik.Shape := 2; FGrafik.ShowModal; end; procedure TFLatihan12.Ellipse1Click(Sender: TObject); begin FGrafik.Shape := 3; FGrafik.ShowModal; end; procedure TFLatihan12.Polygon1Click(Sender: TObject); begin FGrafik.Shape := 4; FGrafik.ShowModal; end;
Rectangle1
onClick
RoundRectangle1
onClick
Ellipse1
onClick
Polygon1
onClick
10. Tekan F9 untuk menjalankan. 11. Klik File Save All untuk menyimpan semua unit dan project, simpan dalam folder Latihan 12.
47
Latihan 13 : Data Pegawai
Aplikasi ini menggunakan konsep Array dan Record untuk menyimpan data Karyawan secara temporer. Aplikasi menggunakan dua buah form, Form1 untuk memasukkan data karyawan dan Form2 untuk menampilkan data dalam bentuk table pada komponen TStringGrid. Folder Button = C:\Program Files\Common Files\Borland Shared\Images\Buttons Langkah-langkah :
1. Buat aplikasi baru, klik File New Application 2. Tambahkan 3 buah Label dan 2 buah Edit dari tab Standard, ubah property seperti table di bawah ini :
Komponen Label1 Label2 Label3 Edit1, Edit2 Tab Standard Standard Standard Standard Parent Form1 Form1 Form1 Form1 Property Caption Font.Style Caption Caption Text Value Data Karyawan [fsBold] NIK Nama
3. Tambahkan RadioGroup1 dan GroupBox1 dari tab Standard, ubah property seperti table di bawah ini :
Komponen RadioGroup1 Tab Standard Parent Form1 Property Items Value Administrasi Keuangan Kepegawaian Pemasaran Bagian 2 Penghasilan
GroupBox1
Standard
Form1
Caption Columns Caption
4. Tambahkan 3 buah Label dan 3 buah Edit dari tab Standard ke dalam GroupBox1. Ubah property seperti table di bawah ini :
Komponen Label4 Label5 Label6 Edit3 Edit4 Edit5 Tab Standard Standard Standard Standard Standard Standard Parent GroupBox1 GroupBox1 GroupBox1 GroupBox1 GroupBox1 GroupBox1 Property Caption Caption Caption Text Text Text Value Gaji Pokok Tunjangan Total Gaji 0 0 0
48
5. Tambahkan 4 buah BitBtn dari tab Additional. Ubah property seperti table di bawah ini :
Komponen BitBtn1 BitBtn2 BitBtn3 BitBtn4 Tab Additional Additional Additional Additional Parent Form1 Form1 Form1 Form1 Property Caption Glyph Caption Glyph Caption Glyph Caption Glyph Value Simpan Filesave.bmp Reset Retry.bmp Close Dooropen.bmp Daftar Foldrdoc.bmp
6. Atur layout Form1 seperti gambar di bawah ini :
7. Deklarasikan type Record KaryawanRec didalam blok type pada unit1. Lihat gambar di bawah ini :
49
8. Deklarasikan variable Array sebanyak 10 elemen [0..9] dengan type KaryawanRec dan variable NoUrut dengan type Integer pada blok Var. Lihat gambar di bawah ini :
9. Buat event-event berikut pada masing-masing komponen :

Komponen Form1 Event OnCreate Code procedure TForm1.FormCreate(Sender: TObject); begin NoUrut := 0; end;
50
Komponen Edit3, Edit4
Event OnChange
BitBtn2
onClick
BitBtn1
OnClick
BitBtn3
onClick
Code procedure TForm1.Edit3Change(Sender: TObject); Var G, T : Real; Begin If Edit3.Text <> then G := strtofloat(Edit3.Text) Else G := 0; If Edit4.Text <> then T := strtofloat(Edit4.Text) Else T := 0; Edit5.Text := FormatFloat(',0', G + T); end; procedure TForm1.BitBtn2Click(Sender: TObject); begin Edit1.Text := ''; Edit2.Text := ''; RadioGroup1.ItemIndex := -1; Edit3.Text := '0'; Edit4.Text := '0'; Edit5.Text := '0'; end; procedure TForm1.BitBtn1Click(Sender: TObject); begin If MessageDlg('Simpan Data?', mtConfirmation, [mbYes, mbNo], 0) = mrYes then Begin Karyawan[NoUrut].NIK := Edit1.Text; Karyawan[NoUrut].Nama := Edit2.Text; Karyawan[NoUrut].KodeBagian := RadioGroup1.ItemIndex; Karyawan[NoUrut].GajiPokok := strtofloat(Edit3.Text); Karyawan[NoUrut].Tunjangan := strtofloat(Edit4.Text); NoUrut := NoUrut + 1; BitBtn2Click(Self); End; end; procedure TForm1.BitBtn3Click(Sender: TObject); begin Close; end;
10. Klik menu File New Form untuk membuat form baru (Form2). 11. Tambahkan 1 buah BitBtn dan 1 buah StringGrid dari tab Additional. Ubah property seperti table di bawah ini :
Komponen BitBtn1 StringGrid1 Tab Additional Additional Parent Form2 Form2 Property Caption Glyph ColCount RowCount Value Close Dooropen.bmp 7 11
12. Klik menu File Use Unit, kemudian pilih Unit1. Klik OK untuk melanjutkan.
51
13. Buat event-event berikut pada masing-masing komponen :

Komponen Form2 Event OnCreate Code procedure TForm2.FormCreate(Sender: TObject); begin With StringGrid1 do Begin Cells[0,0] := 'NO.'; Cells[1,0] := 'NIK'; Cells[2,0] := 'NAMA'; Cells[3,0] := 'BAGIAN'; Cells[4,0] := 'GAJI POKOK'; Cells[5,0] := 'TUNJANGAN'; Cells[6,0] := 'TOTAL'; End; end; procedure TForm2.FormShow(Sender: TObject); Var Baris : Integer; begin For Baris := 0 to NoUrut - 1 do Begin With StringGrid1 do Begin Cells[0, Baris + 1] := inttostr(Baris + 1); Cells[1, Baris + 1] := Karyawan[Baris].NIK; Cells[2, Baris + 1] := Karyawan[Baris].Nama; Cells[3, Baris + 1] := Form1.RadioGroup1.Items[Karyawan[Baris].KodeBagian]; Cells[4, Baris + 1] := FormatFloat(',0', Karyawan[Baris].GajiPokok); Cells[5, Baris + 1] := FormatFloat(',0', Karyawan[Baris].Tunjangan); Cells[6, Baris + 1] := FormatFloat(',0', Karyawan[Baris].GajiPokok + Karyawan[Baris].Tunjangan); End;
onShow
52
Komponen
Event
BitBtn1
onClick
Code End; end; procedure TForm2.BitBtn1Click(Sender: TObject); begin Close; end;
14. Kembali ke Form1, klik menu File Use Unit, pilih Unit2. Klik OK untuk melanjutkan (lihat point 12). 15. Buat event onClick pada komponen BitBtn4, ketikkan perintah seperti table di bawah ini :
Komponen BitBtn4 Event onClick Code procedure TForm1.BitBtn4Click(Sender: TObject); begin Form2.ShowModal; end;
16. Jalankan dan uji aplikasi. Isi NIK dan Nama, pilih Bagian, Isi Gaji Pokok dan Tunjangan. Klik Simpan untuk menyimpan data karyawan. Klik Reset untuk mengosongkan form. Klik Daftar untuk menampilkan data yang telah dimasukkan dalam bentuk tabulasi.
53
17. Klik File Save All untuk menyimpan semua unit dan project, simpan dalam folder Latihan 13.
54
Latihan 14 : Music Player
Aplikasi berikut ini merupakan contoh pembuatan form dengan berbagai bentuk dan contoh penerapan komponen MediaPlayer untuk memainkan file music dengan ekstensi *.mp3, *.wav dan *.mid. Aplikasi akan terdiri dari 2 buah form yaitu form1 untuk interface mp3 player dan form2 untuk interface playlist. Langkah-langkah :
1. Buat dua buah gambar berikut menggunakan Microsoft Paint atau aplikasi lain. Gambar pertama (Form1.bmp) untuk interface mp3 player dan gambar kedua (Form2.bmp) untuk interface playlist (daftar lagu).
Contoh gambar form dan button ada pada folder Materi Latihan 13, 14 dan 15.
2. Buat aplikasi baru, klik File New Applications 3. Ubah property Form1 seperti pada table di bawah ini :
Komponen Form1 Tab Parent Property AlphaBlend AlphaBlendValue Autosize BorderStyle TransparentColor TransparentColorValue Value True 250 True bsNone True clWhite
4. Tambahkan Image1, ubah property Image1 seperti pada table di bawah ini :
Komponen Image1 Tab Additional Parent Form1 Property Autosize Picture Value True Form1.bmp
5. Tambahkan 5 buah Label, ubah property masing-masing komponen seperti table di bawah ini :
55
Komponen Label1
Tab Standard
Parent Form1
Label2 Label3 Label4 Label5 Label1, Label2, Label3, Label4, Label5 Label3, Label4, Label5
Standard Standard Standard Standard
Form1 Form1 Form1 Form1
Property Caption AutoSize Font.Style Caption Caption Caption Caption Transparent Enabled
Value Judul Lagu False [fsBold] Waktu Repeat Shuffle StayOnTop True False
6. Tambahkan ProgressBar1 dari tab Win32. 7. Tambahkan MediaPlayer1 dari tab System. Ubah property berikut :
Komponen MediaPlayer1 Tab System Parent Form1 Property Visible Value False
8. Tambahkan Timer1 dari tab System. Ubah property berikut :

Komponen Timer1 Tab System Parent Form1 Property Enabled Value False
9. Tambahkan 10 buah Image, ubah property masing-masing komponen seperti table di bawah ini :
Komponen Image2, Image3, Image4, Image5, Image6, Image7, Image8, Image9, Image10, Image11 Image2 Image3 Image4 Image5 Image6 Image7 Image8 Image9 Image10 Image11 Tab Additional Parent Form1 Property Autosize Cursor Transparent Picture Picture Picture Picture Picture Picture Picture Picture Picture Picture Value True crHandPoint True 8play24.bmp 8Pause24.bmp 8stop24.bmp 8backward24.bmp 8forward24.bmp 8chat24.bmp 8refresh24.bmp 8stats24.bmp 8app24.bmp 8close24.bmp
10. Atur layout masing-masing komponen seperti gambar di bawah ini :
56
11. Buat form baru (Form2), klik menu File New Form. 12. Ubah property pada Form2 seperti pada table di bawah ini :
Komponen Form2 Tab Parent Property AlphaBlend AlphaBlendValue Autosize BorderStyle TransparentColor TransparentColorValue Value True 250 True bsNone True clWhite
13. Tambahkan 6 buah komponen Image, ubah property masing-masing komponen seperti pada table di bawah ini :
Komponen Image1 Image2, Image3, Image4, Image5, Image6 Image2 Image3 Image4 Image5 Image6 Tab Additional Parent Form2 Property Autosize Picture Autosize Cursor Transparent Picture Picture Picture Picture Picture Value True Form2.bmp True crHandPoint True 8addfile24.bmp 8trash24.bmp 8floppy24.bmp 8foldermove24.bmp 8close24.bmp
14. Tambahkan komponen ListBox1 dari tab Standard, ubah property ListBox1 seperti pada table di bawah ini :
Komponen ListBox1 Tab Standard Parent Form2 Property Color Ctl3D Value $00C080FF False
15. Tambahkan 2 buah komponen OpenDialog dan 1 buah SaveDialog dari tab Dialog, ubah property masing-masing komponen seperti pada table di bawah ini :
Komponen OpenDialog1 Tab Dialog Parent Form2 Property DefaultExt Filter Options. ofAllowMultiSelect DefaultExt Filter DefaultExt Filter Value *.mp3 Filter Name File Musik (*.mp3, *.wav, *.mid) True *.pls Filter Name File Playlist (*.pls) *.pls Filter Name File Playlist (*.pls)
Filter *.mp3; *.wav; *.mid
OpenDialog2
Dialog
Form2
Filter *.pls Filter *.pls
SaveDialog1
Dialog
Form2
16. Atur layout Form2 seperti pada gambar di bawah ini :
57
17. Buat event berikut pada masing-masing komponen seperti pada table di bawah ini :
Komponen Form2 Event onCreate Code procedure TForm2.FormCreate(Sender: TObject); begin Left := Form1.Left; Top := Form1.Top + Form1.Height; end; procedure TForm2.Image1MouseDown(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer); begin ReleaseCapture; Perform(WM_SYSCOMMAND, $F012, 0); end; procedure TForm2.Image2Click(Sender: TObject); Var NoUrut : Integer; begin If OpenDialog1.Execute then Begin NoUrut := ListBox1.Items.Count - 1; ListBox1.Items.AddStrings(OpenDialog1.Files); If ListBox1.Items.Count > 0 then ListBox1.ItemIndex := NoUrut + 1; End; end; procedure TForm2.Image3Click(Sender: TObject); begin If ListBox1.ItemIndex >= 0 then ListBox1.Items.Delete(ListBox1.ItemIndex); end;
Image1
onMouseDown
Image2
onClick
Image3
onClick
58
Komponen Image4
Event onClick
Image5
onClick
Image6
onClick
Code procedure TForm2.Image4Click(Sender: TObject); begin If SaveDialog1.Execute then ListBox1.Items.SaveToFile(SaveDialog1.FileName); end; procedure TForm2.Image5Click(Sender: TObject); begin If OpenDialog2.Execute then Begin ListBox1.Items.LoadFromFile(OpenDialog2.FileName); If ListBox1.Items.Count > 0 then ListBox1.ItemIndex := 0; End; end; procedure TForm2.Image6Click(Sender: TObject); begin Close; end;
18. Kembali ke Form1. Gunakan Project Manager (Ctrl+Alt+F11) atau pilih Unit1 pada Code Editor kemudian tekan F12.
19. Tambahkan variable State dengan type Integer pada blok Public, lihat gambar berikut :
59
20. Buat procedure Play, Pause, Resume, Stop, Next dan Prev pada blok Public (lihat gambar di point 19), tekan Ctrl+Shift+C untuk membuat blok procedure dan ketikkan perintah berikut ini :
Komponen Form1 Procedure Play Code procedure TForm1.Play; begin With Form2 do Begin If ListBox1.ItemIndex <> -1 then Begin MediaPlayer1.FileName := ListBox1.Items[ListBox1.ItemIndex]; MediaPlayer1.Open; Form1.Label1.Caption := MediaPlayer1.FileName; Timer1.Enabled := True; ProgressBar1.Max := MediaPlayer1.Length; MediaPlayer1.Notify := True; State := 1; MediaPlayer1.Play; End; End; end; procedure TForm1.Pause; begin If State = 1 then Begin State := 2; Timer1.Enabled := False; MediaPlayer1.Pause; End; end; procedure TForm1.Resume; begin If State = 2 then Begin State := 1;
Form1
Pause
Form1
Resume
60
Komponen
Procedure
Form1
Stop
Form1
Next
Form1
Prev
Code Timer1.Enabled := True; MediaPlayer1.Resume; End; end; procedure TForm1.Stop; begin If State = 1 then Begin State := 0; Timer1.Enabled := False; MediaPlayer1.Stop; End; end; procedure TForm1.Next; begin If State in [0, 1, 2] then Begin With Form2.ListBox1 do Begin If ItemIndex = (Items.Count - 1) then Begin If Label3.Enabled then ItemIndex := 0 else ItemIndex := -1; End else ItemIndex := ItemIndex + 1; If Label4.Enabled then ItemIndex := Random(Items.Count - 1); End; Play; End; end; procedure TForm1.Prev; begin With Form2.ListBox1 do Begin If ItemIndex = 0 then ItemIndex := Items.Count - 1 else ItemIndex := ItemIndex - 1; If Label4.Enabled then ItemIndex := Random(Items.Count - 1); End; Play; end;
21. Buat function Int2TimeStr(I : Integer):String; pada blok Public (lihat gambar di point 19). Tekan Ctrl+Shift+C untuk membuat blok function, ketikkan perintah berikut ini :
Komponen Form1 Function Int2TimeStr Code function TForm1.Int2TimeStr(I: Integer): String; begin I := I Div 1000; Result := FormatFloat('00', I Div 3600) + ':' + FormatFloat('00', I Div 60) + ':' + FormatFloat('00', I Mod 60); end;
61
22. Buat event berikut pada masing-masing komponen seperti pada table di bawah ini :
Komponen Form1 Event OnCreate Code procedure TForm1.FormCreate(Sender: TObject); begin MediaPlayer1.TimeFormat := tfMilliseconds; State := 0; Randomize; end; procedure TForm1.FormShow(Sender: TObject); begin Form2.Show; end; procedure TForm1.Timer1Timer(Sender: TObject); begin Label2.Caption := Int2TimeStr(MediaPlayer1.Position) + ' / ' + Int2TimeStr(MediaPlayer1.Length); ProgressBar1.Position := MediaPlayer1.Position; If (State = 1) And (MediaPlayer1.Position >= MediaPlayer1.Length) then Begin Stop; Next; End; end; procedure TForm1.Image1MouseDown(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer); begin ReleaseCapture; Perform(WM_SYSCOMMAND, $F012, 0); end; procedure TForm1.Image2Click(Sender: TObject); begin If State in [0, 1] then Play else Resume; end; procedure TForm1.Image3Click(Sender: TObject); begin Pause; end; procedure TForm1.Image4Click(Sender: TObject); begin Stop; end; procedure TForm1.Image5Click(Sender: TObject); begin Prev; end; procedure TForm1.Image6Click(Sender: TObject); begin Next;
onShow
Timer1
OnTimer
Image1
onMouse Down
Image2
onClick
Image3
onClick
Image4
onClick
Image5
onClick
Image6
onClick
62
Komponen Image7
Event onClick
Image8
onClick
Image9
onClick
Image10
onClick
Image11
onClick
Code end; procedure TForm1.Image7Click(Sender: TObject); begin Form2.Show; end; procedure TForm1.Image8Click(Sender: TObject); begin Label3.Enabled := not Label3.Enabled; end; procedure TForm1.Image9Click(Sender: TObject); begin Label4.Enabled := not Label4.Enabled; end; procedure TForm1.Image10Click(Sender: TObject); begin Label5.Enabled := Not Label5.Enabled; If Label5.Enabled then FormStyle := fsStayOnTop else FormStyle := fsNormal; end; procedure TForm1.Image11Click(Sender: TObject); begin Close; end;
23. Kembali ke Form2. 24. Buat event onDblClick pada ListBox1 seperti pada table di bawah ini :
Komponen ListBox1 Event onDblClick Code procedure TForm2.ListBox1DblClick(Sender: TObject); begin Form1.Play; end;
25. Simpan seluruh project, klik menu File Save All, simpan dalam folder Latihan14. 26. Uji dan jalankan aplikasi, perhatikan saat pengujian pada beberapa action tampil CPU Windows, tekan F9 (Run) untuk melanjutkan. CPU Windows hanya muncul pada saat desain, kalau dijalankan langsung dari file execution hal ini tidak akan tampil.
63
64
Latihan 15 : Text Editor
Aplikasi berikut ini merupakan contoh implementasi komponen RichText, Action Manager, Action Menubar dan Action Toolbar. Aplikasi Text Editor ini menggunakan konsep MDI (Multi Document Interface). Langkah-langkah :
1. Buat aplikasi baru, klik File New Application. 2. Ubah property Form1 seperti pada table di bawah ini :
Komponen Form1 Tab Parent Property Caption FormStyle WindowState Value Text Editor fsMDIForm wsMaximized
3. Tambahkan StatusBar1 dari tab Win32. 4. Buka file Contoh.pas, copy dan paste komponen ImageList1 ke Form1. 5. Tambahkan komponen ActionManager1 dari tab Additional, ubah property seperti table di bawah ini :
Komponen ActionManager1 Tab Additional Parent Form1 Property Images Value ImageList1
6. Klik dua kali komponen ActionManager1. Klik tombol Action, pilih New Action untuk membuat Action1.
7. Pilih Action1 pada Object TreeView, ubah property seperti pada table di bawah ini :
Komponen Action1 Property Caption Category Value New File
65
Komponen
Property ImageIndex Name
Value 6 FileNew1
8. Masih di ActionManager1, klik tombol Action (lihat gambar point 6), pilih New Standard Action untuk membuka jendela Standard Action Classes, pada section File pilih TFileOpen, TFileExit, TWindowCascade, TWindowTileHorizontal, dan TWindowTileVertical (gunakan tombol Ctrl untuk multiselect). Klik OK untuk melanjutkan.
9. Tambahkan komponen ActionMainMenuBar1 dari tab Additional. 10. Klik dua kali ActionManager1. Drag and drop File dari Category ke ActionMainMenuBar1. Drag and drop Window dari Category ke ActionMainMenuBar1.
66
11. Tambahkan komponen ActionToolBar1 dari tab Additional. 12. Klik dua kali ActionManager1. Drag and drop New dari Actions ke ActionToolBar1. Drag and drop Open dari Actions ke ActionToolBar1. Drag and drop Exit dari Actions ke ActionToolBar1.
13. Pilih FileOpen1 pada Object TreeView.
14. Ubah property pada FileOpen1 seperti pada table di bawah ini :
Komponen FileOpen1 Property Dialog.DefaultExt Dialog.Filter Value *.txt Filter Name File Teks (*.txt) Semua File (*.*)
Filter *.txt *.*
67
Komponen
Property Dialog.Title
Value Buka File
15. Pada tahap ini seharusnya Form1 mempunyai layout seperti gambar di bawah ini :
16. Buat form baru (Form2), klik menu File New Form. 17. Copy dan Paste ImageList1 dari Form1 ke Form2. 18. Tambahkan komponen StatusBar1 dari tab Win32. 19. Tambahkan komponen RichEdit1 dari tab Win32. 20. Tambahkan komponen ActionManager1 dari tab Additional. 21. Ubah property masing-masing komponen seperti table di bawah ini :
Komponen Form2 RichEdit1 Tab Win32 Parent Form2 Property FormStyle Align ScrollBars Lines Image Value fsMDIChild alClient ssBoth ImageList1
ActionManager1
Additional
Form2
22. Klik dua kali komponen ActionManager1. 23. Klik tombol Action (lihat point 6), pilih New Standard Action, tambahkan TEditCut, TEditCopy, TEditPaste, TEditUndo, TEditDelete, TRichEditBold, TRichEditItalic, TRichEditUnderline, TRichEditStrikeOut, TRichEditBullets, TRichEditAlignLeft, TRichEditAlignRight, TRichEditAlignCenter, TFileSaveAs, TColorSelect dan TFontEdit. Klik OK untuk melanjutkan. 24. Tambahkan komponen ActionToolBar1 dari tab Additional. 25. Klik dua kali komponen ActionManager1. 26. Drag dan drop Actions Save As, Cut, Paste, Undo, Delete, Bold, Italic, Underline, Strikeout, Bullets, Align Left, Align Center, Align Rigt, Select Color, dan Select Font dari masing-masing Category ke ActionToolBar1. 27. Pilih FileSaveAs1 pada Object TreeView, ubah property seperti pada table di bawah ini :
68
Komponen FileSaveAs1
Property Dialog.DefaultExt Dialog.Filter
Dialog.Title
Value *.txt Filter Name File Teks (*.txt) Semua File (*.*) Simpan
Filter *.txt *.*
29. Klik menu Project Options untuk membuka jendela Project Options. Pada tab Forms, pindahkan Form2 dari Auto-Create Forms ke Available Forms seperti pada gambar di bawah ini, klik OK untuk melanjutkan
69
30. Pilih ColorSelect1 pada Object TreeView, buat event BeforeExecute dan onAccept, ketikkan perintah seperti pada table di bawah ini :
Komponen ColorSelect1 Event BeforExecute Code procedure TForm2.ColorSelect1BeforeExecute(Sender: TObject); begin ColorSelect1.Dialog.Color := RichEdit1.SelAttributes.Color; end; procedure TForm2.ColorSelect1Accept(Sender: TObject); begin RichEdit1.SelAttributes.Color := ColorSelect1.Dialog.Color; end;
onAccept
31. Pilih FontEdit1 pada Object TreeView, buat event BeforeExecute dan onAccept, ketikkan perintah seperti pada table di bawah ini :
Komponen FontEdit1 Event BeforExecute Code procedure TForm2.FontEdit1BeforeExecute(Sender: TObject); begin With FontEdit1.Dialog do Begin Font.Name := RichEdit1.SelAttributes.Name; Font.Color := RichEdit1.SelAttributes.Color; Font.Style := RichEdit1.SelAttributes.Style; Font.Size := RichEdit1.SelAttributes.Size; End; end; procedure TForm2.FontEdit1Accept(Sender: TObject); begin With RichEdit1 do Begin SelAttributes.Name := FontEdit1.Dialog.Font.Name; SelAttributes.Color := FontEdit1.Dialog.Font.Color; SelAttributes.Style := FontEdit1.Dialog.Font.Style; SelAttributes.Size := FontEdit1.Dialog.Font.Size; end; end;
onAccept
32. Pilih FileSaveAs1 pada Object TreeView, buat event BeforeExecute dan onAccept, ketikkan perintah seperti pada table di bawah ini :
Komponen FileSaveAs1 Event BeforExecute Code procedure TForm2.FileSaveAs1BeforeExecute(Sender: TObject); begin If Caption = 'Untitled.txt' then FileSaveAs1.Dialog.FileName := Caption; end; procedure TForm2.FileSaveAs1Accept(Sender: TObject); begin RichEdit1.Lines.SaveToFile(FileSaveAs1.Dialog.FileName); Caption := FileSaveAs1.Dialog.FileName; end;
onAccept
33. Pilih Form2 pada Object TreeView, buat event onClose onCloseQuery, ketikkan perintah seperti pada table di bawah ini :
dan
70
Komponen Form2
Event onClose
onClose Query
Code procedure TForm2.FormClose(Sender: TObject; var Action: TCloseAction); begin Action := caFree; end; procedure TForm2.FormCloseQuery(Sender: TObject; var CanClose: Boolean); begin If RichEdit1.Modified then Begin If Caption = 'Untitled.txt' then FileSaveAs1.Execute else Case MessageDlg('Simpan?', mtConfirmation, mbYesNoCancel, 0) of mrYes : RichEdit1.Lines.SaveToFile(Caption); mrNo : CanClose := True; mrCancel : CanClose := False; End; End; end;
34. Kembali ke Form1. 35. Pastikan Anda sudah berada pada Form1, klik menu File Use Unit.., pilih Unit2, klik OK untuk melanjutkan. 36. Pilih FileNew1 pada Object TreeView, buat event onExecute, ketikkan perintah seperti pada table di bawah ini :
Komponen FileNew1 Event onExecute Code procedure TForm1.FileNew1Execute(Sender: TObject); begin Application.CreateForm(TForm2, Form2); Form2.Caption := 'Untitled.txt'; end;
37. Pilih FileOpen1 pada Object TreeView, buat event onAccept, ketikkan perintah seperti pada table di bawah ini :
Komponen FileOpen1 Event onAccept Code procedure TForm1.FileOpen1Accept(Sender: TObject); begin Application.CreateForm(TForm2, Form2); With Form2 do Begin Caption := FileOpen1.Dialog.FileName; RichEdit1.Lines.LoadFromFile(FileOpen1.Dialog.FileName); RichEdit1.Modified := False; end; end;
38. Klik Form1 pada Object TreeView, buat event onShow, ketikkan perintah seperti pada table di bawah ini :
Komponen Form1 Event onShow Code procedure TForm1.FormShow(Sender: TObject); begin
71
Komponen
Event
Code FileNew1Execute(Self); end;
39. Jalankan dan uji aplikasi. Pertama kali aplikasi akan menampilkan jendela editor kosong dengan nama Untitled.txt. Pilih menu File Open untuk membuka file teks. File akan dibuka pada jendela tersendiri. Pilih menu Window Cascade dan Window Tile untuk mengatur susunan jendela yang dibuka.
40. Simpan dalam folder Latihan 15.
72
Latihan 16 : Image Viewer
Aplikasi berikut ini merupakan implementasi beberapa fungsi grafik yang ada dalam Delphi seperti penggunaan Pen dan Brush untuk menggambar bentuk-bentuk dasar. Aplikasi terdiri dari 3 buah form, Form1 dalam bentuk MDI sebagai form utama, Form2 untuk menampilkan image atau menggambar bentuk-bentuk dasar dan Form3 untuk menampilkan demo Random Shape. Langkah-langkah :
1. Buat aplikasi baru, klik File New Application. 2. Pilih Form1 pada Object TreeView, Ubah property seperti pada table di bawah ini :
Komponen Form1 Tab Parent Property Caption FormStyle WindowState Value Image Viewer fsMDIForm wsMaximized
3. Tambahkan StatusBar1 dari tab Win32. 4. Tambahkan MainMenu1 dari tab Standard. Klik dua kali MainMenu1 untuk membuka menu editor. Buat mainmenu dengan struktur seperti di bawah ini :
Menu File SubMenu New Picture Open Picture -----------------Exit Demo Random Shapes Windows Cascade Tile Vertical Tile Horizontal Property Caption Caption ShortCut Caption Shortcut Caption Caption Caption Caption Caption Caption Caption Caption Value &File &New Picture Ctrl+N &Open Picture Ctrl+O E&xit &Demo &Random Shapes &windows &Cascade Tile &Vertical Tile &Horizontal
5. Tambahkan OpenPictureDialog1 dari tab Dialogs, ubah property seperti pada table di bawah ini :
Komponen OpenPictureDialog1 Tab Dialogs Parent Form1 Property Title Value Open Picture
73
7. Klik menu File Save All, untuk menyimpan Project1 dan Unit1. 8. Buat form baru (Form2), klik menu File New Form. 9. Pilih Form2 pada Object TreeView, ubah property seperti pada table di bawah ini :
Komponen Form2 Tab Parent Property Caption FormStyle WindowState Value fsMDIChild wsMaximized
10. Tambahkan 3 buah Toolbar dari tab Win32. 11. Tambahkan 1 buah StatusBar dari tab Win32. Klik dua kali StatusBar1 untuk membuka jendela Panel Editor, klik kanan pada area kosong Panel Editor, pilih Add untuk menambahkan panel baru. Tambahkan 3 buah panel (lihat gambar berikut).
Ubah property masing-masing panel seperti pada table dibawah ini :

Komponen StatusBar1.Panels[0] StatusBar1.Panels[1] StatusBar1.Panels[2] Property Text Width Text Width Text Value Dimensi : 150 Posisi : 150 Ukuran :
74
Width
150
12. Tambahkan 5 buah SpeedButton dari tab Additional ke dalam ToolBar1, ubah property seperti pada table di bawah ini :
Komponen SpeedButton1 SpeedButton2 SpeedButton3 SpeedButton4 SpeedButton5 SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4, SpeedButton5 SpeedButton2, SpeedButton3, SpeedButton4, SpeedButton5 SpeedButton2 Parent ToolBar1 ToolBar1 ToolBar1 ToolBar1 ToolBar1 Property Glyph Glyph Glyph Glyph Glyph Flat Value Save.bmp Rectangle.bmp RoundRect.bmp Ellipse.bmp Lines.bmp True
GroupIndex
Down
True
13. Tambahkan ColorBox1 dari tab Additional ke dalam ToolBar2, ubah property seperti pada table di bawah ini :
Komponen ColorBox1 Parent ToolBar2 Property Selected Value clBlack
14. Tambahkan 2 buah Combobox dari tab Standard ke dalam ToolBar2, ubah property seperti table di bawah ini :
Komponen Combobox1 Parent ToolBar2 Property Items Value psSolid psDash psDot psDashColor psDashDotDot psClear psInsideFrame 0 csOwnerDrawVariable pmBlack pmWhite pmNop pmNot pmCopy pmNotCopy pmMergePenNot pmMaskPenNot pmMergeNotPen pmMaskNotPen pmMerge pmNotMerge pmMask pmNotMask
Combobox2
ToolBar2
ItemIndex Style Items
75
Komponen
Parent
Property
Style ItemIndex
Value pmXOR pmNotXOR csDropDownList 4
15. Tambahkan SpinEdit1 dari tab Samples ke dalam ToolBar2, ubah property seperti table di bawah ini :
Komponen SpinEdit1 Parent ToolBar2 Property MaxValue MinValue Value 10 1
16. Tambahkan ColorBox2 dari tab Additional ke dalam ToolBar3, ubah property seperti table di bawah ini :
Komponen ColorBox1 Parent ToolBar2 Property Selected Value clRed
17. Tambahkan Combobox3 dari tab Additional ke dalam ToolBar3, ubah property seperti table di bawah ini :
Komponen Combobox1 Parent ToolBar2 Property Items Value bsSolid bsClear bsHorizontal bsVertical bsBDiagonal bsCross bsDiagCross csDropDownList 0
Style ItemIndex
18. Tambahkan ScrollBox1 dari tab Additional ke Form2, ubah property seperti table di bawah ini :
Komponen ScrollBox1 Parent Form2 Property Align Value alClient
19. Tambahkan Image1 dari tab Additional ke dalam ScrollBox1, ubah property seperti table di bawah ini :
Komponen Image1 Parent ScrollBox1 Property Align Value alClient
20. Tambahkan SavePictureDialog1 dari tab Dialogs ke Form2, ubah property seperti table di bawah ini :
Komponen SavePictureDialog1 Parent Form2 Property Title Value Save Picture
76
22. Pilih Combobox1 pada Object TreeView, buat event OnDrawItem, ketikkan perintah seperti table di bawah ini :
Komponen Combobox1 Event onDrawItem Code procedure TForm2.ComboBox1DrawItem(Control: TWinControl; Index: Integer; Rect: TRect; State: TOwnerDrawState); begin With Combobox1.Canvas do Begin Pen.Color := ColorBox1.Selected; Pen.Style := TPenStyle(Index); MoveTo(Rect.Left + 1, Rect.Top + 5); LineTo(50, Rect.Top + 5); TextOut(60, Rect.Top + 1, Combobox1.Items[Index]); End; end;
23. Pilih SpeedButton1 pada Object TreeView, buat event OnClick, ketikkan perintah seperti table di bawah ini ;
Komponen SpeedButton1 Event onClick Code procedure TForm2.SpeedButton1Click(Sender: TObject); begin SavePictureDialog1.FileName := Caption; If SavePictureDialog1.Execute then Begin Image1.Picture.SaveToFile(SavePictureDialog1.FileName); Caption := SavePictureDialog1.FileName; End; end;
77
24. Pilih Form2 pada Object TreeView, buat event onClose, OnCloseQuery dan onShow, ketikkan perintah seperti table di bawah ini :
Komponen Form2 Event OnClose Code procedure TForm2.FormClose(Sender: TObject; var Action: TCloseAction); begin Action := caFree; end; procedure TForm2.FormCloseQuery(Sender: TObject; var CanClose: Boolean); begin If Caption = 'Untitled.txt' then SpeedButton1Click(self) else Begin If Image1.Picture.Graphic is TBitmap then Case MessageDlg('Simpan?', mtConfirmation, mbYesNoCancel, 0) of mrYes : SpeedButton1Click(Self); mrNo : CanClose := True; mrCancel : CanClose := False; End; End; end; procedure TForm2.FormShow(Sender: TObject); begin StatusBar1.Panels[0].Text := 'Dimensi : ' + inttostr(Image1.Width) + ' x ' + inttostr(Image1.Height); end;
OnCloseQuery
onShow
25. Tambahkan Variabel SP dan CP dengan type data TPoint pada blok Private, lihat gambar berikut :
26. Buat Procedure DrawShape pada blok Private (lihat gambar di atas), tekan Ctrl+Shift+C untuk membuat blok procedure, ketikan perintah seperti table di bawah ini :
Komponen Form2 Procedure DrawShape Code procedure TForm2.DrawShape; begin
78
Komponen
Procedure
Code With Image1.Canvas do Begin If SpeedButton2.Down then Rectangle(SP.X, SP.Y, CP.X, CP.Y); If SpeedButton3.Down then RoundRect(SP.X, SP.Y, CP.X, CP.Y, 30, 30); If SpeedButton4.Down then Ellipse(SP.X, SP.Y, CP.X, CP.Y); If SpeedButton5.Down then Begin MoveTo(SP.X, SP.Y); LineTo(CP.X, CP.Y); End; End; end;
27. Pilih Image1 pada Object TreeView, buat event OnMouseDown, OnMouseMove dan OnMouseUp, ketikkan perintah seperti table di bawah ini :
Komponen Image1 Event OnMouseDown Code procedure TForm2.Image1MouseDown(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer); begin If Image1.Picture.Graphic is TBitmap then With Image1.Canvas do Begin SP := Point(X, Y); CP := Point(X, Y); Pen.Width := 1; Pen.Style := psDot; Pen.Color := clBlack; Brush.Style := bsClear; Pen.Mode := pmNotXOR; DrawShape; End; end; procedure TForm2.Image1MouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer); begin If (Image1.Picture.Graphic is TBitmap) and SpeedButton2.Down or SpeedButton3.Down or SpeedButton4.Down or SpeedButton5.Down then Begin If ssLeft in Shift then Begin DrawShape; CP := Point(X, Y); DrawShape; End; StatusBar1.Panels[2].Text := 'Ukuran : ' + inttostr(abs(CP.X - SP.X)) + ' x ' + inttostr(abs(CP.Y - SP.Y));
OnMouseMove
79
Komponen
Event
OnMouseUp
Code End; StatusBar1.Panels[1].Text := 'Posisi : ' + inttostr(X) + ', ' + inttostr(Y); end; procedure TForm2.Image1MouseUp(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer); begin If Image1.Picture.Graphic is TBitmap then With Image1.Canvas do Begin DrawShape; CP := Point(X, Y); Pen.Width := SpinEdit1.Value; Pen.Color := ColorBox1.Selected; Pen.Style := TPenStyle(Combobox1.ItemIndex); Pen.Mode := TPenMode(Combobox2.ItemIndex); Brush.Color := ColorBox2.Selected; Brush.Style := TBrushStyle(Combobox3.ItemIndex); DrawShape; End; end;
28. Klik menu File Save All, untuk menyimpan Project dan seluruh Unit. 29. Klik menu File New Form, untuk membuat form baru (Form3). 30. Pilih Form3 pada Object TreeView, ubah property seperti table di bawah ini ;
Komponen Form3 Parent Property Caption FormStyle WindowState Value Random Shapes fsMDIChild wsMaximized
31. Tambahkan PaintBox1 dan Timer1 dari tab System, ubah property seperti table di bawah ini :
Komponen PaintBox1 Timer1 Parent Form3 Form3 Property Align Interval Value alClient 10
80
33. Buat variable PosX, PosY, Panjang, Lebar, dan shape dengan type data Integer pada blok Private, lihat gambar berikut :
34. Pilih Form3 pada Object TreeView, buat event OnClose dan OnCreate, ketikkan perintah seperti table di bawah ini :
Komponen Form Event OnClose Code procedure TForm3.FormClose(Sender: TObject; var Action: TCloseAction); begin Action := caFree; end; procedure TForm3.FormCreate(Sender: TObject); begin Randomize; end;
OnCreate
35. Pilih Timer1 pada Object TreeView, buat event OnTimer, ketikkan perintah seperti table di bawah ini :
Komponen Timer1 Event OnTimer Code procedure TForm3.Timer1Timer(Sender: TObject); begin With PaintBox1.Canvas do Begin Pen.Width := Random(5); Pen.Mode := TPenMode(Random(15)); Pen.Color := RGB(Random(255), Random(255), Random(255)); Brush.Color := RGB(Random(255), Random(255),
81
Komponen
Event
Code Random(255)); Shape := Random(3); PosX := Random(Width); PosY := Random(Height); Panjang := Random(200)+ 50; Lebar := Random(200) + 50; Case Shape of 0 : Rectangle(PosX, PosY, PosX + Panjang, PosY + Lebar); 1 : RoundRect(PosX, PosY, PosX + Panjang, PosY + Lebar, Random(30), Random(30)); 2 : Ellipse(PosX, PosY, PosX + Panjang, PosY + Lebar); End; End; end;
36. Klik menu File Save All untuk menyimpan Project dan seluruh Unit. 37. Kembali ke Form1. Klik menu View Forms, pilih Form1, klik OK untuk melanjutkan. 38. Klik File Use unit, pilih Unit2 dan Unit3, klik OK untuk melanjutkan. 39. Buat event OnClick untuk tiap menuitem, ketikkan perintah seperti table di bawah ini :
Komponen NewPicture1 Event OnClick Code procedure TForm1.NewPicture1Click(Sender: TObject); begin Application.CreateForm(TForm2, Form2); Form2.Caption := 'Untitled.bmp'; end; procedure TForm1.OpenPicture1Click(Sender: TObject); begin If OpenPictureDialog1.Execute then With Form2 do Begin Application.CreateForm(TForm2, Form2); Caption := OpenPictureDialog1.FileName; With Image1 do Begin Picture.LoadFromFile(OpenPictureDialog1.FileName); Align := alNone; End; End; end; procedure TForm1.Keluar1Click(Sender: TObject); begin Close; end; procedure TForm1.RandomShapes1Click(Sender: TObject); begin Application.CreateForm(TForm3, Form3); end; procedure TForm1.Cascade1Click(Sender: TObject); begin Cascade; end;
OpenPicture1
OnClick
Exit1
OnClick
RandomShape1
OnClick
Cascade1
OnClick
82
Komponen TileVertical1
Event OnClick
TileHorizontal1
OnClick
Code procedure TForm1.ileVertically1Click(Sender: TObject); begin TileMode := tbVertical; Tile; end; procedure TForm1.ileHorizontally1Click(Sender: TObject); begin TileMode := tbHorizontal; Tile; end;
40. Klik File Save All untuk menyimpan Project dan seluruh Unit. 41. Uji dan jalankan aplikasi.
83
PROYEK SISTEM INFORMASI RENTAL VCD/DVD

Proyek ini merupakan tugas akhir semester 3 yang akan dijadikan salah satu komponen nilai akhir semester matakuliah Pemrograman Visual 1.
Kebutuhan Fungsional :
1. Member - Member dapat melakukan pencarian koleksi dan membaca informasi atau melihat preview koleksi film. - Member yang terdaftar dapat melihat histori transaksi yang pernah dilakukannya. 2. Karyawan - Karyawan bisa melakukan login ke dalam aplikasi. - Karyawan dapat memasukkan transaksi peminjaman dan pengembalian koleksi. - Karyawan dapat melihat laporan transaksi harian. - Karyawan dapat melakukan manajemen data member. - Karyawan dapat melakukan manajemen data koleksi. - Karyawan dapat melakukan pencarian data koleksi - Karyawan dapat melakukan pencarian data member. - Karyawan dapat melihat histori transaksi member. 3. Pemilik/Administrator - Pemilik/Administrator dapat melakukan login ke aplikasi. - Pemilik/Administrator dapat melihat laporan transaksi per periode. - Pemilik/Administrator dapat melakukan manajemen data Karyawan, Koleksi dan Member - Pemilik/Administrator dapat melihat laporan pendapatan.
Matriks Penggunaan Form

Pengguna Form FUtama FLogin FSetup FMember FKoleksi FPemasok FKaryawan FPinjam FKembali Unit UFUtama UFLogin UFSetup UFMember UFKoleksi UFPemasok UFKaryawan UFPinjam UFKembali Fungsi Form Utama Login Setup Data Pelanggan Data Koleksi Data Pemasok Data Karyawan Transaksi Peminjaman Transaksi Member Ya Tidak Tidak Ya, View Only Ya, View Only Tidak Tidak Tidak Tidak Karyawan Ya Ya Tidak Ya Ya Tidak Tidak Ya Ya Pemilik / Admin Ya Ya Ya Ya Ya Ya Ya Ya Ya
84
Pengguna Form Unit Fungsi Pengembalian Daftar Pelanggan Daftar Koleksi Laporan Transaksi Peminjaman Laporan Transaksi Pengembalian Laporan Koleksi belum Kembali Laporan Pendapatan Statistik About Member Ya Ya Tidak Tidak Tidak Tidak Ya Ya Karyawan Ya Ya Ya, Terbatas Ya, Terbatas Ya Tidak Ya Ya Pemilik / Admin Ya Ya Ya Ya Ya Ya Ya Ya
FDMember FDKoleksi FLPinjam FLKembali FLKoleksi FLPendapatan FStatistik FAbout
UFDMember UFDKoleksi UFLPinjam UFLKembali UFLKoleksi UFLPendapatan UFLStatistik UFAbout
Entity Relationship Diagram (ERD)
85
Latihan 17 : Membuat Database Rental
Aplikasi yang digunakan untuk merancang database rental adalah Microsoft Access 2003. Database rental terdiri dari table Pelanggan, Koleksi, Karyawan, Pemasok, Pinjam, DPinjam, Kembali dan Setup. Langkah-langkah :
1. Buat folder dengan nama Rental. 2. Jalankan aplikasi Microsoft Access 2003, klik Start All Programs Microsoft Office Microsoft Access 2003. 3. Buat database baru, klik menu File New, pilih Blank Database (lihat gambar di bawah ini).
4. Pilih folder Rental dimana file database akan disimpan (folder yang telah dibuat pada point 1), isi File Name dengan Rental.mdb, klik tombol Create untuk membuat database (lihat gambar berikut).
86
5. Buat table baru, klik dua kali Create Table in Design View (lihat gambar berikut).
6. Isi FieldName, pilih Datatype dan atur Field Properties seperti table di bawah ini :
Field Name MemberID Nama Alamat Kota TandaPengenal Data Type AutoNumber Text Text Text Text Field Properties FieldSize FieldSize FieldSize FieldSize FieldSize Value Long Integer 30 50 30 3 Ket. PK
87
Field Name NoTandaPengenal TeleponRumah Handphone TglDaftar Status Passwords Photo
Data Type Text Text Text Date/Time Text Text OLE Object
Field Properties FieldSize FieldSize FieldSize Format FieldSize Fieldsize
Value 30 30 30 ShortDate 10 10
Ket.
7. Tentukan MemberID sebagai Primary Key, klik kanan pada baris MemberID kemudian pilih Primary Key (lihat gambar di atas). 8. Simpan table, pilih menu File Save atau tekan Ctrl+S, isi Table Name dengan Member, klik OK untuk melanjutkan (lihat gambar berikut).
9. Buat table baru (table Koleksi), isi Field Name, pilih data type dan atur Field Properties seperti table di bawah ini, tentukan KoleksiID sebagai Primary Key dan simpan dengan nama table Koleksi (lihat point 4 s/d 7).
Field Name KoleksiID Data Type AutoNumber Field Properties FieldSize Value Long Integer Ket. PK
88
Field Name Judul PemeranUtama Kategori JenisKoleksi TglBeli HargaBeli PemasokID LamaSewa HargaSewa HargaDenda Jumlah Cover Preview KaryawanID
Data Type Text Text Text Text Date/Time Currency Number Number Currency Currency Number OLE Object Text Number
Field Properties FieldSize FieldSize FieldSize FieldSize Format FieldSize FieldSize
Value 50 100 20 10 ShortDate Long Integer Long Integer
Ket.
FieldSize FieldSize FieldSize
Long Integer 200 Long Integer
10. Buat table baru (table Karyawan), isi Field Name, pilih data type dan atur Field Properties seperti table di bawah ini, tentukan KaryawanID sebagai Primary Key dan simpan dengan nama table Karyawan (lihat point 4 s/d 7).
Field Name KaryawanID Nama Alamat Kota Handphone HakAkses Passwords Photo Data Type AutoNumber Text Text Text Text Number Text OLEObject Field Properties FieldSize FieldSize FieldSize FieldSize FieldSize FieldSize FieldSize Value Long Integer 30 50 30 30 Long Integer 10 Ket. PK
11. Buat table baru (table Pemasok), isi Field Name, pilih data type dan atur Field Properties seperti table di bawah ini, tentukan PemasokID sebagai Primary Key dan simpan dengan nama table Pemasok (lihat point 4 s/d 7).
Field Name PemasokID Nama Alamat Kota Telepon Data Type AutoNumber Text Text Text Text Field Properties FieldSize FieldSize FieldSize FieldSize FieldSize Value Long Integer 30 50 30 30 Ket. PK
12. Buat table baru (table Pinjam), isi Field Name, pilih data type dan atur Field Properties seperti table di bawah ini, tentukan PinjamID sebagai Primary Key dan simpan dengan nama table Pinjam (lihat point 4 s/d 7).
Field Name PinjamID TglPinjam MemberID TotalSewa KaryawanID Data Type AutoNumber Date/Time Number Currency Number Field Properties FieldSize Format FieldSize FieldSize Value Long Integer ShortDate Long Integer Long Integer Ket. PK
89
13. Buat table baru (table DPinjam), isi Field Name, pilih data type dan atur Field Properties seperti table di bawah ini, tentukan DPinjamID sebagai Primary Key dan simpan dengan nama table DPinjam (lihat point 4 s/d 7).
Field Name DPinjamID PinjamID KoleksiID HargaSewa TglHarusKembali KembaliID HargaDenda Data Type AutoNumber Number Number Currency Date/Time Number Currency Field Properties FieldSize FieldSize FieldSize Format FieldSize Value Long Integer Long Integer Long Integer ShortDate Long Integer Ket. PK
14. Buat table baru (table Kembali), isi Field Name, pilih data type dan atur Field Properties seperti table di bawah ini, tentukan KembaliID sebagai Primary Key dan simpan dengan nama table Kembali (lihat point 4 s/d 7).
Field Name KembaliID TglKembali MemberID TotalDenda KaryawanID Data Type AutoNumber Date/Time Number Currency Number Field Properties FieldSize Format FieldSize Field Size Value Long Integer ShortDate Long Integer Long Integer Ket. PK
15. Buat table baru (table Rental), isi Field Name, pilih data type dan atur Field Properties seperti table di bawah ini dan simpan dengan nama table Rental (lihat point 4 s/d 7).
Field Name Nama Alamat Telepon Pemilik Data Type Text Text Text Text Field Properties FieldSize FieldSize FieldSize FieldSize Value 30 50 30 30 Ket.
16. Pada tahap ini seharusnya Anda telah memiliki 8 buah table seperti pada gambar di bawah ini :
90
17. Tutup aplikasi Microsoft Access.
91
Latihan 18 : Membuat Form Utama
Form utama pada aplikasi ini berfungsi untuk menampilkan menu, toolbar, informasi waktu sekaligus untuk mendefinisikan koneksi ke database Rental yang kita buat pada latihan terdahulu. Langkah-langkah :
1. Pastikan file database Rental.mdb berada pada folder Rental yang telah dibuat pada Latihan 17 point 1. 2. Jalankan aplikasi Delphi. 3. Pilih Form1 pada Object TreeView, ubah property seperti pada table di bawah ini :
Komponen Form1 Property Caption Color Name WindowState Value Aplikasi Rental v1.0 (beta) clWhite FUtama wsMaximized
4. Pilih menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFUtama.pas dan Project1 menjadi Rental.dpr, simpan dalam folder Rental. 5. Tambahkan MainMenu1 dari tab Standard. Klik dua kali MainMenu1 untuk membuka menu editor. Buat mainmenu dengan struktur seperti di bawah ini :
Menu File SubMenu Login Logout -----------------Setup Property Caption Caption ShortCut Caption Enable Caption Caption Shortcut Enable Caption Caption Caption Enable Caption Shortcut Caption Shortcut Caption Caption Shortcut Caption Caption Shortcut Caption Value &File &Login Ctrl+L Logout False &Setup Ctrl+S False E&xit &Data False Membe&r Ctrl+R K&oleksi Ctrl+O Pe&masok Ctrl+M Karya&wan Ctrl+W &Transaksi
-----------------Exit Data Member Koleksi -----------------Pemasok -----------------Karyawan Transaksi
92
Menu
SubMenu Peminjaman Pengembalian
Pencarian Daftar Member Daftar Koleksi -----------------Laporan Transaksi Peminjaman Transaksi Pengembalian Koleksi belum Kembali -----------------Pendapatan Help! About
Property Enable Caption Shortcut Caption Shortcut Caption Caption Caption Caption Caption Enable Caption Caption Caption Caption Caption Caption Caption
Value False &Peminjaman Ctrl+P Pengem&balian Ctrl+B &Pencarian &Daftar Member Daftar &Koleksi &Laporan False Transaksi Peminjaman Transaksi Pengembalian Koleksi Belum Kembali Pendapatan &Help! &About
6. Tambahkan ToolBar1 dari tab Win32. Ubah property seperti table di bawah ini :
Komponen ToolBar1 Tab Win32 Parent FUtama Property Autosize ButtonHeight ButtonWidth Color Value True 44 46 clBtnFace
7. Tambahkan 7 buah SpeedButton dari tab Additional, ubah property seperti table di bawah ini :
Komponen SpeedButton1 SpeedButton2 SpeedButton3 SpeedButton4 SpeedButton5 SpeedButton6 SpeedButton7 SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4 SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4, SpeedButton5, SpeedButton6, SpeedButton7 Tab Win32 Win32 Win32 Win32 Win32 Win32 Win32 Parent ToolBar1 ToolBar1 ToolBar1 ToolBar1 ToolBar1 ToolBar1 ToolBar1 Property Glyph Hint Glyph Hint Glyph Hint Glyph Hint Glyph Hint Glyph Hint Glyph Hint Enable Flat Height Width ShowHint Value Adduser.bmp Member Baru FavAdd.bmp Koleksi Baru AddFile.bmp Peminjaman DeleteFile.bmp Pengembalian Userid.bmp Daftar Member Pictures.bmp Daftar Koleksi Websearch.bmp Statistik False True 44 46 True
93
8. Tambahkan StatusBar1 dari tab Win32. Klik dua kali StatusBar1 untuk membuka Panel Editor, tambahkan 3 buah panel dan ubah property masing-masing panel seperti table di bawah ini :
Komponen StatusBar1.Panels[0] StatusBar1.Panels[1] StatusBar1.Panels[2] Property Text Width Text Width Text Width Value Tanggal : 150 User : 150 Aplikasi Rental 150
9. Tambahkan Image1 dari tab Additional, ubah property seperti pada table di bawah ini :
Komponen Image1 Tab Additional Parent FUtama Property Align Center Picture Value alClient True Rental.bmp
10. Tambahkan Timer1 dari tab System. 11. Tambahkan ADOConnection1 dari tab ADO, ubah property seperti table di bawah ini :
Komponen ADOConnection1 Tab ADO Parent FUtama Property LoginPrompt Value False
12. Klik dua kali ADOConnection1 untuk membuka Connection String Editor, klik tombol Build untuk membuat koneksi.
13. Pilih Microsoft Jet 4.0 OLE DB Provider, klik Next untuk melanjutkan.
94
14. Ketikkan Rental.mdb pada Select or enter Database Name, pastikan database Rental.mdb ada pada folder yang sama dengan program yang sedang dibuat. Klik Test Connection untuk menguji koneksi.
95
15. Tambahkan ADOTable1 dari tab ADO, ubah property seperti table di bawah ini :
Komponen ADOTable1 Tab ADO Parent FUtama Property Connection Name TableName Value ADOConnection1 Rental Rental
16. Pada object Treeview, klik dua kali Rental untuk membuka field editor. Klik kanan pada field editor, kemudian pilih Add All Fields
17. Pada tahap ini seharusnya FUtama mempunyai layout seperti gambar di bawah ini :
96
18. Tambahkan variable KaryawanID dan HakAkses dengan type Integer, variable NamaKaryawan, NamaRental, AlamatRental, TelpRental dengan type String pada blok Public di unit UFUtama, lihat gambar berikut :
19. Pilih Timer1 pada Object TreeView, buat event onTimer, ketikkan perintah seperti table di bawah ini :
Komponen Timer1 Event onTimer Code procedure TFUtama.Timer1Timer(Sender: TObject); Const Hari : Array [1..7] of String = ('Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jum''at', 'Sabtu'); begin StatusBar1.Panels[0].Text := Hari[DayofWeek(Now)] + ', ' + DateToStr(Now) + ' ' + TimeToStr(Now); StatusBar1.Panels[1].Text := 'User : ' + NamaKaryawan; end;
20. Pilih FUtama pada Object Tree, buat event onCreate dan onClose, ketikkan perintah seperti table di bawah ini :
Komponen FUtama Event onCreate Code procedure TFUtama.FormCreate(Sender: TObject); begin ADOConnection1.Connected := True; Rental.Open; NamaRental := RentalNama.Value; AlamatRental := RentalAlamat.Value; TelpRental := RentalTelepon.Value; Rental.Close; Timer1Timer(Self); StatusBar1.Panels[2].Text := NamaRental + ', ' + AlamatRental + ' ' + TelpRental; end; procedure TFUtama.FormClose(Sender: TObject; var Action: TCloseAction); begin ADOConnection1.Connected := False; end; procedure TFUtama.FormCloseQuery(Sender: TObject; var CanClose: Boolean);
onClose
onCloseQuery
97
Komponen
Event
Code begin CanClose := MessageDlg('Tutup Aplikasi?', mtConfirmation, [mbYes, mbNo], 0) = mrYes; end;
21. Simpan, jalankan dan uji aplikasi.
NEW
Perbaikan :
1. Lakukan perbaikan Latihan 17 (Membuat Database Rental) : Point 9. 2. Lakukan perbaikan Latihan 18 (Membuat Form Utama) : Point 5, 7 dan 18 .
98
Latihan 19 : Membuat Form Login
Form Login digunakan untuk membatasi akses setiap user. Hak akses terdiri dari 0 untuk Member, 1 untuk Operator dan 2 untuk Pemilik/Administrator. Form Login akan menampilkan daftar Nama Karyawan dalam bentuk Combobox dan password. Langkah-langkah :
1. Jalankan aplikasi Microsoft Access 2003. 2. Buka file Rental.mdb yang telah dibuat pada Latihan 17. 3. Pilih object Tables, kemudian klik dua kali table Karyawan untuk menambahkan data karyawan, tambahkan data karyawan seperti pada gambar di bawah ini :
4. 5. 6. 7.
Simpan file Rental.mdb dan tutup aplikasi Microsoft Access. Jalankan aplikasi Delphi, buka project Rental.dpr. Buat form baru, klik menu File New Form. Ubah property form yang baru dibuat seperti pada table di bawah ini :
Komponen Form1 Property Caption BorderStyle Name Position Value Login bsDialog FLogin poDesktopCenter
99
8. Pilih menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFLogin.pas dalam folder Rental. 9. Klik menu File Use Unit, pilih FUtama, klik OK untuk melanjutkan. 10. Tambahkan Image1 dari tab Additional, ubah property seperti table di bawah ini :
Komponen Image1 Tab Additional Parent FLogin Property Autosize Picture Transparent Value True Key.bmp True
11. Tambahkan Label1 dan GroupBox1 dari tab Standard, ubah property seperti table di bawah ini :
Komponen Label1 Tab Standard Parent FLogin Property Caption Value Pilih nama karyawan dan masukkan password, klik Login True
GroupBox1
Standard
FLogin
Wordwrap Caption
12. Tambahkan 2 buah Label, 1 buah Combobox dan 1 buah Edit dari tab Standard ke dalam GroupBox1, ubah property seperti table di bawah ini :
Komponen Label2 Label3 Combobox1 Edit1 Tab Standard Standard Standard Standard Parent GroupBox1 GroupBox1 GroupBox1 GroupBox1 Property Caption Caption Style PassWordChar Text Value Nama Karyawan Password csDropDownList *
13. Tambahkan 2 buah BitBtn dari tab Additional ke dalam GroupBox1, ubah property seperti table di bawah ini :
Komponen BitBtn1 Tab Additional Parent GroupBox1 Property Caption Glyph Modalresult Caption Glyph ModalResult Value Login Login.bmp mrOK Batal Batal.bmp mrCancel
BitBtn2
Additional
GroupBox1
Komponen ADOTable1 Tab ADO Parent FLogin Property Connection Name TableName Value FUtama.ADOConnection1 Karyawan Karyawan
100
15. Buat field persistent table Karyawan, klik dua kali Karyawan pada Object TreeView untuk membuka Field Editor, klik kanan pada Field Editor pilih Add All Fields (lihat Latihan 18 Point 16). 16. Pada tahap ini seharusnya FLogin mempunyai layout seperti gambar di bawah ini :
17. Pilih FLogin pada Object TreeView, buat event onShow dan onClose
Komponen FLogin Event onShow Code procedure TFLogin.FormShow(Sender: TObject); begin Karyawan.Open; Combobox1.Clear; Edit1.Clear; While not Karyawan.Eof do Begin Combobox1.Items.Add(KaryawanNama.Value); Karyawan.Next; End; end; procedure TFLogin.FormClose(Sender: TObject; var Action: TCloseAction); begin Karyawan.Close; end;
onClose
18. Pilih BitBtn1 pada Object Treeview, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen BitBtn1 Event onClick Code procedure TFLogin.BitBtn1Click(Sender: TObject); begin If Karyawan.Locate('Nama',Combobox1.Text, []) and (Edit1.Text = KaryawanPasswords.Value) then Begin FUtama.KaryawanID := KaryawanKaryawanID.Value; FUtama.NamaKaryawan := KaryawanNama.Value; FUtama.HakAkses := KaryawanHakAkses.Value; End Else Begin MessageDlg('Password tidak cocok!', mtError, [mbOK], 0); Modalresult := mrNone; End; end;
101
19. Pilih Edit1 pada Object TreeView, buat event onKeyPress, ketikkan perintah seperti table di bawah ini :
Komponen Edit1 Event onKeyPress Code procedure TFLogin.Edit1KeyPress(Sender: TObject; var Key: Char); begin If Key = #13 then BitBtn1Click(Self); end;
20. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 21. Klik menu File Use Unit, pilih UFLogin, klik OK untuk melanjutkan. 22. Buat procedure EnableMenu pada blok private, tekan Ctrl+Shift+C untuk membuat blok procedure, ketikkan perintah seperti pada table di bawah ini :
Komponen FUtama Procedure EnableMenu Code procedure TFUtama.EnableMenu; begin Logout1.Enabled := HakAkses in [1,2]; Setup1.Enabled := HakAkses in [2]; Data1.Enabled := HakAkses in [1,2]; Member1.Enabled := HakAkses in [1,2]; Koleksi1.Enabled := HakAkses in [1,2]; Pemasok1.Enabled := HakAkses in [2]; Karyawan1.Enabled := HakAkses in [2]; ransaksi1.Enabled := HakAkses in [1,2]; Laporan1.Enabled := HakAkses in [1,2]; Pendapatan1.Enabled := HakAkses in [2]; SpeedButton1.Enabled := HakAkses in [1,2]; SpeedButton2.Enabled := HakAkses in [1,2]; SpeedButton3.Enabled := HakAkses in [1,2]; SpeedButton4.Enabled := HakAkses in [1,2]; end;
23. Pilih Login1 pada Object Treeview, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Login1 Event onClick Code procedure TFUtama.Login1Click(Sender: TObject); begin If FLogin.ShowModal = mrOK then EnableMenu; end;
102
24. Pilih Logout1 pada ObjectTreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Logout1 Event onClick Code procedure TFUtama.Logout1Click(Sender: TObject); begin If MessageDlg('Logout?', mtConfirmation, [mbYes, mbNo], 0) = mrYes then Begin HakAkses := 0; KaryawanID := 0; NamaKaryawan := ''; EnableMenu; End; end;
103
Latihan 20 : Membuat Form Setup
Form Setup digunakan untuk mengelola data yang berkaitan dengan Rental seperti Nama Rental, Alamat, telepon dan Nama Pemilik Rental. Langkah-langkah :
1. Jalankan aplikasi Delphi, buka project Rental.dpr. 2. Buat form baru, klik menu File New Form. 3. Ubah property form yang baru dibuat seperti pada table di bawah ini :
Komponen Form1 Property Caption BorderStyle Name Position Value Setup bsDialog FSetup poDesktopCenter
4. Pilih menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFSetup.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih FUtama, klik OK untuk melanjutkan. 6. Tambahkan Image1 dari tab Additional, ubah property seperti table di bawah ini :
Komponen Image1 Tab Additional Parent FSetup Property Autosize Picture Transparent Value True Configure.bmp True
7. Tambahkan GroupBox1 dari tab Standard, ubah property seperti table di bawah ini :
Komponen GroupBox1 Tab Standard Parent FSetup Property Caption Value
Komponen ADOTable1 Tab ADO Parent FSetup Property Connection Name TableName Value FUtama.ADOConnection1 Rental Rental
9. Buat field persistent table Rental, klik dua kali Rental pada Object TreeView untuk membuka Field Editor, klik kanan pada Field Editor pilih Add All Fields (lihat Latihan 18 Point 16). 10. Masih di Field Editor table Rental, pastikan semua field telah terpilih (kalau belum terpilih, klik kanan Field Editor, pilih Select All), kemudian drag and drop seluruh field ke dalam GroupBox1. 11. Tambahkan 2 buah BitBtn dari tab Additional, ubah property seperti table di bawah ini :
104
Komponen BitBtn1
Tab Additional
Parent GroupBox1
BitBtn2
Additional
GroupBox1
Property Caption Glyph ModalResult Caption Glyph ModalResult
Value Simpan Simpan.bmp mrYes Batal Batal.bmp mrCancel
12. Atur layout form FSetup seperti gambar di bawah ini :
13. Pilih FSetup pada Object TreeView, buat event onShow dan onClose, ketikkan perintah seperti table di bawah ini :
Komponen FSetup Event onShow Code procedure TFSetup.FormShow(Sender: TObject); begin Rental.Open; end; procedure TFSetup.FormClose(Sender: TObject; var Action: TCloseAction); begin Rental.Close; end;
OnClose
14. Pilih Datasource1 pada Object TreeView, buat event onStateChange, ketikkan perintah seperti table di bawah ini :
Komponen DataSource1 Event onStateChange Code procedure TFSetup.DataSource1StateChange(Sender: TObject); begin BitBtn1.Enabled := Rental.State in dsEditModes; end;
15. Pilih BitBtn1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen BitBtn1 Event onClick Code procedure TFSetup.BitBtn1Click(Sender: TObject); begin Rental.Post; end;
105
16. Pilih BitBtn2 pada Object TreeView, buat event OnClick, ketikkan perintah seperti table di bawah ini :
Komponen BitBtn2 Event OnClick Code procedure TFSetup.BitBtn2Click(Sender: TObject); begin Rental.Cancel; end;
17. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 18. Klik menu File Use Unit, pilih FSetup, klik OK untuk melanjutkan. 19. Pilih Setup1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Setup1 Event onClick Code procedure TFUtama.Setup1Click(Sender: TObject); begin FSetup.ShowModal; end;
106
Latihan 21 : Membuat Form Member
Form Member digunakan untuk mengelola data member. Form Member juga digunakan untuk menampilkan histori transaksi tiap member. Data dan histori transaksi ditampilkan dalam tab yang terpisah. Langkah-langkah :
1. Pastikan project Rental.dpr telah dibuka. 2. Buat form baru, klik menu File New Form. 3. Ubah property form yang baru dibuat seperti pada table di bawah ini :
Komponen Form1 Property Caption BorderStyle Name Position Value Member bsDialog FMember poDesktopCenter
4. Pilih menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFMember.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan PageControl1 dari tab Win32, ubah property seperti table di bawah ini :
Komponen PageControl1 Tab Win32 Parent FMember Property Align Value alClient
7. Tambahkan dua buah TabSheet dengan cara mengklik kanan komponen PageControl1, kemudian pilih New Page. Atur property seperti table di bawah ini :
Komponen TabSheet1 TabSheet2 Parent PageControl1 PageControl1 Property Caption Caption Value Data Member Histori Transaksi
8. Tambahkan GroupBox1 dari tab Standard ke dalam Tabsheet1, ubah property seperti table di bawah ini :
Komponen GroupBox1 Tab Standard Parent TabSheet1 Property Align Caption Value alClient
9. Tambahkan Toolbar1 dari tab Win32 ke dalam GroupBox1, ubah property seperti table di bawah ini :
Komponen ToolBar1 Tab Win32 Parent GroupBox1 Property Autosize ButtonHeight ButtonWidth Value True 44 46
107
10. Tambahkan 4 buah SpeedButton dari tab Additional ke dalam ToolBar1, atur property seperti table di bawah ini :
Komponen SpeedButton1 Tab Additional Parent ToolBar1 Property Caption Glyph Tag Caption Glyph Tag Caption Glyph Tag Caption Glyph Tag Layout Width Flat Height Value Simpan Simpan.bmp 1 Hapus Hapus.bmp 2 Kartu Printer.bmp 3 Batal Batal.bmp 4 blTop 46 True 44
SpeedButton2
Additional
ToolBar1
SpeedButton3
Additional
ToolBar1
SpeedButton4
Additional
ToolBar1
SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4
11. Tambahkan ADOTable1 dari tab ADO, atur property seperti table di bawah ini :
Komponen ADOTable1 Tab ADO Parent FMember Property Connection Name TableName Value FUtama.ADOConnection1 Member Member
12. Buat persistent field table Member, klik dua kali Member pada Object TreeView untuk membuka Field Editor, klik kanan pada field editor pilih Add All Fields (lihat latihan 18 point 16). 13. Masih di field editor table Member, pastikan semua field telah terpilih (kalau belum, klik kanan Field Editor, pilih Select All), kemudian lakukan drag and drop seluruh field ke dalam GroupBox1. 14. Hapus DBEdit5 dari GroupBox1, gantikan dengan DBCombobox1 dari tab Data Control, ubah property seperti table di bawah ini :
Komponen DBCombobox1 Tab Data Control Parent GroupBox1 Property DataSource DataField Items Value DataSource1 TandaPengenal KTP SIM
15. Hapus DBEdit9 dari GroupBox1, gantikan dengan DateTimePicker1 dari tab Win32. 16. Hapus DBEdit10 dari GroupBox1, gantikan dengan DBCombobox2 dari tab Data Control, ubah property seperti table di bawah ini :
108
Komponen DBCombobox2
Tab Data Control
Parent GroupBox1
Property DataSource DataField Items
Value DataSource1 Status AKTIF TIDAK AKTIF
17. Ubah property untuk komponen Data Control seperti table di bawah ini :
Komponen DBEdit1, DBEdit11 DBEdit1, DBEdit2, DBEdit3, DBEdit4, DBCombobox1, DBEdit6, DBEdit7, DBEdit8, DBCombobox2, DBEdit11 DBImage1 Property Enabled CharCase Value False ecUpperCase
Center Stretch
True True
18. Tambahkan OpenPictureDialog1 dari tab Dialogs. 19. Tambahkan BitBtn1 dari tab Additional ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen BitBtn1 Tab Additional Parent GroupBox1 Property Caption Glyph Value Cari Cari.bmp
20. Tambahkan DBNavigator1 dari tab Data Control ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen DBNavigator1 Tab Data Control Parent GroupBox1 Property Align Datasource Flat VisibleButtons.nbInsert VisibleButtons.nbDelete VisibleButtons.nbEdit VisibleButtons.nbPost VisibleButtons.nbCancel VisibleButtons.nbRefresh Value alBottom Datasource1 True False False False False False False
21. Tambahkan ADOQuery1 dari tab ADO, atur property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent FMember Property Connection Datasource Name SQL Value FUtama.ADOConnection1 DataSource1 qTransaksi Select Pinjam.TglPinjam, DPinjam.KoleksiID, (Select Koleksi.Judul From Koleksi Where DPinjam.KoleksiID = Koleksi.KoleksiID) as Judul,
109
(Select Kembali.TglKembali From Kembali Where DPinjam.KembaliID = Kembali.KembaliID) as TglKembali From Pinjam, DPinjam Where (Pinjam.PinjamID = DPinjam.PinjamID) and (Pinjam.MemberID = :MemberID) Order by Pinjam.TglPinjam
22. Pilih qTransaksi pada Object Treeview, klik tombol ellipsis pada property Parameters untuk membuka jendela Edit Parameters, pilih MemberID (lihat gambar), ubah property seperti table di bawah ini :
Komponen TParameters[0] Property DataType Value ftInteger
23. Buat persistent field untuk query qTransaksi, klik dua kali qTransaksi pada Object TreeView untuk membuka field editor, kemudian klik kanan pada field editor dan pilih Add All Fields. Kalau gagal, coba periksa kembali property SQL pada qTransaksi, mungkin ada kesalahan penulisan script. 24. Tambahkan Datasource2 dari tab Data Access, ubah property seperti table di bawah ini :
Komponen Datasource2 Tab Data Access Parent FMember Property Dataset Value qTransaksi
25. Atur layout form FMember seperti gambar di bawah ini :
110
26. Atur urutan tab pada GroupBox1 dengan cara klik kanan GroupBox1, pilih Tab Order, kemudian atur urutan tab dengan urutan seperti gambar berikut :
27. Tambahkan variable MemberID dengan type Integer pada blok Public di unit UFMember, lihat gambar berikut :
111
28. Pilih FMember pada Object TreeView, buat event OnCreate, OnShow dan OnClose, ketikkan perintah seperti table di bawah ini :
Komponen FMember Event onCreate Code procedure TFMember.FormCreate(Sender: TObject); begin MemberID := 0; PageControl1.ActivePageIndex := 0; end; procedure TFMember.FormShow(Sender: TObject); begin Randomize; Member.Open; qTransaksi.Open; If MemberID > 0 then Member.Locate('MemberID', MemberID, []) else Member.Insert; If FUtama.HakAkses = 0 then DBEdit11.PasswordChar := '*' else DBEdit11.PasswordChar := #0; end; procedure TFMember.FormClose(Sender: TObject; var Action: TCloseAction); begin MemberID := 0; qTransaksi.Close; Member.Close; end;
onShow
onClose
29. Pilih SpeedButton1, SpeedButton2, SpeedButton3 dan SpeedButton4 pada Object TreeView, buat event OnClick, ketikkan perintah seperti table di bawah ini :
Komponen SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4 Event onClick Code procedure TFMember.SpeedButton1Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : Member.Post; 2 : Member.Delete; 3:; 4 : Member.Cancel; End; If (Sender as TSpeedButton).Tag in [2,4] then Close; end;
112
30. Pilih Member pada Object TreeView, buat event AfterScroll, BeforeDelete, BeforePost dan onNewRecord, ketikkan perintah seperti table di bawah ini :
Komponen Member Event AfterScroll Code procedure TFMember.MemberAfterScroll(DataSet: TDataSet); begin DateTimePicker1.Date := MemberTglDaftar.Value; end; procedure TFMember.MemberBeforeDelete(DataSet: TDataSet); begin If MessageDlg('Hapus data?',mtConfirmation, [mbYes, mbNo], 0) = mrNo then Abort; end; procedure TFMember.MemberBeforePost(DataSet: TDataSet); begin MemberTglDaftar.Value := DateTimePicker1.Date; end; procedure TFMember.MemberNewRecord(DataSet: TDataSet); begin If DBEdit2.Enabled then ActiveControl := DBEdit2; MemberKota.Value := 'BANJARMASIN'; MemberTandaPengenal.Value := 'KTP'; MemberTglDaftar.Value := Now; MemberStatus.Value := 'AKTIF'; MemberPasswords.Value := FormatFloat('0000', Random(9999)); end;
BeforeDelete
BeforePost
onNewRecord
Komponen DataSource1 Event onStateChange Code procedure TFMember.DataSource1StateChange(Sender: TObject); begin SpeedButton1.Enabled := (Member.State in dsEditModes) and (FUtama.HakAkses in [1,2]); SpeedButton2.Enabled := (Member.State in [dsBrowse]) and (FUtama.HakAkses in [1,2]); SpeedButton3.Enabled := (Member.State in [dsBrowse]) and (FUtama.HakAkses in [1,2]); BitBtn1.Enabled := (FUtama.HakAkses in [1,2]); DBEdit2.Enabled := FUtama.HakAkses in [1,2]; DBEdit3.Enabled := FUtama.HakAkses in [1,2]; DBEdit4.Enabled := FUtama.HakAkses in [1,2]; DBCombobox1.Enabled := FUtama.HakAkses in [1,2]; DBEdit6.Enabled := FUtama.HakAkses in [1,2]; DBEdit7.Enabled := FUtama.HakAkses in [1,2]; DBEdit8.Enabled := FUtama.HakAkses in [1,2]; DateTimePicker1.Enabled := FUtama.HakAkses in [1,2]; DBCombobox2.Enabled := FUtama.HakAkses in [1,2]; DBNavigator1.Enabled := FUtama.HakAkses in [1,2]; end;
113
Komponen BitBtn1 Event onClick Code procedure TFMember.BitBtn1Click(Sender: TObject); begin With OpenPictureDialog1 do Begin If Execute then Begin If Member.State in [dsBrowse] then Member.Edit; DBImage1.Picture.LoadFromFile(FileName); End; End; end;
33. Pilih TabSheet2 pada Object TreeView. 34. Tambahkan DBGrid1 dari tab Data Control ke dalam TabSheet2, ubah property seperti table di bawah ini :
Komponen DBGrid1 Tab Data Control Parent TabSheet2 Property Align Datasource Value alClient DataSource2
35. Klik dua kali DBGrid1 pada Object TreeView untuk membuka Column Editor. Klik kanan pada Column Editor, pilih Add All Fields (lihat gambar dibawah ini). Atur property untuk masing-masing kolom seperti table di bawah ini :
Komponen DBGrid1.Columns[0]
DBGrid1.Columns[1]
Property Title.Alignment Title.Caption Title.Font.Style.fsBold Width Title.Alignment Title.Caption Title.Font.Style.fsBold
Value taCenter Tgl Pinjam True 100 taCenter #Koleksi True
114
DBGrid1.Columns[3]
Property Width Title.Alignment Title.Caption Title.Font.Style.fsBold Width Title.Alignment Title.Caption Title.Font.Style.fsBold Width
Value 60 taCenter Judul True 250 taCenter Tgl Kembali True 100
36. Pada tahap ini seharusnya FMember mempunyai tampilan seperti gambar berikut ini :
37. Kembali ke form FUtama, klik menu View Form, pilih FUtama, klik OK untuk melanjutkan. 38. Klik menu File Use Unit, pilih FMember, klik OK untuk melanjutkan. 39. Pilih Member1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Member1 Event onClick Code procedure TFUtama.Member1Click(Sender: TObject); begin FMember.ShowModal; end;
40. Pilih SpeedButton1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen SpeedButton1 Event onClick Code procedure TFUtama.SpeedButton1Click(Sender: TObject); begin FMember.ShowModal; end;
115
Tugas :
1. Selesaikan Latihan 17, 18, 19, 20, dan 21. 2. Masukkan minimal 10 data member member lengkap dengan foto melalui form Member. 3. Tugas akan diperiksa pada pertemuan berikutnya.
Perbaikan (Khusus kelas 3E dan 3G) :
NEW
1. Lakukan perbaikan pada Latihan 21 (Membuat Form Member) : Point 10, 20, 21 - 24, 26, 28, 29, 31 dan 32.
116
Cara Instalasi QuickReport di Delphi 7.0
QuickReport merupakan komponen yang dapat digunakan untuk membuat laporan dengan berbagai macam bentuk. Seperti pendahulunya, QuickReport juga disertakan dalam Delphi 7.0 tetapi tidak secara otomatis terpasang pada proses instalasi Delphi 7.0. Berikut adalah langkah-langkah instalasi QuickReport pada Delphi 7.0 :
1. Jalankan aplikasi Delphi. 2. Klik menu Components Install Packages, klik Add untuk menambahkan paket baru.
3. Cari file dcltqr70.bpl pada lokasi C:\Program Files\Borland\Delphi7\Bin. Klik Open untuk membuka file tersebut. Klik OK untuk menutup Project Options.
4. Pada tahap ini seharusnya komponen QuickReport sudah terpasang dengan baik.
117
Latihan 22 : Membuat QuickReport Kartu Member
Kartu member dibuat menggunakan komponen QuickReport. Pastikan QuickReport sudah terpasang pada Delphi 7.0, karena QuickReport tidak otomatis terpasang pada instalasi Delphi 7.0. Jika belum lihat dokumen instalasi QuickReport di Delphi 7.0. Langkah-langkah :
1. Pastikan project Rental.dpr telah dibuka. 2. Buat Report baru, klik menu File New Others, pada tab New pilih Reports, klik OK untuk melanjutkan.
3. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 4. Tambahkan ADOQuery1 dari tab ADO, ubah property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent QuickReport1 Property Connection Name SQL Value FUtama.ADOConnection1 qMember Select Member.* From Member Where (Member.MemberID = :MemberID)
5. Pilih qMember pada Object TreeView, klik tombol ellipsis pada property Parameters untuk membuka jendela Edit Parameters, pilih MemberID, ubah property seperty table di bawah ini :
118
6. Buat persistent field untuk qMember, klik dua kali qMember pada Object TreeView, klik kanan di field editor, pilih Add All Fields. 7. Pilih QuickReport1 pada Object TreeView, ubah property seperti table di bawah ini :
Komponen QuickReport1 Property Dataset Name Value qMember QRKartuMember
8. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UQRKartuMember.pas dalam folder Rental. 9. Klik dua kali QRKartuMember pada Object TreeView untuk membuka jendela Report Settings. 10. Pada jendela Report Settings, ubah Units menjadi MM, klik Apply. 11. Masih pada jendela Report Settings, ubah setting lainnya seperti gambar berikut ini, setelah selesai klik OK untuk melanjutkan :
12. Tambahkan 14 buah QRLabel dari tab QReports ke dalam TitleBand1, ubah property seperti table dibawah ini :
Komponen QRLabel1 Tab QReports Parent TitleBand1 Property Alignment AlignToBand AutoSize Caption Font.Size Value taCenter True True KARTU MEMBER 10
119
Komponen QRLabel2 QRLabel3 QRLabel4 QRLabel5 QRLabel6 QRLabel7, QRLabel8, QRLabel9, QRLabel10, QRLabel11 QRLabel12 QRLabel13 QRLabel14
Tab QReports QReports QReports QReports QReports QReports
Parent TitleBand1 TitleBand1 TitleBand1 TitleBand1 TitleBand1 TitleBand1
Property Font.Style.fsBold Caption Caption Caption Caption Caption Caption
Value True #Member Nama Member Alamat Telepon Handphone :
QReports QReports QReports
TitleBand1 TitleBand1 TitleBand1
Caption Caption Caption
NamaRental AlamatRental TelpRental
13. Tambahkan 5 buah QRDBText dan 1 buah QRDBImage dari tab QReports ke dalam TitleBand1, ubah property seperti table di bawah ini :
Komponen QRDBText1, QRDBText2, QRDBText3, QRDBText4, QRDBText5, QRDBImage1 QRDBText1 QRDBText2 QRDBText3 QRDBText4 QRDBText5 QRDBImage1
Tab
Parent
Property Dataset
Value qMember
QReports QReports QReports QReports QReports QReports
TitleBand1 TitleBand1 TitleBand1 TitleBand1 TitleBand1 TitleBand1
DataField DataField DataField DataField DataField DataField Stretch
MembeID Nama Alamat TeleponRumah Handphone Photo True
14. Atur layout QRKartuMember seperti gambar di bawah ini :
15. Kembali ke form FMember, klik menu View Form, pilih FMember, klik OK untuk melanjutkan.
120
16. Klik menu File Use Unit, pilih UQRKartuMember, klik OK untuk melanjutkan. 17. Buat procedure CetakKartu pada blok private, tekan Ctrl+Shift+C untuk membuat blok procedure, ketikkan perintah seperti pada table di bawah ini :
Komponen FMember Procedure CetakKartu Code procedure TFMember.CetakKartu; begin With QRKartuMember do Begin qMember.Close; qMember.Parameters[0].Value := MemberMemberID.Value; qMember.Open; QRLabel12.Caption := FUtama.NamaRental; QRLabel13.Caption := FUtama.AlamatRental; QRLabel14.Caption := FUtama.TelpRental; Preview; End; end;
18. Pilih SpeedButton3 pada Object TreeView, perbarui event onClick seperti table di bawah ini :
Komponen SpeedButton3 Event onClick Code procedure TFMember.SpeedButton1Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : Member.Post; 2 : Member.Delete; 3 : CetakKartu; 4 : Member.Cancel; End; If (Sender as TSpeedButton).Tag in [2,4] then Close; end;
121
Latihan 23 : Membuat Form Koleksi
Form koleksi digunakan untuk mengelola data koleksi yang meliputi judul, kategori, jenis koleksi, harga sewa, harga denda serta jumlah koleksi. Form Koleksi juga menyimpan gambar cover koleksi serta dapat menampilkan preview dalam bentuk video pendek. Selain itu Form Koleksi juga menyajikan histori transaksi untuk tiap koleksi. Langkah-langkah :
1. Pastikan project Rental.dpr telah dibuka. 2. Buat Form baru, klik menu File New Form. 3. Ubah property form yang baru dibuat seperti pada table di bawah ini :
Komponen Form1 Property Caption BorderStyle Name Position Value Koleksi bsDialog FKoleksi poDesktopCenter
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFKoleksi.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih FUtama, klik OK untuk melanjutkan. 6. Tambahkan PageControl1 dari tab Win32, ubah property seperti table di bawah ini :
Komponen PageControl1 Tab Win32 Parent FKoleksi Property Align Value alClient
7. Tambahkan dua buah TabSheet dengan cara mengklik kanan komponen PageControl1, kemudian pilih New Page. Atur property seperti table di bawah ini ;
Komponen TabSheet1 TabSheet2 Parent PageControl1 PageControl1 Property Caption Caption Value Data Koleksi Histori Transaksi
8. Tambahkan GroupBox1 dari tab Standard ke dalam TabSheet1, ubah property seperti table di bawah ini :
Komponen GroupBox1 Tab Standard Parent TabSheet1 Property Align Caption Value alClient
9. Tambahkan ToolBar1 dari tab Win32 ke dalam GroupBox1, ubah property seperti table di bawah ini :
Komponen ToolBar1 Tab Win32 Parent GroupBox1 Property Autosize ButtonHeight Value True 44
122
Komponen
Tab
Parent
Property ButtonWidth
Value 46
Komponen SpeedButton1 Tab Additional Parent ToolBar1 Property Caption Glyph Tag Caption Glyph Tag Caption Glyph Tag Layout Width Flat Height Value Simpan Simpan.bmp 1 Hapus Hapus.bmp 2 Batal Batal.bmp 3 blTop 46 True 44
SpeedButton2
Additional
ToolBar1
SpeedButton3
Additional
ToolBar1
SpeedButton1, SpeedButton2, SpeedButton3
11. Tambahkan 3 buah ADOTable dari tab ADO, atur property seperti table di bawah ini :
Komponen ADOTable1 Tab ADO Parent FKoleksi Property Connection Name TableName Connection Name TableName Connection Name TableName Value FUtama.ADOConnection1 Koleksi Koleksi FUtama.ADOConnection1 Karyawan Karyawan FUtama.ADOConnection1 Pemasok Pemasok
ADOTable2
ADO
FKoleksi
ADOTable3
ADO
FKoleksi
12. Buat persistent field untuk table Koleksi, klik dua kali Koleksi pada Object TreeView untuk membuka field editor, klik kanan pada field editor pilih Add All Fields. 13. Buat persistent field untuk table Karyawan, klik dua kali Karyawan pada Object TreeView untuk membuka field editor, klik kanan pada field editor pilih Add All Fields. 14. Buat persistent field untuk table Pemasok, klik dua kali Pemasok pada Object TreeView untuk membuka field editor, klik kanan pada field editor pilih Add All Fields. Berikut hasil langkah ke 12, 13, dan 14 :
123
15. Tambahkan field baru NamaPemasok pada table Koleksi dengan cara klik dua kali Koleksi untuk membuka field editor, kemudian pilih New Field untuk membuka jendela New Field, lihat gambar berikut :
Isi informasi seperti pada table di bawah ini (lihat gambar di atas) :
Field NamaPemasok Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value NamaPemasok String 30 Lookup PemasokID Pemasok PemasokID Nama
Field type Lookup Definition
16. Tambahkan field baru NamaKaryawan pada table koleksi, klik dua kali Koleksi pada Object TreeView untuk membuka field editor, klik kanan pada field editor kemudian pilih New Fields. Lengkapi informasi pada jendela New Field seperti pada table di bawah ini (lihat langkah 15) :
124
Field NamaKaryawan
Section Field Properties
Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field
Value NamaKaryawan String 30 Lookup KaryawanID Karyawan KaryawanID Nama
17. Klik dua kali Koleksi untuk membuka field editor, lakukan drag and drop field KoleksiID, Judul dan PemeranUtama ke dalam GroupBox1. 18. Tambahkan 3 buah Label dari tab Standard, ubah property seperti table di bawah ini :
Komponen Label3 Label4 Label5 Tab Standard Standard Standard Parent GroupBox1 GroupBox1 GroupBox1 Property Caption Caption Caption Value Kategori Jenis Koleksi Tgl Beli
19. Tambahkan 2 buah DBCombobox1 dari tab Data Control ke dalam GroupBox1, ubah property seperti table di bawah ini :
Komponen DBCombobox1, DBCombobox2 DBCombobox1 Tab Parent Property Datasource Sorted Style Datafield Items Value Datasource1 True csDropdownlist Kategori ACTION DRAMA DRAMA MUSICAL HOROR HOROR KOMEDI KARTUN KOMEDI KOMEDI ROMANTIS LAIN-LAIN JenisKoleksi CD CD AUDIO CD MP3 DVD
DataControl
GroupBox1
DBCombobox2
DataControl
GroupBox1
Datafield Items
20. Tambahkan 1 buah DateTimePicker dari tab Win32 ke dalam GroupBox1. 21. Klik dua kali Koleksi untuk membuka field editor, lakukan drag and drop field HargaBeli, PemasokID, NamaPemasok, LamaSewa, HargaSewa, HargaDenda, Jumlah, KaryawanID, NamaKaryawan, Cover dan Preview secara berurutan ke dalam GroupBox1. 22. Ubah property untuk komponen berikut :
Komponen DBEdit1, DBEdit10, DBLookupCombobox2 Property Enabled Value False
125
Komponen DBEdit1, DBEdit2, DBCombobox1, DBCombobox2, DBEdit3, DBEdit4, DBEdit5, DBEdit6, DBEdit7, DBEdit8, DBEdit9, DBEdit11 DBImage1
Property Charcase
Value ecUpperCase
Stretch
True
23. Tambahkan 2 buah BitBtn dari tab Additional ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen BitBtn1 BitBtn2 BitBtn1, BitBtn2 Tab Additional Additional Parent GroupBox1 GroupBox1 Property Caption Caption Glyph Value Cover Video Cari.bmp
24. Tambahkan 1 buah Panel dari tab Standard ke dalam GroupBox1. 25. Tambahkan 1 buah MediaPlayer dari tab System ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen MediaPlayer1 Tab System Parent GroupBox1 Property Display VisibleButtons.btNext VisibleButtons.btPrev VisibleButtons.btStep VisibleButtons.btBack VisibleButtons.btRecord VisibleButtons.btEject Value Panel1 False False False False False False
26. Tambahkan DBNavigator1 dari tab DataControl ke dalam GroupBox1, atur property seperti table di bawah ini :
27. Tambahkan OpenPictureDialog1 dari tab Dialogs ke dalam GroupBox1. 28. Tambahkan OpenDialog1 dari tab Dialogs ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen OpenDialog1 Tab Dialogs Parent GroupBox1 Property Filter Value Filter Name File Video (*.wmv, Filter *.wmv; *.avi;
126
Komponen
Tab
Parent
Property Title
Value *.avi, *.mpg) Cari Video
*.mpg
29. Tambahkan ADOQuery1 dari tab ADO, atur property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent FMember Property Connection Datasource Name SQL Value FUtama.ADOConnection1 DataSource1 qTransaksi Select Pinjam.TglPinjam, Pinjam.MemberID, (Select Member.Nama From Member Where Pinjam.MemberID = Member.MemberID) as NamaMember, DPinjam.TglHarusKembali, (Select Kembali.TglKembali From Kembali Where DPinjam.KembaliID = Kembali.KembaliID) as TglKembali From Pinjam, DPinjam Where (Pinjam.PinjamID = DPinjam.PinjamID) and (DPinjam.KoleksiID = :KoleksiID) Order by Pinjam.TglPinjam
30. Pilih qTransaksi pada Object TreeView, klik tombol ellipsis pada property Parameters untuk membuka jendela Edit Parameters, pilih KoleksiID, ubah property seperti table di bawah ini :
31. Buat persistent field untuk query qTransaksi, klik dua kali qTransaksi pada Object TreeView untuk membuka field editor, kemudian klik kanan pada field editor dan pilih Add All Fields. 32. Tambahkan Datasource2 dari tab Data Access, ubah property seperti table di bawah ini :
Komponen Datasource2 Tab Data Access Parent FMember Property Dataset Value qTransaksi
33. Atur layout form FKoleksi seperti gambar di bawah ini :
127
34. Tambahkan variable KoleksiID dengan type Integer pada blok Public di unit UFKoleksi, lihat gambar berikut :
35. Pilih FKoleksi pada Object TreeView, buat event onCreate, OnShow dan OnClose, ketikkan perintah seperti table di bawah ini :
Komponen FKoleksi Event onCreate Code procedure TFKoleksi.FormCreate(Sender: TObject); begin KoleksiID := 0; PageControl1.ActivePageIndex := 0; end; procedure TFKoleksi.FormShow(Sender: TObject); begin Koleksi.Open; Karyawan.Open; Pemasok.Open; qTransaksi.Open; If KoleksiID > 0 then Koleksi.Locate('KoleksiID', KoleksiID, []) else Koleksi.Insert; end;
onShow
128
Komponen
Event onClose
Code procedure TFKoleksi.FormClose(Sender: TObject; var Action: TCloseAction); begin KoleksiID := 0; qTransaksi.Close; Karyawan.Close; Pemasok.Close; Koleksi.Close; MediaPlayer1.Close; end;
36. Pilih SpeedButton1, SpeedButton2 dan SpeedButton3 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen SpeedButton1, SpeedButton2, SpeedButton3 Event onClick Code procedure TFKoleksi.SpeedButton1Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : Koleksi.Post; 2 : Koleksi.Delete; 3 : Koleksi.Cancel; End; If (Sender as TSpeedButton).Tag <> 1 then Close; end;
37. Pilih Koleksi pada Object TreeView, buat event AfterScroll, BeforeDelete, BeforePost dan onNewRecord, ketikkan perintah seperti table di bawah ini :
Komponen Koleksi Event AfterScroll Code procedure TFKoleksi.KoleksiAfterScroll(DataSet: TDataSet); begin MediaPlayer1.Close; DateTimePicker1.Date := KoleksiTglBeli.Value; If FileExists(KoleksiPreview.Value) then Begin MediaPlayer1.FileName := KoleksiPreview.Value; MediaPlayer1.Open; MediaPlayer1.DisplayRect := Rect(10,10,Panel1.Width - 20, Panel1.Height - 20); End Else MediaPlayer1.FileName := ''; end; procedure TFKoleksi.KoleksiBeforeDelete(DataSet: TDataSet); begin If MessageDlg('Hapus data?',mtConfirmation, [mbYes, mbNo], 0) = mrNo then Abort; end; procedure TFKoleksi.KoleksiBeforePost(DataSet: TDataSet); begin KoleksiTglBeli.Value := DateTimePicker1.Date; end;
BeforeDelete
BeforePost
129
Komponen
Event onNewRecord
Code procedure TFKoleksi.KoleksiNewRecord(DataSet: TDataSet); begin If DBEdit2.Enabled then ActiveControl := DBEdit2; KoleksiTglBeli.Value := Now; DateTimePicker1.Date := KoleksiTglBeli.Value; KoleksiHargaBeli.Value := 0; KoleksiLamaSewa.Value := 2; KoleksiHargaSewa.Value := 3000; KoleksiHargaDenda.Value := 3000; KoleksiJumlah.Value := 1; KoleksiKaryawanID.Value := FUtama.KaryawanID; end;
Komponen DataSource1 Event onStateChange Code procedure TFKoleksi.DataSource1StateChange(Sender: TObject); begin SpeedButton1.Enabled := (Koleksi.State in dsEditModes) and (FUtama.HakAkses in [1,2]); SpeedButton2.Enabled := (Koleksi.State in [dsBrowse]) and (FUtama.HakAkses in [1,2]); DBEdit2.Enabled := FUtama.HakAkses in [1,2]; DBCombobox1.Enabled := FUtama.HakAkses in [1,2]; DBCombobox2.Enabled := FUtama.HakAkses in [1,2]; DateTimePicker1.Enabled := FUtama.HakAkses in [1,2]; DBEdit3.Enabled := FUtama.HakAkses in [1,2]; DBEdit4.Enabled := FUtama.HakAkses in [1,2]; DBLookUpCombobox1.Enabled := FUtama.HakAkses in [1,2]; DBEdit5.Enabled := FUtama.HakAkses in [1,2]; DBEdit6.Enabled := FUtama.HakAkses in [1,2]; DBEdit7.Enabled := FUtama.HakAkses in [1,2]; DBEdit8.Enabled := FUtama.HakAkses in [1,2]; DBEdit10.Enabled := FUtama.HakAkses in [1,2]; DBImage1.Enabled := FUtama.HakAkses in [1,2]; BitBtn1.Enabled := FUtama.HakAkses in [1,2]; BitBtn2.Enabled := FUtama.HakAkses in [1,2] end;
Komponen BitBtn1 Event onClick Code procedure TFKoleksi.BitBtn1Click(Sender: TObject); begin With OpenPictureDialog1 do Begin If Execute then Begin If Koleksi.State in [dsBrowse] then Koleksi.Edit; DBImage1.Picture.LoadFromFile(FileName); End; End;
130
Komponen
Event
Code end;
Komponen BitBtn2 Event onClick Code procedure TFKoleksi.BitBtn2Click(Sender: TObject); begin With OpenDialog1 do Begin If Execute then Begin If Koleksi.State in [dsBrowse] then Koleksi.Edit; KoleksiPreview.Value := FileName; MediaPlayer1.FileName := FileName; MediaPlayer1.Open; MediaPlayer1.DisplayRect := Rect(10, 10, Panel1.Width - 20, Panel1.Height - 20); End; End; end;
41. Pilih TabSheet2 pada Object TreeView. 42. Tambahkan DBGrid1 dari tab Data Control ke dalam TabSheet2, ubah property seperti table di bawah ini :
Komponen DBGrid1 Tab Data Control Parent TabSheet2 Property Align Datasource Value alClient DataSource2
43. Klik dua kali DBGrid1 pada Object TreeView untuk membuka Column Editor. Klik kanan pada Column Editor, pilih Add All Fields. Atur property masing-masing kolom seperti table di bawah ini :
Komponen DBGrid1.Columns[0] Property Title.Alignment Title.Caption Title.Font.Style.fsBold Width Title.Alignment Title.Caption Title.Font.Style.fsBold Width Title.Alignment Title.Caption Title.Font.Style.fsBold Width Title.Alignment Title.Caption Title.Font.Style.fsBold Width Title.Alignment Value taCenter Tgl Pinjam True 100 taCenter #Member True 60 taCenter Nama Member True 250 taCenter Tgl Harus Kembali True 120 taCenter
DBGrid1.Columns[1]
DBGrid1.Columns[2]
DBGrid1.Columns[3]
DBGrid1.Columns[4]
131
Komponen
Property Title.Caption Title.Font.Style.fsBold Width
Value Tgl Kembali True 100
44. Pada tahap ini seharusnya FKoleksi mempunyai tampilan seperti gambar di bawah ini :
45. Kembali ke form FUtama, klik menu View Form, pilih FUtama, klik OK untuk melanjutkan. 46. Klik menu File Use Unit, pilih FKoleksi, klik OK untuk melanjutkan. 47. Pilih Koleksi1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Koleksi1 Event onClick Code procedure TFUtama.Koleksi1Click(Sender: TObject); begin FKoleksi.ShowModal; end;
48. Pilih SpeedButton2 pada Object TreeView, buat event OnClick, ketikkan perintah seperti table di bawah ini :
Komponen SpeedButton2 Event onClick Code procedure TFUtama.SpeedButton2Click(Sender: TObject); begin FKoleksi.ShowModal; end;
132
Latihan 24 : Membuat Form Pemasok
Form pemasok digunakan untuk mengelola data pemasok yang meliputi nama, alamat, kota dan no. telepon. Table pemasok merupakan table master yang hanya boleh dibuka dengan hak akses pemilik/administrator. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position Value Pemasok bsDialog FPemasok poDesktopCenter
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFPemasok.pas dalam folder rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan GroupBox1 dari tab Standard ke dalam FPemasok, ubah property seperti table di bawah ini :
Komponen GroupBox1 Tab Standard Parent FPemasok Property Align Caption Value alClient
7. Tambahkan ToolBar1 dari tab Win32 ke dalam GroupBox1, ubah property seperti table di bawah ini :
Komponen ToolBar1 Tab Win32 Parent GroupBox1 Property Autosize ButtonHeight ButtonWidth Value True 44 46
Komponen SpeedButton1 Tab Additional Parent ToolBar1 Property Caption Glyph Tag Caption Glyph Tag Caption Glyph Tag Caption Glyph Value Baru Baru.bmp 1 Simpan Simpan.bmp 2 Hapus Hapus.bmp 3 Batal Batal.bmp
SpeedButton1
Additional
ToolBar1
SpeedButton2
Additional
ToolBar1
SpeedButton3
Additional
ToolBar1
133
SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4
Tag Layout Width Flat Height
4 blTop 46 True 44
9. Tambahkan 2 buah GroupBox dari tab Standard ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen GroupBox2 GroupBox3 Tab Standard Standard Parent GroupBox1 GroupBox1 Property Align Caption Align Caption Value alLeft alClient
Komponen ADOTable1 Tab ADO Parent FPemasok Property Connection Name TableName Value FUtama.ADOConnection1 Pemasok Pemasok
11. Buat persistent field untuk table Pemasok, klik dua kali Pemasok pada Object TreeView, klik kanan pada field editor, pilih Add All Fields. 12. Masih di field editor table Pemasok, pilih semua field (jika belum, klik kanan pada field editor, pilih Select All), lakukan drag and drop seluruh field ke GroupBox3. 13. Ubah property untuk komponen Data Control seperti table di bawah ini :
Komponen DBEdit1 DBEdit1, DBEdit2, DBEdit3, DBEdit4, DBEdit5 Property Enabled CharCase Value False ecUpperCase
14. Tambahkan DBGrid1 dari tab Data Control ke dalam GroupBox2, atur property seperti table di bawah ini :
Komponen DBGrid1 Tab Data Control Parent GroupBox2 Property Align Datasource Options.dgRowSelect Options.dgAlwaysShowSelection Options.dgEditing Value alClient Datasource1 False False True
15. Klik dua kali DBGrid1 untuk membuka Column Editor, klik kanan pada Column Editor, pilih Add All Fields. Dari daftar kolom yang ada, hapus semua kolom kecuali PemasokID dan Nama. Atur property masingmasing kolom seperti table di bawah ini :
Komponen Property Value
134
DBGrid1.Columns[1]
Property Title.Alignment Title.Caption Title.Font.Style.fsBold Width Title.Alignment Title.Caption Title.Font.Style.fsBold Width
Value taCenter PemasokID True 100 taCenter Nama Pemasok True 60
16. Atur layout form FPemasok seperti gambar di bawah ini :
17. Pilih FPemasok pada Object TreeView, buat event onShow dan onClose, ketikkan perintah seperti table di bawah ini :
Komponen FPemasok Event onShow Code procedure TFPemasok.FormShow(Sender: TObject); begin Pemasok.Open; end; procedure TFPemasok.FormClose(Sender: TObject; var Action: TCloseAction); begin Pemasok.Close; end;
onClose
18. Pilih SpeedButton1, SpeedButton2, SpeedButton3 dan SpeedButton4 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4 Event onClick Code procedure TFPemasok.SpeedButton2Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : Pemasok.Insert; 2 : Pemasok.Post; 3 : Pemasok.Delete;
135
Komponen
Event
Code 4 : Pemasok.Cancel; End; end;
19. Pilih Pemasok pada Object TreeView, buat event onNewRecord, ketikkan perintah seperti table di bawah ini :
Komponen Member Event onNewRecord Code procedure TFPemasok.PemasokNewRecord(DataSet: TDataSet); begin PemasokKota.Value := 'BANJARMASIN'; end;
Komponen DataSource1 Event onStateChange Code procedure TFPemasok.DataSource1StateChange(Sender: TObject); begin SpeedButton1.Enabled := (Pemasok.State in [dsBrowse]) and (FUtama.HakAkses in [2]); SpeedButton2.Enabled := (Pemasok.State in dsEditModes) and (FUtama.HakAkses in [2]); SpeedButton3.Enabled := (Pemasok.State in [dsBrowse]) and (FUtama.HakAkses in [2]); SpeedButton4.Enabled := (Pemasok.State in dsEditModes) and (FUtama.HakAkses in [2]); DBEdit2.Enabled := FUtama.HakAkses in [2]; DBEdit3.Enabled := FUtama.HakAkses in [2]; DBEdit4.Enabled := FUtama.HakAkses in [2]; DBEdit5.Enabled := FUtama.HakAkses in [2]; end;
21. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 22. Klik menu File Use Unit, pilih FPemasok, klik OK untuk melanjutkan. 23. Pilih Pemasok1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Pemasok1 Event onClick Code procedure TFUtama.Pemasok1Click(Sender: TObject); begin FPemasok.ShowModal; end;
136
Latihan 25 : Membuat Form Karyawan
Form karyawan digunakan untuk mengelola data karyawan yang meliputi nama, alamat, dan no. telepon. Table karyawan merupakan table master yang hanya boleh dibuka dengan hak akses pemilik/administrator. Form karyawan juga digunakan untuk mengatur hak akses dan password yang akan digunakan karyawan untuk login ke dalam aplikasi. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position Value Karyawan bsDialog FKaryawan poDesktopCenter
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFKaryawan.pas dalam folder rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan GroupBox1 dari tab Standard ke dalam FKaryawan, ubah property seperti table di bawah ini :
Komponen GroupBox1 Tab Standard Parent FKaryawan Property Align Caption Value alClient
7. Copy dan paste ToolBar1 dari form FPemasok ke dalam GroupBox1. 8. Tambahkan 2 buah GroupBox dari tab Standard ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen GroupBox2 GroupBox3 Tab Standard Standard Parent GroupBox1 GroupBox1 Property Align Caption Align Caption Value alLeft alClient
Komponen ADOTable1 Tab ADO Parent FKaryawan Property Connection Name TableName Value FUtama.ADOConnection1 Karyawan Karyawan
137
10. Buat persistent field untuk table Karyawan, klik dua kali Karyawan pada Object TreeView, klik kanan pada field editor, pilih Add All Fields. 11. Masih di field editor table Karyawan, pilih semua field (jika belum, klik kanan pada field editor, pilih Select All), lakukan drag and drop seluruh field ke GroupBox3. 12. Ubah property untuk komponen Data Control seperti table di bawah ini :
Komponen DBEdit1 DBEdit1, DBEdit2, DBEdit3, DBEdit4, DBEdit5, DBEdit6, DBEdit7 DBImage1 Property Enabled CharCase Value False ecUpperCase
Stretch
True
13. Tambahkan OpenPictureDialog1 dari tab Dialogs. 14. Tambahkan BitBtn1 dari tab Additional ke dalam GroupBox3, atur property seperti table di bawah ini :
Komponen BitBtn1 Tab Additional Parent GroupBox3 Property Caption Glyph Value Cari Cari.bmp
Komponen DBGrid1 Tab Data Control Parent GroupBox2 Property Align Datasource Options.dgRowSelect Options.dgAlwaysShowSelection Options.dgEditing Value alClient Datasource1 False False True
16. Klik dua kali DBGrid1 untuk membuka Column Editor, klik kanan pada Column Editor, pilih Add All Fields. Dari daftar kolom yang ada, hapus semua kolom kecuali KaryawanID dan Nama. Atur property masingmasing kolom seperti table di bawah ini :
Komponen DBGrid1.Columns[0] Property Title.Alignment Title.Caption Title.Font.Style.fsBold Width Title.Alignment Title.Caption Title.Font.Style.fsBold Width Value taCenter KaryawanID True 100 taCenter Nama Karyawan True 60
DBGrid1.Columns[1]
17. Atur layout form FKaryawan seperti gambar di bawah ini :
138
18. Pilih FKaryawan pada Object TreeView, buat event onShow dan onClose, ketikkan perintah seperti table di bawah ini :
Komponen FPemasok Event onShow Code procedure TFKaryawan.FormShow(Sender: TObject); begin Randomize; Karyawan.Open; end; procedure TFKaryawan.FormClose(Sender: TObject; var Action: TCloseAction); begin Karyawan.Close; end;
onClose
Komponen SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4 Event onClick Code procedure TFKaryawan.SpeedButton1Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : Karyawan.Insert; 2 : Karyawan.Post; 3 : Karyawan.Delete; 4 : Karyawan.Cancel; End; end;
20. Pilih Karyawan pada Object TreeView, buat event onNewRecord, ketikkan perintah seperti table di bawah ini :
Komponen Event Code
139
Komponen Member
Event onNewRecord
Code procedure TFKaryawan.KaryawanNewRecord(DataSet: TDataSet); begin KaryawanKota.Value := 'BANJARMASIN'; KaryawanHakAkses.Value := 1; KaryawanPasswords.Value := FormatFloat('0000', Random(9999)); end;
Komponen DataSource1 Event onStateChange Code procedure TFKaryawan.DataSource1StateChange(Sender: TObject); begin SpeedButton1.Enabled := (Karyawan.State in [dsBrowse]) and (FUtama.HakAkses in [2]); SpeedButton2.Enabled := (Karyawan.State in dsEditModes) and (FUtama.HakAkses in [2]); SpeedButton3.Enabled := (Karyawan.State in [dsBrowse]) and (FUtama.HakAkses in [2]); SpeedButton4.Enabled := (Karyawan.State in dsEditModes) and (FUtama.HakAkses in [2]); DBEdit2.Enabled := FUtama.HakAkses in [2]; DBEdit3.Enabled := FUtama.HakAkses in [2]; DBEdit4.Enabled := FUtama.HakAkses in [2]; DBEdit5.Enabled := FUtama.HakAkses in [2]; DBEdit6.Enabled := FUtama.HakAkses in [2]; DBEdit7.Enabled := FUtama.HakAkses in [2]; DBImage1.Enabled := FUtama.HakAkses in [2]; end;
Komponen BitBtn1 Event onClick Code procedure TFKaryawan.BitBtn1Click(Sender: TObject); begin With OpenPictureDialog1 do Begin If Execute then Begin If Karyawan.State in [dsBrowse] then Karyawan.Edit; DBImage1.Picture.LoadFromFile(FileName); End; End; end;
23. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 24. Klik menu File Use Unit, pilih FPemasok, klik OK untuk melanjutkan. 25. Pilih Karyawan1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
140
Komponen Karyawan1
Event onClick
Code procedure TFUtama.Karyawan1Click(Sender: TObject); begin FKaryawan.ShowModal; end;
Tugas di rumah :
NEW
1. Sempurnakan Latihan 17, 18, 19, 20 dan 21. 2. Selesaikan Latihan 22, 23, 24 dan 25. 3. Masukkan minimal 15 data koleksi lengkap dengan cover dan preview video (kalau ada) melalui form Koleksi. 4. Masukkan minimal 5 data pemasok melalui form Pemasok. 5. Masukkan minimal 5 data karyawan lengkap dengan foto melalui form Karyawan. 6. Tugas akan diperiksa satu persatu pada pertemuan berikutnya. 7. Tolong dicatat dan disampaikan apabila ditemukan adanya kekeliruan pada modul ini.
141
Latihan 26 : Membuat Form Peminjaman
Form Peminjaman digunakan untuk melakukan transaksi peminjaman. Form ini menggunakan konsep master detail gabungan dari table Pinjam dan DPinjam. Pada form ini metode input transaksi dibuat semudah mungkin. Selain itu pada form ini disediakan fasilitas pencarian dan informasi jumlah stok koleksi yang tersedia. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position WindowState Value Peminjaman bsSingle FPinjam poDesktopCenter wsMaximized
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFPinjam.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Copy dan Paste ToolBar1 dari form FMember ke dalam FPinjam, atur kembali property seperti table di bawah ini :
Komponen SpeedButton3 SpeedButton4 Tab Additional Additional Parent ToolBar1 ToolBar1 Property Caption Caption Value Nota Tutup
7. Tambahkan 3 buah Groupbox dari tab Standard ke dalam FPinjam, atur property seperti table di bawah ini :
Komponen GroupBox1 GroupBox2 GroupBox3 Tab Standard Standard Standard Parent FPinjam FPinjam FPinjam Property Align Caption Align Caption Align Caption Value alTop alLeft Koleksi Yang Dipinjam alBottom
8. Tambahkan 1 buah Splitter dari tab Additional ke dalam FPinjam. 9. Tambahkan 1 buah GroupBox dari tab Standar ke dalam FPinjam, atur property seperti table di bawah ini :
Komponen GroupBox4 Tab Standard Parent FPinjam Property Align Caption Value alClient Pencarian Koleksi
142
10. Tambahkan 2 buah ADOTable dan 4 buah ADOQuery, atur property seperti table di bawah ini :
Komponen ADOTable1, ADOTable2, ADOQuery1, ADOQuery2, ADOQuery3, ADOQuery4 ADOTable1 ADOTable2 ADOQuery1 Tab Parent Property Connection Value FUtama.ADOConnection1
ADO ADO ADO
FPinjam FPinjam FPinjam
Name TableName Name TableName Name SQL
ADOQuery2
ADO
FPinjam
Name SQL
ADOQuery3
ADO
FPinjam
Name SQL
ADOQuery4
ADO
FPinjam
Name SQL
Pinjam Pinjam DPinjam DPinjam qMember Select Member.MemberID, Member.Nama, Member.Alamat, Member.Kota, Member.Handphone From Member Order by Member.Nama qKaryawan Select Karyawan.KaryawanID, Karyawan.Nama From Karyawan Order by Karyawan.Nama qKoleksi Select Koleksi.KoleksiID, Koleksi.Judul, Koleksi.HargaSewa, Koleksi.LamaSewa From Koleksi Order by Koleksi.Judul qStock Select Koleksi.KoleksiID, Koleksi.Judul, Koleksi.PemeranUtama, Koleksi.Kategori, Koleksi.JenisKoleksi, (Koleksi.Jumlah (Select Count(DPinjam.DPinjamID) From Pinjam, DPinjam Where (Pinjam.PinjamID = DPinjam.PinjamID) and (DPinjam.KoleksiID = Koleksi.KoleksiID) and (DPinjam.KembaliID = 0))) as stock From Koleksi Where (Koleksi.Judul like :Judul) Or (Koleksi.PemeranUtama like :PemeranUtama) Or (Koleksi.Kategori like :Kategori) Or (Koleksi.JenisKoleksi like :JenisKoleksi)
143
Komponen
Tab
Parent
Property
Value Order by Koleksi.Judul, Koleksi.PemeranUtama
11. Pilih qStock pada Object TreeView, klik tombol ellipsis pada property Parameters untuk membuka jendela Edit Parameters, ubah property seperti table di bawah ini :
Komponen TParameters[0] TParameters[1] TParameters[2] TParameters[3] Property DataType DataType DataType DataType Value ftWideString ftWideString ftWideString ftWideString
12. Buat persistent field table Pinjam, klik dua kali Pinjam pada Object TreeView untuk membuka field editor, klik kanan dan pilih Add All Fields. 13. Dengan cara yang sama dengan point 12, buat persistent field table DPinjam, qMember, qKaryawan, qKoleksi dan qStock. 14. Klik dua kali Pinjam pada Object TreeView untuk membuka field editor, pilih field TotalSewa, ubah property seperti table di bawah ini :
Komponen PinjamTotalSewa Property Currency Value True
15. Klik dua kali DPinjam pada Object TreeView untuk membuka field editor, pilih field HargaSewa, ubah property seperti table di bawah ini :
Komponen DPinjamHargaSewa Property Currency Value True
16. Tambahkan 3 buah DataSource dari tab Data Access, ubah property seperti table di bawah ini ;
Komponen Datasource1 DataSource2 DataSource3 Tab Data Access Data Access Data Access Parent FPinjam FPinjam FPinjam Property Dataset Dataset Dataset Value Pinjam DPinjam qStock
17. Buat hubungan master detail antara table Pinjam dan DPinjam, Pilih table DPinjam pada Object TreeView, ubah property seperti table di bawah ini :
Komponen DPinjam Property MasterSource Value Datasource1
18. Pilih table DPinjam pada Object TreeView, klik tombol ellipsis pada property MasterField untuk membuka Field Link Designer. Pilih PinjamID pada Detail Fields dan PinjamID pada Master Fields. Klik Add untuk menambahkan ke dalam Joined Fields. Klik OK untuk melanjutkan.
144
19. Tambahkan field baru NamaMember pada table Pinjam, klik dua kali Pinjam pada Object TreeView untuk membuka field editor, klik kanan dan pilih New Fields, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field NamaMember Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value NamaMember String 30 Lookup MemberID qMember MemberID Nama
20. Tambahkan field baru Alamat pada table Pinjam, sama seperti point 19, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field Alamat Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value Alamat String 50 Lookup MemberID qMember MemberID Alamat
21. Tambahkan field baru Kota pada table Pinjam, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field Kota Section Field Properties Property Name Type Size Field type Key Fields Value Kota String 30 Lookup MemberID
145
Dataset Lookup Keys Result Field
qMember MemberID Kota
22. Tambahkan field baru Handphone pada table Pinjam, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field Handphone Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value Handphone String 30 Lookup MemberID qMember MemberID Handphone
23. Tambahkan field baru NamaKaryawan pada table Pinjam, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field NamaKaryawan Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value NamaKaryawan String 30 Lookup KaryawanID qKaryawan KaryawanID Nama
24. Klik dua kali DPinjam pada Object TreeView untuk membuka Field Editor, tambahkan field baru JudulKoleksi pada table DPinjam, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field JudulKoleksi Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value JudulKoleksi String 100 Lookup KoleksiID qKoleksi KoleksiID Judul
25. Tambahkan field baru HargaSewaKoleksi pada table DPinjam, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field HargaSewaKoleksi Section Field Properties Field type Lookup Definition Property Name Type Field type Key Fields Dataset Value HargaSewaKoleksi Currency Lookup KoleksiID qKoleksi
146
Lookup Keys Result Field
KoleksiID HargaSewa
26. Tambahkan field baru LamaSewaKoleksi pada table DPinjam, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field LamaSewaKoleksi Section Field Properties Field type Lookup Definition Property Name Type Field type Key Fields Dataset Lookup Keys Result Field Value LamaSewaKoleksi Integer Lookup KoleksiID qKoleksi KoleksiID LamaSewa
27. Klik dua kali Pinjam pada Object TreeView untuk membuka field Editor. Pilih field PinjamID, TglPinjam, MemberID, NamaMember, Alamat, Kota dan Handphone, lakukan drag and drop ke dalam GroupBox1. 28. Tambahkan DBGrid1 dari tab Data Control ke dalam GroupBox2, atur property seperti table di bawah ini :
Komponen DBGrid1 Tab Data Control Parent GroupBox2 Property Align Datasource Options.dgRowSelect Options.dgAlwaysShowSelection Value alClient DataSource2 True True
29. Klik dua kali DBGrid1 pada Object TreeView untuk membuka Column Editor, tambahkan 4 buah column dengan mengklik kanan Column Editor, pilih Add, ubah property masing-masing kolom seperti table di bawah ini :
Komponen DBGrid1.Columns[0] DBGrid1.Columns[1] DBGrid1.Columns[2] DBGrid1.Columns[3] DBGrid1.Columns[0], DBGrid1.Columns[1], DBGrid1.Columns[2], DBGrid1.Columns[3] Property FieldName Title.Caption FieldName Title.Caption FieldName Title.Caption FieldName Title.Caption Title.Alignment Title.Font.Style.fsBold Value KoleksiID ID JudulKoleksi Judul Koleksi TglHarusKembali Tgl Harus Kembali HargaSewa Harga Sewa taCenter True
30. Klik dua kali Pinjam pada Object TreeView untuk membuka field editor, lakukan drag dan drop field NamaKaryawan dan TotalSewa ke dalam GroupBox3. 31. Tambahkan DBNavigator1 dari tab Data Control ke dalam GroupBox3, atur property seperti table di bawah ini :
147
Komponen DBNavigator1
Tab Data Control
Parent GroupBox3
Property Align Datasource Flat VisibleButtons.nbInsert VisibleButtons.nbDelete VisibleButtons.nbEdit VisibleButtons.nbPost VisibleButtons.nbCancel VisibleButtons.nbRefresh
Value alBottom Datasource1 True False False False False False False
32. Tambahkan ToolBar2 dari tab Win32 ke dalam GroupBox4, atur property seperti table di bawah ini :
Komponen ToolBar2 Tab Win32 Parent GroupBox4 Property Align Value alBottom
33. Tambahkan Edit1 dari tab Standard ke dalam ToolBar2, atur property seperti table di bawah ini :
Komponen Edit1 Tab Standard Parent ToolBar2 Property Text Value
Komponen DBGrid2 Tab Data Control Parent GroupBox4 Property Align Datasource Options.dgRowSelect Options.dgAlwaysShowSelection Options.dgEditing Value alClient DataSource3 False False True
35. Klik dua kali DBGrid2 untuk membuka column editor, klik kanan pada column editor, kemudian pilih Add All Fields, atur susunan column seperti gambar di bawah ini :
Ubah property masing-masing kolom seperti table di bawah ini :

Komponen DBGrid2.Columns[0] DBGrid2.Columns[1] DBGrid2.Columns[2] Property Title.Caption Title.Caption Title.Caption Value ID Judul Koleksi Stock
148
Komponen DBGrid2.Columns[3] DBGrid2.Columns[4] DBGrid2.Columns[5] DBGrid2.Columns[0], DBGrid2.Columns[1], DBGrid2.Columns[2], DBGrid2.Columns[3], DBGrid2.Columns[4], DBGrid2.Columns[5]
Property Title.Caption Title.Caption Title.Caption Title.Alignment Title.Font.Style.fsBold
Value Pemeran Utama Kategori Jenis Koleksi taCenter True
36. Atur property untuk komponen Data Control seperti table di bawah ini :
Komponen DBEdit1, DBLookUpCombobox2, DBLookupCombobox3, DBLookupCombobox4, DBLookUpCombobox5, DBEdit4 Property Enabled Value False
37. Atur layout form FPinjam seperti gambar di bawah ini :
38. Tambahkan unit DateUtils pada blok Uses di unit UFPinjam, lihat gambar berikut :
149
39. Tambahkan variable PinjamID dengan type Integer pada blok Public di unit UFPinjam.
40. Buat procedure UpdateqStock dan procedure UpdateTotalSewa pada blok Private di unit UFPinjam, tekan Ctrl+Shift+C untuk membuat blok procedure (lihat gambar di atas), ketikkan perintah seperti table di bawah ini :
Komponen FPinjam Event UpdateqStock Code procedure TFPinjam.UpdateqStock; begin qStock.Close; qStock.Parameters[0].Value := '%' + Edit1.Text + qStock.Parameters[1].Value := '%' + Edit1.Text + qStock.Parameters[2].Value := '%' + Edit1.Text + qStock.Parameters[3].Value := '%' + Edit1.Text + qStock.Open; end; procedure TFPinjam.UpdateTotalSewa; var TempTotal: Real; PrevRecord: TBookmark; begin PrevRecord := DPinjam.GetBookmark; try DPinjam.DisableControls; DPinjam.First; TempTotal := 0; while not DPinjam.EOF do
'%'; '%'; '%'; '%';
UpdateTotalSewa
150
Komponen
Event
Code begin TempTotal := TempTotal + DPinjamHargaSewa.Value; DPinjam.Next; end; If not (Pinjam.State in dsEditModes) then Pinjam.Edit; PinjamTotalSewa.Value := TempTotal; finally DPinjam.EnableControls; if PrevRecord <> nil then begin DPinjam.GoToBookmark(PrevRecord); DPinjam.FreeBookmark(PrevRecord); end; end; end;
41. Pilih FPinjam pada Object TreeView, buat event onCreate, onShow dan onClose, ketikkan perintah seperti table di bawah ini :
Komponen FKoleksi
Event onCreate
onShow
onClose
Code procedure TFPinjam.FormCreate(Sender: TObject); begin PinjamID := 0; end; procedure TFPinjam.FormShow(Sender: TObject); begin Pinjam.Open; DPinjam.Open; qMember.Open; qKaryawan.Open; qKoleksi.Open; UpdateqStock; If PinjamID > 0 then Pinjam.Locate('PinjamID', PinjamID, []) else Pinjam.Insert; end; procedure TFPinjam.FormClose(Sender: TObject; var Action: TCloseAction); begin Pinjam.Close; DPinjam.Close; qMember.Close; qKaryawan.Close; qKoleksi.Close; qStock.Close; end;
Komponen Event Code
151
Komponen SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4
Event onClick
Code procedure TFPinjam.SpeedButton1Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : Pinjam.Post; 2 : Pinjam.Delete; 3:; 4 : Pinjam.Cancel; End; If (Sender as TSpeedButton).Tag in [2,4] then Close; end;
43. Pilih Pinjam pada Object TreeView, buat event BeforeDelete dan onNewRecord, ketikkan perintah seperti table di bawah ini :
Komponen Pinjam Event BeforeDelete Code procedure TFPinjam.PinjamBeforeDelete(DataSet: TDataSet); begin If MessageDlg('Hapus data?',mtConfirmation, [mbYes, mbNo], 0) = mrNo then Abort; end; procedure TFPinjam.PinjamNewRecord(DataSet: TDataSet); begin If DBEdit3.Enabled then ActiveControl := DBEdit3; PinjamTglPinjam.Value := Today; PinjamTotalSewa.Value := 0; PinjamKaryawanID.Value := FUtama.KaryawanID; end;
onNewRecord
44. Pilih DPinjam pada Object TreeView, buat event AfterDelete, AfterPost, BeforeDelete dan onNewRecord, ketikkan perintah seperti table di bawah ini :
Komponen DPinjam Event AfterDelete Code procedure TFPinjam.DPinjamAfterDelete(DataSet: TDataSet); begin UpdateTotalSewa; end; procedure TFPinjam.DPinjamAfterPost(DataSet: TDataSet); begin UpdateTotalSewa; end; procedure TFPinjam.DPinjamBeforeDelete(DataSet: TDataSet); begin If MessageDlg('Hapus data?',mtConfirmation, [mbYes, mbNo], 0) = mrNo then Abort else UpdateqStock; end; procedure TFPinjam.DPinjamNewRecord(DataSet: TDataSet); begin DPinjamPinjamID.Value := PinjamPinjamID.Value; end;
AfterPost
BeforeDelete
onNewRecord
152
Komponen DataSource1 Event onStateChange Code procedure TFPinjam.DataSource1StateChange(Sender: TObject); begin SpeedButton1.Enabled := (Pinjam.State in dsEditModes) and (FUtama.HakAkses in [1,2]); SpeedButton2.Enabled := (Pinjam.State in [dsBrowse]) and (FUtama.HakAkses in [1,2]); SpeedButton3.Enabled := (Pinjam.State in [dsBrowse]) and (FUtama.HakAkses in [1,2]); DBEdit3.Enabled := FUtama.HakAkses in [1,2]; DBLookUpCombobox1.Enabled := FUtama.HakAkses in [1,2]; DBGrid1.Enabled := FUtama.HakAkses in [1,2]; DBGrid2.Enabled := FUtama.HakAkses in [1,2]; Edit1.Enabled := FUtama.HakAkses in [1,2]; DBNavigator1.Enabled := FUtama.HakAkses in [2]; end;
46. Pilih DBGrid1 pada Object TreeView, buat event onDblClick, ketikkan perintah seperti table di bawah ini :
Komponen DBGrid1 Event onDblClick Code procedure TFPinjam.DBGrid1DblClick(Sender: TObject); begin DPinjam.Delete; end;
Komponen DBGrid2 Event onDblClick Code procedure TFPinjam.DBGrid2DblClick(Sender: TObject); begin If PinjamMemberID.Value = 0 then Begin MessageDlg('Silakan Pilih Member!', mtInformation, [mbOK], 0); Abort; End; If qStockStock.Value > 0 then Begin If Pinjam.State in dsEditModes then Pinjam.Post; DPinjam.Insert; DPinjamKoleksiID.Value := qStockKoleksiID.Value; DPinjamHargaSewa.Value := DPinjamHargaSewaKoleksi.Value; DPinjamTglHarusKembali.Value := PinjamTglPinjam.Value + DPinjamLamaSewaKoleksi.Value; DPinjamKembaliID.Value := 0; DPinjam.Post; UpdateqStock; End
153
Komponen
Event
Code Else MessageDlg('Stock koleksi kosong!', mtInformation, [mbOK], 0); end;
48. Pilih Edit1 pada Object TreeView, buat event onKeyPress, ketikkan perintah seperti table di bawah ini :
Komponen Edit1 Event onKeyPress Code procedure TFPinjam.Edit1KeyPress(Sender: TObject; var Key: Char); begin If Key = #13 then UpdateqStock; end;
49. Kembali ke form FUtama, klik View Forms, pilih FUtama, klik OK untuk melanjutkan. 50. Klik menu File Use Unit, pilih FPinjam, klik OK untuk melanjutkan. 51. Pilih Peminjaman1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Peminjaman1 Event onClick Code procedure TFUtama.Peminjaman1Click(Sender: TObject); begin FPinjam.ShowModal; end;
Komponen SpeedButton3 Event onClick Code procedure TFUtama.SpeedButton3Click(Sender: TObject); begin FPinjam.ShowModal; end;
154
Latihan 27 : Membuat QuickReport Nota Peminjaman
Nota Peminjaman adalah bukti transaksi peminjaman yang dilakukan oleh Member. Nota Peminjaman menggunakan kertas ukuran A5 dengan posisi Landscape. Langkah-langkah :
1. Pastikan project Rental.dpr telah dibuka. 2. Buat Report baru, klik menu File New Others, pada tab New pilih Reports, klik OK untuk melanjutkan. 3. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 4. Tambahkan ADOQuery1 dari tab ADO, ubah property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent QuickReport1 Property Connection Name SQL Value FUtama.ADOConnection1 qPinjam Select Pinjam.*, Member.Nama as NamaMember, Member.Alamat, Member.Kota, Member.Handphone, Karyawan.Nama as NamaKaryawan, DPinjam.*, Koleksi.Judul, Koleksi.JenisKoleksi From Pinjam, Member, Karyawan, DPinjam, Koleksi Where (Pinjam.MemberID = Member.MemberID) and (Pinjam.KaryawanID = Karyawan.KaryawanID) and (Pinjam.PinjamID = DPinjam.PinjamID) and (DPinjam.KoleksiID = Koleksi.KoleksiID) and (Pinjam.PinjamID = :PinjamID) Order by DPinjam.DPinjamID
5. Pilih qPinjam pada Object TreeView, klik tombol ellipsis pada property Parameters untuk membuka jendela Edit Parameters, ubah property seperty table di bawah ini :
6. Buat persistent field untuk qPinjam, klik dua kali qPinjam pada Object TreeView, klik kanan dan pilih Add All Fields. 7. Pilih QuickReport1 pada Object TreeView, ubah property seperti table di bawah ini :
155
Komponen QuickReport1
Property Dataset Name
Value qPinjam QRNotaPinjam
8. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UQRNotaPinjam.pas dalam folder Rental. 9. Klik dua kali QRNotaPinjam pada Object TreeView untuk membuka jendela Report Settings. Ubah Units dari Inch menjadi MM, klik Apply.
Settings Report Settings Section Other Property Units Value MM
10. Masih pada jendela Report Settings, ubah setting lainnya seperti gambar berikut, klik OK untuk melanjutkan.
Settings Report Settings Section Paper size Margin Property Paper size Orientation Top Bottom Left Right Font Size PageHeader ColumnHeader DetailBand Summary Print first page header Print last page footer Value A5 148 x 210 mm Landscape 5.00 5.00 5.00 5.00 Trebuchet MS 10 True True True True True True
Other Bands
156
11. Tambahkan 22 buah QRLabel dari tab QReports ke PageHeaderBand1, ubah property seperti table di bawah ini :
Komponen QRLabel1 QRLabel2 QRLabel3 QRLabel1, QRLabel2, QRLabel3 QRLabel4 Tab QReports QReports QReports Parent PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 Property Caption Caption Caption Font.Style.fsBold
dalam
Value NamaRental AlamatRental TelpRental True
QReports
PageHeaderBand1
QRLabel5 QRLabel6 QRLabel7 QRLabel8 QRLabel9 QRLabel10 QRLabel11 QRLabel12 QRLabel13 QRLabel14 s/d QRLabel22
QReports QReports QReports QReports QReports QReports QReports QReports QReports QReports
PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1
Caption Font.Style.fsUnderline Font.Style.fsBold Caption Caption Caption Caption Caption Caption Caption Caption Caption Caption
NOTA PEMINJAMAN True True PinjamID Tanggal KaryawanID Nama Karyawan MemberID Nama Alamat Kota Handphone :
12. Tambahkan 9 buah QDBText dari tab QReports ke PageHeaderBand1, ubah property seperti table di bawah ini :
dalam
157
Komponen QRDBText1 s/d QRDBText9 QRDBText1 QRDBText2 QRDBText3 QRDBText4 QRDBText5 QRDBText6 QRDBText7 QRDBText8 QRDBText9
Tab
Parent
Property Dataset
Value qPinjam
QReports QReports QReports QReports QReports QReports QReports QReports QReports
PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1
DataField DataField DataField DataField DataField DataField DataField DataField DataField
Pinjam.PinjamID TglPinjam KaryawanID NamaKaryawan MemberID NamaMember Alamat Kota Handphone
13. Pilih ColumnHeaderBand1 pada Object TreeView, ubah property seperti table di bawah ini :
Komponen ColumnHeaderBand1 Property Frame.DrawBottom Frame.DrawTop Height Value True True 32
14. Tambahkan 6 buah QRLabel dari tab QReports ke ColumnHeaderBand1, ubah property seperti table di bawah ini :
Komponen QRLabel23 QRLabel24 QRLabel25 QRLabel26 QRLabel27 QRLabel28 QRLabel23, QRLabel24, QRLabel28 Tab QReports QReports QReports QReports QReports QReports Parent ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 Property Caption Caption Caption Caption Caption Caption Alignment
dalam
Value No. KoleksiID Judul Koleksi Jenis Koleksi Tgl. Harus Kembali Harga Sewa taRightJustify
15. Pilih DetailBand1 pada Object TreeView, ubah property seperti table di bawah ini :
Komponen DetailBand1 Property Height Value 19
16. Tambahkan 1 buah QRSysData, 4 buah QRDBText dan 1 buah QRExpr dari tab QReports ke dalam DetailBand1, ubah property seperti table di bawah ini :
Komponen QRSysData1 QRDBText10, QRDBText11, QRDBText12, QRDBText13 Tab QReports QReports Parent DetailBand1 DetailBand1 Property Data Dataset Value qrsDetailNo qPinjam
158
Komponen QRDBText10 QRDBText11 QRDBText12 QRDBText13 QRExpr1 QRSysData1, QRDBText10, QRExpr1 QRSysData1, QRDBText10, QRDBText11, QRDBtext12, QRDBText13, QRExpr1
Tab
Parent
QReports
DetailBand1
Property DataField DataField DataField DataField Expression Alignment
Value KoleksiID Judul JenisKoleksi TglHarusKembali FORMATNUMERIC(',0', qPinjam.HargaSewa) taRightJustify
Autosize
False
17. Pilih SummaryBand1 pada Object TreeView, ubah property seperti table di bawah ini :
Komponen SummaryBand1 Property Frame.DrawTop Height Value True 40
18. Tambahkan 3 buah QRLabel, 1 buah QRSysData dan 1 buah QRExpr dari tab QReports ke dalam SummaryBand1, ubah property seperti table di bawah ini :
Komponen QRLabel29 QRLabel30 QRSysData2 QRLabel31 QRExpr2 Tab QReports QReports QReports QReports QReports Parent SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 Property Caption Caption Data Caption Expression Autosize Alignment Value Dicetak : qrsDateTime Total Sewa FORMATNUMERIC(',0', SUM(qPinjam.HargaSewa)) False taRightJustify
19. Atur layout QRNotaPinjam seperti gambar berikut ini :
159
20. Kembali ke form FPinjam, klik menu View Form, pilih FPinjam, klik OK untuk melanjutkan. 21. Klik menu File Use Unit, pilih UQRNotaPinjam, klik OK untuk melanjutkan. 22. Buat procedure CetakNotaPinjam pada blok Private, tekan Ctrl+Shift+C untuk membuat blok procedure, ketikkan perintah seperti table di bawah ini :
Komponen FPinjam Procedure CetakNotaP injam Code procedure TFPinjam.CetakNotaPinjam; begin With QRNotaPinjam do Begin qPinjam.Close; qPinjam.Parameters[0].Value := PinjamPinjamID.Value; qPinjam.Open; QRLabel1.Caption := FUtama.NamaRental; QRLabel2.Caption := FUtama.AlamatRental; QRLabel3.Caption := FUtama.TelpRental; Preview; End; end;
Komponen SpeedButton3 Event onClick Code procedure TFPinjam.SpeedButton1Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : Pinjam.Post; 2 : Pinjam.Delete; 3 : CetakNotaPinjam; 4 : Pinjam.Cancel; End; If (Sender as TSpeedButton).Tag in [2,4] then Close; end;
160
Latihan 28 : Membuat Form Pengembalian
Form Pengembalian digunakan untuk melakukan transaksi pengembalian. Seperti Form Peminjaman, form ini juga menggunakan konsep master detail gabungan dari table Kembali dan DPinjam. Pada form ini metode input transaksi dibuat semudah mungkin. Pada bagian kanan terdapat daftar koleksi yang belum dikembalikan oleh member bersangkutan. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position WindowState Value Pengembalian bsSingle FKembali poDesktopCenter wsMaximized
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFKembali.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Copy dan Paste ToolBar1 dari form FPinjam ke dalam FKembali. 7. Tambahkan 3 buah GroupBox1 dari tab Standard ke dalam FKembali, atur property seperti table di bawah ini :
Komponen GroupBox1 GroupBox2 GroupBox3 Tab Standard Standard Standard Parent FKembali FKembali FKembali Property Align Caption Align Caption Align Caption Value alTop alLeft Koleksi Yang Dikembalikan alBottom
8. Tambahkan 1 buah Splitter dari tab Additional ke dalam FKembali. 9. Tambahkan 1 buah GroupBox dari tab Standard ke dalam FKembali, atur property seperti table di bawah ini :
Komponen GroupBox4 Tab Standard Parent FPinjam Property Align Caption Value alClient Koleksi Belum Kembali
10. Tambahkan 3 buah ADOTable dan 4 buah ADOQuery atur property seperti table di bawah ini :
Komponen Tab Parent Property Value
161
Komponen ADOTable1, ADOTable2, ADOTable3, ADOQuery1, ADOQuery2, ADOQuery3, ADOQuery4 ADOTable1 ADOTable2 ADOTable3
Tab
Parent
Property Connection
Value FUtama.ADOConnection1
ADO ADO ADO
FKembali FKembali FKembali
ADOQuery1
ADO
FKembali
Name TableName Name TableName Name CursorLocation TableName Name SQL
ADOQuery2
ADO
FKembali
Name SQL
ADOQuery3
ADO
FKembali
Name SQL
ADOQuery4
ADO
FKembali
Name SQL
Kembali Kembali DKembali DPinjam DPinjam clUseServer DPinjam qMember Select Member.MemberID, Member.Nama, Member.Alamat, Member.Kota, Member.Handphone From Member Order by Member.Nama qKaryawan Select Karyawan.KaryawanID, Karyawan.Nama From Karyawan Order by Karyawan.Nama qKoleksi Select Koleksi.KoleksiID, Koleksi.Judul From Koleksi Order by Koleksi.Judul qBKembali Select Pinjam.PinjamID, Pinjam.TglPinjam, Pinjam.MemberID, DPinjam.DPinjamID, DPinjam.KoleksiID, Koleksi.Judul, Koleksi.HargaDenda, DPinjam.TglHarusKembali From Pinjam, DPinjam, Koleksi Where (Pinjam.PinjamID = DPinjam.PinjamID) and (DPinjam.KoleksiID = Koleksi.KoleksiID) and (DPinjam.KembaliID = 0) and (Pinjam.MemberID = :MemberID)
11. Pilih qBKembali pada Object TreeView, klik tombol ellipsis pada property Parameters untuk membuka jendela Edit Parameters, ubah property seperti table di bawah ini :
162
Komponen TParameters[0]
Property DataType
Value ftInteger
12. Buat persistent field table Kembali, klik dua kali Kembali pada Object TreeView untuk membuka field editor, klik kanan dan pilih Add All Fields. 13. Dengan cara yang sama dengan point 12, buat persistent field table DKembali, DPinjam, qMember, qKaryawan, qKoleksi dan qBKembali. 14. Klik dua kali Kembali pada Object TreeView untuk membuka field editor, pilih field TotalDenda, ubah property seperti table di bawah ini :
Komponen KembaliTotalDenda Property Currency Value True
15. Klik dua kali DKembali pada Object TreeView untuk membuka field editor, pilih field HargaDenda, ubah property seperti table di bawah ini :
Komponen DKembaliHargaDenda Property Currency Value True
16. Tambahkan 3 buah DataSource dari tab Data Acces, ubah property seperti table di bawah ini :
Komponen Datasource1 DataSource2 DataSource3 Tab Data Access Data Access Data Access Parent FKembali FKembali FKembali Property Dataset Dataset Dataset Value Kembali DKembali qBKembali
17. Buat hubungan master detail antara table Kembali dan DKembali, pilih table DKembali pada Object TreeView, ubah property seperti table di bawah ini :
Komponen DKembali Property MasterSource Value Datasource1
18. Pilih table DKembali pada Object TreeView, klik tombol elipsisi pada property MasterField untuk membuka Field Link Designer. Pilih KembaliID pada Detail Fields dan KembaliID pada Master Fields. Klik Add untuk menambahkan ke dalam Joined Fields. Klik OK untuk melanjutkan.
163
19. Tambahkan field baru NamaMember pada table Kembali, klik dua kali Kembali pada Object TreeView untuk membuka Field Editor, klik kanan dan pilih New Fields, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field NamaMember Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value NamaMember String 30 Lookup MemberID qMember MemberID Nama
20. Tambahkan field baru Alamat pada table Kembali, sama seperti point 19, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field Alamat Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value Alamat String 50 Lookup MemberID qMember MemberID Alamat
21. Tambahkan field baru Kota pada table Kembali, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field Kota Section Field Properties Property Name Type Size Value Kota String 30
164
Field type Key Fields Dataset Lookup Keys Result Field
Lookup MemberID qMember MemberID Kota
22. Tambahkan field baru Handphone pada table Kembali, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field Handphone Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value Handphone String 30 Lookup MemberID qMember MemberID Handphone
23. Tambahkan field baru NamaKaryawan pada table Kembali, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field NamaKaryawan Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value NamaKaryawan String 30 Lookup KaryawanID qKaryawan KaryawanID Nama
24. Klik dua kali DKembali pada Object TreeView untuk membuka Field Editor, tambahkan field baru JudulKoleksi pada table DKoleksi, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field JudulKoleksi Section Field Properties Property Name Type Size Field type Key Fields Dataset Lookup Keys Result Field Value JudulKoleksi String 100 Lookup KoleksiID qKoleksi KoleksiID Judul
25. Klik dua kali qBKembali pada Object TreeView untuk membuka field editor, tambahkan field baru Telat pada table qBKembali, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field Telat Section Field Properties Property Name Type Value Telat Integer
165
Field type
Field type
Calculated
26. Tambahkan field baru Denda pada table qBKembali, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field Denda Section Field Properties Field type Property Name Type Field type Value Denda Currency Calculated
27. Masih pada field editor table qBKembali, pilih field Denda, ubah property seperti table di bawah ini :
Komponen qBKembaliDenda Property Currency Value True
28. Klik dua kali Kembali pada Object TreeView untuk membuka field editor. Pilih field KembaliID, TglKembali, MemberID, NamaMember, Alamat, Kota dan Handphone, lakukan drag and drop ke dalam GroupBox1. 29. Tambahkan DBGrid1 dari tab Data Control ke dalam GroupBox2, atur property seperti table di bawah ini :
Komponen DBGrid1 Tab Data Control Parent GroupBox2 Property Align Datasource Options.dgRowSelect Options.dgAlwaysShowSelection Options.dgEditing Value alClient DataSource2 False False True
30. Klik dua kali DBGrid1 pada Object TreeView untuk membuka Column Editor, tambahkan 4 buah dengan mengklik kanan pada Column Editor, pilih Add. Ubah property masing-masing kolom seperti table di bawah ini :
Komponen DBGrid1.Columns[0] DBGrid1.Columns[1] DBGrid1.Columns[2] DBGrid1.Columns[3] DBGrid1.Columns[0], DBGrid1.Columns[1], DBGrid1.Columns[2], DBGrid1.Columns[3] Property FieldName Title.Caption FieldName Title.Caption FieldName Title.Caption FieldName Title.Caption Title.Alignment Title.Font.Style.fsBold Value KoleksiID ID JudulKoleksi Judul Koleksi TglHarusKembali Tgl Harus Kembali Denda Denda taCenter True
166
31. Klik dua kali table Kembali pada Object TreeView untuk membuka field editor, pilih field Nama Karyawan dan TotalDenda, lakukan drag and drop ke dalam GroupBox3. 32. Tambahkan DBNavigator1 dari tab Data Control ke dalam GroupBox3, atur property seperti table di bawah ini :
34. Klik dua kali DBGrid2 pada Object TreeView untuk membuka Column Editor, tambahkan 6 buah kolom, ubah property masing-masing kolom seperti table di bawah ini :
Komponen DBGrid2.Columns[0] DBGrid2.Columns[1] DBGrid2.Columns[2] DBGrid2.Columns[3] DBGrid2.Columns[4] DBGrid2.Columns[5] DBGrid2.Columns[0], DBGrid2.Columns[1], DBGrid2.Columns[2], DBGrid2.Columns[3], DBGrid2.Columns[4], DBGrid2.Columns[5] Property FieldName Title.Caption FieldName Title.Caption FieldName Title.Caption FieldName Title.Caption FieldName Title.Caption FieldName Title.Caption Title.Alignment Title.Font.Style.fsBold Value TglPinjam Tgl Pinjam KoleksiID ID Judul Judul Koleksi TglHarusKembali Tgl Harus Kembali Telat Telat Denda Denda taCenter True
35. Atur property untuk komponen Data Control seperti table di bawah ini :
Komponen Property Value
167
DBEdit1, DBLookUpCombobox2, DBLookupCombobox3, DBLookupCombobox4, DBLookUpCombobox5, DBEdit4
Enabled
False
36. Atur layout form FKembali seperti gambar di bawah ini :
37. Tambahkan unit DateUtils pada blok Uses di unit UFKembali, lihat Latihan 27 point 38. 38. Tambahkan variable KembaliID dengan type Integer pada blok Public di unit UFKembali, lihat Latihan 27 point 39. 39. Buat procedure UpdateqBKembali dan Procedure UpdateTotalDenda pada blok Private di unit UFKembali, tekan Ctrl+Shift+C untuk membuat blok procedure tersebut (lihat Latihan 27 point 40), ketikkan perintah seperti table di bawah ini :
Komponen FKembali Event UpdateqBKembali Code procedure TFKembali.UpdateqBKembali; begin qBKembali.Close; If DBEdit3.Text = '' then qBKembali.Parameters[0].Value := 0 else qBKembali.Parameters[0].Value := strtoint(DBEdit3.Text); qBKembali.Open; end; procedure TFKembali.UpdateTotalDenda; var TempTotal: Real; PrevRecord: TBookmark; begin
UpdateTotalDenda
168
Komponen
Event
Code PrevRecord := DKembali.GetBookmark; try DKembali.DisableControls; DKembali.First; TempTotal := 0; while not DKembali.EOF do begin TempTotal := TempTotal + DKembaliHargaDenda.Value; DKembali.Next; end; If not (Kembali.State in dsEditModes) then Kembali.Edit; KembaliTotalDenda.Value := TempTotal; finally DKembali.EnableControls; if PrevRecord <> nil then begin DKembali.GoToBookmark(PrevRecord); DKembali.FreeBookmark(PrevRecord); end; end; end;
40. Pilih FKembali pada Object TreeView, buat event onCreate, onShow dan onClose, ketikkan perintah seperti table di bawah ini :
Komponen FKembali Event onCreate Code procedure TFKembali.FormCreate(Sender: TObject); begin KembaliID := 0; end; procedure TFKembali.FormShow(Sender: TObject); begin Kembali.Open; DKembali.Open; DPinjam.Open; qMember.Open; qKaryawan.Open; qKoleksi.Open; UpdateqBKembali; If KembaliID > 0 then Kembali.Locate('KembaliID', KembaliID, []) else Kembali.Insert; end; procedure TFKembali.FormClose(Sender: TObject; var Action: TCloseAction); begin Kembali.Close; DPinjam.Close; DKembali.Close; qMember.Close; qKaryawan.Close; qKoleksi.Close; qBKembali.Close; end;
onShow
onClose
169
Komponen SpeedButton1, SpeedButton2, SpeedButton3, SpeedButton4 Event onClick Code procedure TFKembali.SpeedButton1Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : Kembali.Post; 2 : Kembali.Delete; 3:; 4 : Kembali.Cancel; End; If (Sender as TSpeedButton).Tag in [2,4] then Close; end;
42. Pilih DBEdit3 pada Object TreeView, buat event onChange, ketikkan perintah seperti table di bawah ini :
Komponen DBEdit3 Event onChange Code procedure TFkembali.DBEdit3Change(Sender: TObject); begin UpdateqBKembali; end;
43. Pilih table Kembali pada Object TreeView, buat event AfterScroll, BeforeDelete dan onNewRecord, ketikkan perintah seperti table di bawah ini :
Komponen Kembali Event AfterScroll Code procedure TFKembali.KembaliAfterScroll(DataSet: TDataSet); begin UpdateqBKembali; end; procedure TFKembali.KembaliBeforeDelete(DataSet: TDataSet); begin If MessageDlg('Hapus data?',mtConfirmation, [mbYes, mbNo], 0) = mrNo then Abort; end; procedure TFKembali.KembaliNewRecord(DataSet: TDataSet); begin If DBEdit3.Enabled then ActiveControl := DBEdit3; KembaliTglKembali.Value := Today; KembaliTotalDenda.Value := 0; KembaliKaryawanID.Value := FUtama.KaryawanID; end;
BeforeDelete
onNewRecord
44. Pilih qBKembali pada Object TreeView, buat event onCalcFields, ketikkan perintah seperti table di bawah ini :
Komponen qBKembali Event onCalcFields Code procedure TFKembali.qBKembaliCalcFields(DataSet: TDataSet); var
170
Komponen
Event
Code Telat : Integer; begin Telat := Trunc(Today - qBKembaliTglHarusKembali.Value); If Telat <= 0 then qBKembaliTelat.Value := 0 else qBKembaliTelat.Value := Telat; qBKembaliDenda.Value := qBKembaliTelat.Value * qBKembaliHargaDenda.Value; end;
45. Pilih DataSource1 pada Object TreeView, buat event onStateChange, ketikkan perintah seperti table di bawah ini :
Komponen DataSource1 Event onStateChange Code procedure TFKembali.DataSource1StateChange(Sender: TObject); begin SpeedButton1.Enabled := (Kembali.State in dsEditModes) and (FUtama.HakAkses in [1,2]); SpeedButton2.Enabled := (Kembali.State in [dsBrowse]) and (FUtama.HakAkses in [1,2]); SpeedButton3.Enabled := (Kembali.State in [dsBrowse]) and (FUtama.HakAkses in [1,2]); DBEdit3.Enabled := FUtama.HakAkses in [1,2]; DBLookUpCombobox1.Enabled := FUtama.HakAkses in [1,2]; DBGrid1.Enabled := FUtama.HakAkses in [1,2]; DBGrid2.Enabled := FUtama.HakAkses in [1,2]; DBNavigator1.Enabled := FUtama.HakAkses in [2]; end;
Komponen DBGrid1 Event onDblClick Code procedure TFKembali.DBGrid1DblClick(Sender: TObject); begin If MessageDlg('Batalkan pengembalian?', mtConfirmation, [mbYes, mbNo], 0) = mrYes then Begin DKembali.Edit; DKembaliKembaliID.Value := 0; DKembaliDenda.Value := 0; DKembali.Post; UpdateqBKembali; UpdateTotalDenda; End; end;
Komponen DBGrid2 Event onDblClick Code procedure TFKembali.DBGrid2DblClick(Sender: TObject); begin If MessageDlg('Kembalikan?', mtConfirmation,
171
Komponen
Event
Code [mbYes, mbNo], 0) = mrYes then Begin If qBKembaliMemberID.Value = strtoint(DBEdit3.Text) then Begin If Kembali.State in dsEditModes then Kembali.Post; If DPinjam.Locate('DPinjamID', qBKembaliDPinjamID.Value, []) then Begin DPinjam.Edit; DPinjamKembaliID.Value := KembaliKembaliID.Value; DPinjamDenda.Value := qBKembaliDenda.Value; DPinjam.Post; DKembali.Close; DKembali.Open; UpdateqBKembali; UpdateTotalDenda; End; End Else MessageDlg('Member tidak cocok!', mtInformation, [mbOK], 0); End; end;
48. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 49. Klik menu File Use Unit, pilih FKembali, klik OK untuk melanjutkan. 50. Pilih Pengembalian1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Pengembalian1 Event onClick Code procedure TFUtama.Pengembalian1Click(Sender: TObject); begin FKembali.ShowModal; end;
Komponen SpeedButton4 Event onClick Code procedure TFUtama.SpeedButton4Click(Sender: TObject); begin FKembali.ShowModal; end;
172
Latihan 29 : Membuat QuickReport Nota Pengembalian
Nota Pengembalian adalah bukti transaksi pengembalian koleksi yang dilakukan oleh Member. Nota Peminjaman berisi informasi jumlah denda yang harus dibayar member apabila terjadi keterlambatan pengembalian koleksi. Nota Peminjaman menggunakan kertas ukuran A5 dengan posisi Landscape. Langkah-langkah :
1. Pastikan project Rental.dpr telah dibuka. 2. Buat Report baru, klik menu File New Others, pada tab New pilih Reports, klik OK untuk melanjutkan. 3. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 4. Tambahkan ADOQuery1 dari tab ADO, ubah property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent QuickReport1 Property Connection Name SQL Value FUtama.ADOConnection1 qKembali Select Kembali.*, Member.Nama as NamaMember, Member.Alamat, Member.Kota, Member.Handphone, Karyawan.Nama as NamaKaryawan, DPinjam.*, Koleksi.Judul, Koleksi.JenisKoleksi From Kembali, Member, Karyawan, DPinjam, Koleksi Where (Kembali.MemberID = Member.MemberID) and (Kembali.KaryawanID = Karyawan.KaryawanID) and (Kembali.KembaliID = DPinjam.KembaliID) and (DPinjam.KoleksiID = Koleksi.KoleksiID) and (Kembali.KembaliID = :KembaliID) Order by DPinjam.DPinjamID
5. Pilih qKembali pada Object TreeView, klik tombol ellipsis pada property Parameters untuk membuka jendela Edit Parameters, ubah property seperty table di bawah ini :
173
6. Buat persistent field untuk qKembali, klik dua kali qKembali pada Object TreeView, klik kanan dan pilih Add All Fields. 7. Pilih QuickReport1 pada Object TreeView, ubah property seperti table di bawah ini :
Komponen QuickReport1 Property Dataset Name Value qKembali QRNotaKembali
8. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UQRNotaKembali.pas dalam folder Rental. 9. Klik dua kali QRNotaKembali pada Object TreeView untuk membuka jendela Report Settings. Ubah Units dari Inch menjadi MM, klik Apply.
Settings Report Settings Section Paper size Margin Property Paper size Orientation Top Bottom Left Right Font Size PageHeader ColumnHeader DetailBand Summary Print first page header Print last page footer Value A5 148 x 210 mm Landscape 5.00 5.00 5.00 5.00 Trebuchet MS 10 True True True True True True
Other Bands
174
11. Tambahkan 22 buah QRLabel dari tab QReports ke PageHeaderBand1, ubah property seperti table di bawah ini :
Komponen QRLabel1 QRLabel2 QRLabel3 QRLabel1, QRLabel2, QRLabel3 QRLabel4 Tab QReports QReports QReports Parent PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 Property Caption Caption Caption Font.Style.fsBold
dalam
Value NamaRental AlamatRental TelpRental True
QReports
PageHeaderBand1
QRLabel5 QRLabel6 QRLabel7 QRLabel8 QRLabel9 QRLabel10 QRLabel11 QRLabel12 QRLabel13 QRLabel14 s/d QRLabel22
QReports QReports QReports QReports QReports QReports QReports QReports QReports QReports
PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1
Caption Font.Style.fsUnderline Font.Style.fsBold Caption Caption Caption Caption Caption Caption Caption Caption Caption Caption
NOTA PENGEMBALIAN True True KembaliID Tanggal KaryawanID Nama Karyawan MemberID Nama Alamat Kota Handphone :
12. Tambahkan 9 buah QDBText dari tab QReports ke PageHeaderBand1, ubah property seperti table di bawah ini :
dalam
175
Komponen QRDBText1 s/d QRDBText9 QRDBText1 QRDBText2 QRDBText3 QRDBText4 QRDBText5 QRDBText6 QRDBText7 QRDBText8 QRDBText9
Tab
Parent
Property Dataset
Value qKembali
QReports QReports QReports QReports QReports QReports QReports QReports QReports
PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1 PageHeaderBand1
DataField DataField DataField DataField DataField DataField DataField DataField DataField
Kembali.KembaliID TglKembali KaryawanID NamaKaryawan MemberID NamaMember Alamat Kota Handphone
14. Tambahkan 6 buah QRLabel dari tab QReports ke ColumnHeaderBand1, ubah property seperti table di bawah ini :
Komponen QRLabel23 QRLabel24 QRLabel25 QRLabel26 QRLabel27 QRLabel28 QRLabel23, QRLabel24, QRLabel28 Tab QReports QReports QReports QReports QReports QReports Parent ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 Property Caption Caption Caption Caption Caption Caption Alignment
dalam
Value No. KoleksiID Judul Koleksi Jenis Koleksi Tgl. Harus Kembali Denda taRightJustify
Komponen QRSysData1 QRDBText10, QRDBText11, QRDBText12, QRDBText13 Tab QReports QReports Parent DetailBand1 DetailBand1 Property Data Dataset Value qrsDetailNo qKembali
176
Komponen QRDBText10 QRDBText11 QRDBText12 QRDBText13 QRExpr1 QRSysData1, QRDBText10, QRExpr1 QRSysData1, QRDBText10, QRDBText11, QRDBtext12, QRDBText13, QRExpr1
Tab
Parent
QReports
DetailBand1
Property DataField DataField DataField DataField Expression Alignment
Value KoleksiID Judul JenisKoleksi TglHarusKembali FORMATNUMERIC(',0', qKembali.Denda) taRightJustify
Autosize
False
Komponen QRLabel29 QRLabel30 QRSysData2 QRLabel31 QRExpr2 Tab QReports QReports QReports QReports QReports Parent SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 Property Caption Caption Data Caption Expression Autosize Alignment Value Dicetak : qrsDateTime Total Sewa FORMATNUMERIC(',0', SUM(qKembali.Denda)) False taRightJustify
19. Atur layout QRNotaPinjam seperti gambar berikut ini :
177
20. Kembali ke form FKembali, klik menu View Form, pilih FKembali, klik OK untuk melanjutkan. 21. Klik menu File Use Unit, pilih UQRNotaKembali, klik OK untuk melanjutkan. 22. Buat procedure CetakNotaKembali pada blok Private, tekan Ctrl+Shift+C untuk membuat blok procedure, ketikkan perintah seperti table di bawah ini :
Komponen FKembali Procedure CetakNota Kembali Code procedure TFKembali.CetakNotaKembali; begin With QRNotaKembali do Begin qKembali.Close; qKembali.Parameters[0].Value := KembaliKembaliID.Value; qKembali.Open; QRLabel1.Caption := FUtama.NamaRental; QRLabel2.Caption := FUtama.AlamatRental; QRLabel3.Caption := FUtama.TelpRental; Preview; End; end;
Komponen SpeedButton3 Event onClick Code procedure TFKembali.SpeedButton1Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : Kembali.Post; 2 : Kembali.Delete; 3 : CetakNotaKembali; 4 : Kembali.Cancel; End; If (Sender as TSpeedButton).Tag in [2,4] then Close; end;
NEW
Perbaikan :
1. 2. 3. 4. Lakukan perbaikan pada Latihan 24 point Lakukan perbaikan pada Latihan 25 point Lakukan perbaikan pada Latihan 26 point Lakukan perbaikan pada Latihan 28 point 14 dan 19. 15 dan 20. 34. 29.
Tugas Di Rumah :
1. Sempurnakan Latihan 17 s/d Latihan 25
178
2. Selesaikan Latihan 26 s/d Latihan 29. 3. Masukkan 20 transaksi peminjaman dengan minimal pinjam 2 koleksi per transaksi. 4. Masukkan 20 transaksi kembali dengan minimal pengembalian 1 koleksi per transaksi.
179
Latihan 30 : Membuat Form Daftar Member
Form Daftar Member menampilkan seluruh member yang terdaftar dalam database Rental. Form ini bisa digunakan untuk pencarian member berdasarkan criteria tertentu. Data hasil pencarian dapat diurutkan berdasarkan kolom tertentu dengan orientasi ascending maupun descending. Form ini berhubungan dengan form FMember untuk menampilkan data lengkap member beserta histori transaksinya. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position WindowState Value Daftar Member bsSizeable FDMember poDesktopCenter wsMaximized
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFDMember.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan 2 buah ADOQuery dari tab ADO, atur property seperti table di bawah ini :
Komponen ADOQuery1
Tab ADO
Parent FDMember
Property Connection Name SQL
Value FUtama.ADOConnection1 qAwal SELECT MEMBER.MEMBERID, MEMBER.NAMA, MEMBER.ALAMAT, MEMBER.KOTA, MEMBER.HANDPHONE, (SELECT COUNT(DPINJAM.DPINJAMID) FROM PINJAM, DPINJAM WHERE (PINJAM.PINJAMID = DPINJAM.PINJAMID) AND (PINJAM.MEMBERID = MEMBER.MEMBERID)) AS MEMINJAM, (SELECT COUNT(DPINJAM.DPINJAMID) FROM PINJAM, DPINJAM WHERE (PINJAM.PINJAMID = DPINJAM.PINJAMID) AND (PINJAM.MEMBERID = MEMBER.MEMBERID) AND (DPINJAM.KEMBALIID <> 0)) AS MENGEMBALIKAN FROM MEMBER
180
ADOQuery2
ADO
FDMember
Connection Name SQL
WHERE (MEMBER.NAMA LIKE :NAMA) AND (MEMBER.ALAMAT LIKE :ALAMAT) AND (MEMBER.KOTA LIKE :KOTA) AND (MEMBER.HANDPHONE LIKE :HANDPHONE) FUtama.ADOConnection1 qSearch sama dengan qAwal, cukup copy paste dari qAwal.
7. Tambahkan 1 buah DataSource dari tab Data Access, ubah property seperti table di bawah ini :
Komponen Datasource1 Tab Data Access Parent FDMember Property Dataset Value qSearch
8. Pilih qSearch pada Object TreeView, atur property Parameters seperti pada table di bawah ini :
9. Buat persistent field query qSearch, klik dua kali qSearch untuk membuka field editor, klik kanan dan pilih Add All Fields. 10. Tambahkan 1 buah Panel dari tab Standard ke dalam FDMember, ubah property seperti table di bawah ini :
Komponen Panel1 Tab Standard Parent FDMember Property Align Value alTop
11. Tambahkan 1 buah GroupBox dan 2 buah RadioGroup dari tab Standard ke dalam Panel1, ubah property seperti table di bawah ini :
Komponen GroupBox1 RadioGroup1 Tab Standard Standard Parent Panel1 Panel1 Property Align Caption Align Caption Items Value alLeft Kriteria Pencarian : alLeft Urut Berdasarkan : MemberID Nama Member Alamat Kota Handphone Pinjam Kembali alClient Orientasi : Ascending Descending
RadioGroup2
Standard
Panel1
Align Caption Items
181
12. Tambahkan 4 buah Label dan 4 buah Edit dari tab Standard ke dalam GroupBox1, ubah property seperti table di bawah ini :
Komponen Label1 Label2 Label3 Label4 Edit1, Edit2, Edit3, Edit4 Tab Standard Standard Standard Standard Parent GroupBox1 GroupBox1 GroupBox1 GroupBox1 Property Caption Caption Caption Caption Charcase Text Value Nama Member Alamat Kota Handphone ecUpperCase
Komponen BitBtn1 BitBtn2 Tab Additional Additional Parent GroupBox1 GroupBox1 Property Caption Glyph Caption Glyph Value Search Cari.bmp Reset Reset.bmp
14. Tambahkan 1 buah GroupBox dari tab Standard ke dalam FDMember, atur property seperti table di bawah ini :
Komponen GroupBox2 Tab Standard Parent FDMember Property Align Caption Value alClient Hasil Pencarian :
15. Tambahkan 1 buah DBGrid dari tab Data Control ke dalam GroupBox2, atur property seperti table di bawah ini :
16. Klik dua kali DBGrid2 pada Object TreeView untuk membuka Column Editor, klik kanan dan pilih Add All Fields, ubah property masing-masing kolom seperti table di bawah ini :
Komponen DBGrid1.Columns[0] DBGrid1.Columns[1] DBGrid1.Columns[2] DBGrid1.Columns[3] DBGrid1.Columns[4] DBGrid1.Columns[5] DBGrid1.Columns[6] DBGrid1.Columns[0], DBGrid1.Columns[1], DBGrid1.Columns[2], Property Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Alignment Title.Font.Style.fsBold Value ID Nama Member Alamat Kota Handphone Pinjam Kembali taCenter True
182
Komponen DBGrid1.Columns[3], DBGrid1.Columns[4], DBGrid1.Columns[5], DBGrid1.Columns[6]
Property
Value
17. Atur layout form FDMember seperti gambar di bawah ini :
18. Buat procedure Search dan procedure Reset pada blok Private, ketikkan perintah seperti table di bawah ini :
Komponen FDMember Event Search Code procedure TFDMember.Search; var I : Integer; begin qSearch.Close; qSearch.SQL := qAwal.SQL; Case RadioGroup1.ItemIndex of 0 : qSearch.SQL.Add('ORDER BY 1'); 1 : qSearch.SQL.Add('ORDER BY 2'); 2 : qSearch.SQL.Add('ORDER BY 3'); 3 : qSearch.SQL.Add('ORDER BY 4'); 4 : qSearch.SQL.Add('ORDER BY 5'); 5 : qSearch.SQL.Add('ORDER BY 6'); 6 : qSearch.SQL.Add('ORDER BY 7'); End; Case RadioGroup2.ItemIndex of 0 : qSearch.SQL.Add('ASC'); 1 : qSearch.SQL.Add('DESC'); End; qSearch.Parameters[0].Value qSearch.Parameters[1].Value qSearch.Parameters[2].Value qSearch.Parameters[3].Value qSearch.Open; := '%' := '%' := '%' := '%' + Edit1.Text + Edit2.Text + Edit3.Text + Edit4.Text + + + + '%'; '%'; '%'; '%';
183
Komponen
Event
Code For I := 0 to DBGrid1.Columns.Count - 1 do DBGrid1.Columns[I].Color := clWindow; If RadioGroup2.ItemIndex = 0 then DBGrid1.Columns[RadioGroup1.ItemIndex].Color := clMoneyGreen Else DBGrid1.Columns[RadioGroup1.ItemIndex].Color := clSkyBlue; ActiveControl := DBGrid1; end; procedure TFDMember.Reset; begin Edit1.Text := ''; Edit2.Text := ''; Edit3.Text := ''; Edit4.Text := ''; RadioGroup1.ItemIndex := 0; RadioGroup2.ItemIndex := 0; Search; end;
Reset
19. Pilih FDMember pada Object TreeView, buat event onShow dan onClose, ketikkan perintah seperti table di bawah ini :
Komponen FDMember Event onShow Code procedure TFDMember.FormShow(Sender: TObject); begin Reset; end; procedure TFDMember.FormClose(Sender: TObject; var Action: TCloseAction); begin qSearch.Close; end;
onClose
20. Pilih Edit1, Edit2, Edit3 dan Edit4 pada Object TreeView, buat event onKeyPress, ketikkan perintah seperti table di bawah ini :
Komponen Edit1, Edit2, Edit3, Edit4 Event onKeyPress Code procedure TFDMember.Edit1KeyPress(Sender: TObject; var Key: Char); begin If Key = #13 then Search; end;
Komponen BitBtn1 Event onClick Code procedure TFDMember.BitBtn1Click(Sender: TObject); begin Search; end;
184
Komponen BitBtn2 Event onClick Code procedure TFDMember.BitBtn2Click(Sender: TObject); begin Reset; end;
23. Pilih RadioGroup1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen RadioGroup1 Event onClick Code procedure TFDMember.RadioGroup1Click(Sender: TObject); begin If RadioGroup1.ItemIndex in [5,6] then Begin RadioGroup2.ItemIndex := 0; RadioGroup2.Enabled := False; End Else RadioGroup2.Enabled := True; Search; end;
Komponen RadioGroup2 Event onClick Code procedure TFDMember.RadioGroup2Click(Sender: TObject); begin Search; end;
25. Klik menu File Use Unit, pilih FMember, klik OK untuk melanjutkan. 26. Pilih DBGrid1 pada Object TreeView, buat event onDblClick, ketikkan perintah seperti table di bawah ini :
Komponen DBGrid1 Event onDblClick Code procedure TFDMember.DBGrid1DblClick(Sender: TObject); begin With FMember do Begin MemberID := qSearchMemberID.Value; ShowModal; End; end;
27. Kembali ke form FUtama, klik menu View Form, pilih FUtama, klik OK untuk melanjutkan. 28. Klik menu File Use Unit, pilih FDMember, klik OK untuk melanjutkan. 29. Pilih DaftarMember1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
185
Komponen DaftarMember1
Event onClick
Code procedure TFUtama.DaftarMember1Click(Sender: TObject); begin FDMember.ShowModal; end;
Komponen SpeedButton5 Event onClick Code procedure TFUtama.SpeedButton5Click(Sender: TObject); begin FDMember.ShowModal; end;
186
Latihan 31 : Membuat Form Daftar Koleksi
Form Daftar Koleksi menampilkan seluruh koleksi yang ada dalam database Rental. Form ini bisa digunakan untuk pencarian koleksi berdasarkan criteria tertentu. Data hasil pencarian dapat diurutkan berdasarkan kolom tertentu dengan orientasi ascending maupun descending. Form ini juga menampilkan kondisi stock masing-masing koleksi. Form Daftar Koleksi berhubungan dengan form FKoleksi untuk menampilkan data lengkap koleksi, preview koleksi serta histori transaksi tiap koleksi. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position WindowState Value Daftar Koleksi bsSizeable FDMember poDesktopCenter wsMaximized
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFDKoleksi.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan 2 buah ADOQuery dari tab ADO, atur property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent FDKoleksi Property Connection Name SQL Value FUtama.ADOConnection1 qAwal SELECT KOLEKSI.KOLEKSIID, KOLEKSI.JUDUL, KOLEKSI.PEMERANUTAMA, KOLEKSI.KATEGORI, KOLEKSI.JENISKOLEKSI, KOLEKSI.TGLBELI, KOLEKSI.JUMLAH, (KOLEKSI.JUMLAH - (SELECT COUNT(DPINJAM.DPINJAMID) FROM DPINJAM, PINJAM WHERE (PINJAM.PINJAMID = DPINJAM.PINJAMID) AND (DPINJAM.KOLEKSIID = KOLEKSI.KOLEKSIID) AND (DPINJAM.KEMBALIID = 0))) AS STOCK, (SELECT COUNT(DPINJAM.DPINJAMID) FROM DPINJAM, PINJAM WHERE (PINJAM.PINJAMID = DPINJAM.PINJAMID) AND (DPINJAM.KOLEKSIID =
187
ADOQuery2
ADO
FDKoleksi
Connection Name SQL
KOLEKSI.KOLEKSIID)) AS TOTALDIPINJAM FROM KOLEKSI WHERE (KOLEKSI.JUDUL LIKE :JUDUL) AND (KOLEKSI.PEMERANUTAMA LIKE :PEMERANUTAMA) AND (KOLEKSI.KATEGORI LIKE :KATEGORI) AND (KOLEKSI.JENISKOLEKSI LIKE :JENISKOLEKSI) FUtama.ADOConnection1 qSearch sama dengan qAwal, cukup copy paste dari qAwal.
7. Tambahkan 1 buah DataSource dari tab Data Access, ubah property seperti table di bawah ini :
Komponen Datasource1 Tab Data Access Parent FDKoleksi Property Dataset Value qSearch
8. Pilih qSearch pada Object TreeView, atur property Parameters seperti pada table di bawah ini :
9. Buat persistent field query qSearch, klik dua kali qSearch untuk membuka field editor, klik kanan dan pilih Add All Fields. 10. Tambahkan 1 buah Panel dari tab Standard ke dalam FDKoleksi, ubah property seperti table di bawah ini :
Komponen Panel1 Tab Standard Parent FDKoleksi Property Align Value alTop
11. Tambahkan 1 buah GroupBox dan 2 buah RadioGroup dari tab Standard ke dalam Panel1, ubah property seperti table di bawah ini :
Komponen GroupBox1 RadioGroup1 Tab Standard Standard Parent Panel1 Panel1 Property Align Caption Align Caption Items Value alLeft Kriteria Pencarian : alLeft Urut Berdasarkan : KoleksiID Judul Pemeran Utama Kategori Jenis Koleksi Tanggal Beli
188
RadioGroup2
Standard
Panel1
Align Caption Items
Jumlah Koleksi Stock Total Dipinjam alClient Orientasi : Ascending Descending
12. Tambahkan 4 buah Label, 2 buah Edit dan 2 buah Combobox dari tab Standard ke dalam GroupBox1, ubah property seperti table di bawah ini :
Komponen Label1 Label2 Label3 Label4 Combobox1 Tab Standard Standard Standard Standard Standard Parent GroupBox1 GroupBox1 GroupBox1 GroupBox1 GroupBox1 Property Caption Caption Caption Caption Items Value Judul Pemeran Utama Kategori Jenis Koleksi ACTION DRAMA DRAMA MUSICAL HOROR HOROR KOMEDI KARTUN KOMEDI KOMEDI ROMANTIS LAIN-LAIN CD CD AUDIO CD MP3 DVD ecUpperCase
Combobox2
Standard
GroupBox1
Items
Edit1, Edit2, Combobox1, Combobox2
Standard
GroupBox1
Charcase Text
Komponen BitBtn1 BitBtn2 Tab Additional Additional Parent GroupBox1 GroupBox1 Property Caption Glyph Caption Glyph Value Search Cari.bmp Reset Reset.bmp
14. Tambahkan 1 buah GroupBox dari tab Standard ke dalam FDKoleksi, atur property seperti table di bawah ini :
Komponen GroupBox2 Tab Standard Parent FDKoleksi Property Align Caption Value alClient Hasil Pencarian :
189
Komponen DBGrid1
Tab Data Control
Parent GroupBox2
Property Align Datasource Options.dgRowSelect Options.dgAlwaysShowSelection
Value alClient DataSource1 True True
16. Klik dua kali DBGrid2 pada Object TreeView untuk membuka Column Editor, klik kanan dan pilih Add All Fields, ubah property masing-masing kolom seperti table di bawah ini :
Komponen DBGrid1.Columns[0] DBGrid1.Columns[1] DBGrid1.Columns[2] DBGrid1.Columns[3] DBGrid1.Columns[4] DBGrid1.Columns[5] DBGrid1.Columns[6] DBGrid1.Columns[7] DBGrid1.Columns[8] DBGrid1.Columns[0], DBGrid1.Columns[1], DBGrid1.Columns[2], DBGrid1.Columns[3], DBGrid1.Columns[4], DBGrid1.Columns[5], DBGrid1.Columns[6], DBGrid1.Columns[7], DBGrid1.Columns[8] Property Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Alignment Title.Font.Style.fsBold Value ID Judul Koleksi Pemeran Utama Kategori Jenis Koleksi Tanggal Beli Jumlah Stock Total Dipinjam taCenter True
17. Atur layout form FDKoleksi seperti gambar di bawah ini :
18. Buat procedure Search dan procedure Reset pada blok Private, ketikkan perintah seperti table di bawah ini :
Komponen Event Code
190
Komponen FDKoleksi
Event Search
Code procedure TFDKoleksi.Search; var I : Integer; begin qSearch.Close; qSearch.SQL := qAwal.SQL; Case RadioGroup1.ItemIndex of 0 : qSearch.SQL.Add('ORDER BY 1'); 1 : qSearch.SQL.Add('ORDER BY 2'); 2 : qSearch.SQL.Add('ORDER BY 3'); 3 : qSearch.SQL.Add('ORDER BY 4'); 4 : qSearch.SQL.Add('ORDER BY 5'); 5 : qSearch.SQL.Add('ORDER BY 6'); 6 : qSearch.SQL.Add('ORDER BY 7'); 7 : qSearch.SQL.Add('ORDER BY 8'); 8 : qSearch.SQL.Add('ORDER BY 9'); End; Case RadioGroup2.ItemIndex of 0 : qSearch.SQL.Add('ASC'); 1 : qSearch.SQL.Add('DESC'); End; qSearch.Parameters[0].Value qSearch.Parameters[1].Value qSearch.Parameters[2].Value qSearch.Parameters[3].Value qSearch.Open; := '%' := '%' := '%' := '%' + Edit1.Text + '%'; + Edit2.Text + '%'; + Combobox1.Text + '%'; + Combobox2.Text + '%';
For I := 0 to DBGrid1.Columns.Count - 1 do DBGrid1.Columns[I].Color := clWindow; If RadioGroup2.ItemIndex = 0 then DBGrid1.Columns[RadioGroup1.ItemIndex].Color := clMoneyGreen Else DBGrid1.Columns[RadioGroup1.ItemIndex].Color := clSkyBlue; ActiveControl := DBGrid1; end; procedure TFDKoleksi.Reset; begin Edit1.Text := ''; Edit2.Text := ''; ComboBox1.ItemIndex := -1; ComboBox2.ItemIndex := -1; RadioGroup1.ItemIndex := 0; RadioGroup2.ItemIndex := 0; Search; end;
Reset
19. Pilih FDKoleksi pada Object TreeView, buat event onShow dan onClose, ketikkan perintah seperti table di bawah ini :
Komponen FDKoleksi Event onShow Code procedure TFDKoleksi.FormShow(Sender: TObject); begin Reset;
191
Komponen
Event onClose
Code end; procedure TFDKoleksi.FormClose(Sender: TObject; var Action: TCloseAction); begin qSearch.Close; end;
20. Pilih Edit1, dan Edit2 pada Object TreeView, buat event onKeyPress, ketikkan perintah seperti table di bawah ini :
Komponen Edit1, Edit2 Event onKeyPress Code procedure TFDKoleksi.Edit1KeyPress(Sender: TObject; var Key: Char); begin If Key = #13 then Search; end;
21. Pilih Combobox1 dan Combobox2 pada Object TreeView, buat event onChange, ketikkan perintah seperti table di bawah ini :
Komponen Combobox1, Combobox2 Event onChange Code procedure TFDKoleksi.ComboBox1Change(Sender: TObject); begin Search; end;
Komponen BitBtn1 Event onClick Code procedure TFDKoleksi.BitBtn1Click(Sender: TObject); begin Search; end;
Komponen BitBtn2 Event onClick Code procedure TFDKoleksi.BitBtn2Click(Sender: TObject); begin Reset; end;
Komponen RadioGroup1 Event onClick Code procedure TFDKoleksi.RadioGroup1Click(Sender: TObject); begin If RadioGroup1.ItemIndex in [7,8] then Begin RadioGroup2.ItemIndex := 0;
192
Komponen
Event
Code RadioGroup2.Enabled := False; End Else RadioGroup2.Enabled := True; Search; end;
Komponen RadioGroup2 Event onClick Code procedure TFDKoleksi.RadioGroup2Click(Sender: TObject); begin Search; end;
26. Klik menu File Use Unit, pilih FKoleksi, klik OK untuk melanjutkan. 27. Pilih DBGrid1 pada Object TreeView, buat event onDblClick, ketikkan perintah seperti table di bawah ini :
Komponen DBGrid1 Event onDblClick Code procedure TFDKoleksi.DBGrid1DblClick(Sender: TObject); begin With FKoleksi do Begin KoleksiID := qSearchKoleksiID.Value; ShowModal; End; end;
28. Kembali ke form FUtama, klik menu View Form, pilih FUtama, klik OK untuk melanjutkan. 29. Klik menu File Use Unit, pilih FDKoleksi, klik OK untuk melanjutkan. 30. Pilih DaftarKoleksi1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen DaftarKoleksi1 Event onClick Code procedure TFUtama.DaftarKoleksi1Click(Sender: TObject); begin FDKoleksi.ShowModal; end;
Komponen SpeedButton6 Event onClick Code procedure TFUtama.SpeedButton6Click(Sender: TObject); begin FDKoleksi.ShowModal; end;
193
194
Latihan 32 : Membuat Form Statistik
Form Statistik merupakan laporan agregat yang ditampilkan dalam berbagai bentuk grafik. Laporan agregat yang ditampilkan antara lain Member Baru per Bulan, Koleksi Baru per Bulan, Koleksi per Kategori, Peminjaman Koleksi per Hari dan Top 10 Koleksi. Grafik ini berguna untuk member dan pihak manajemen sebagai dasar pengambilan keputusan. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position Value Statistik bsSizeable FStatistik poDesktopCenter
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFStatistik.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan 5 buah ADOQuery dari tab ADO, atur property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent FStatistik Property Connection Name SQL Value FUtama.ADOConnection1 qMember SELECT YEAR(MEMBER.TGLDAFTAR) AS TAHUN, MONTH(MEMBER.TGLDAFTAR) AS BULAN, COUNT(MEMBER.MEMBERID) AS MEMBERBARU FROM MEMBER GROUP BY YEAR(MEMBER.TGLDAFTAR), MONTH(MEMBER.TGLDAFTAR) FUtama.ADOConnection1 qKoleksi SELECT YEAR(KOLEKSI.TGLBELI) AS TAHUN, MONTH(KOLEKSI.TGLBELI) AS BULAN, COUNT(KOLEKSI.KOLEKSIID) AS KOLEKSIBARU FROM KOLEKSI GROUP BY YEAR(KOLEKSI.TGLBELI), MONTH(KOLEKSI.TGLBELI) FUtama.ADOConnection1 qKategori
ADOQuery2
ADO
FStatistik
Connection Name SQL
ADOQuery3
ADO
FStatistik
Connection Name
195
SQL
ADOQuery4
ADO
FStatistik
Connection Name SQL
ADOQuery5
ADO
FStatistik
Connection Name SQL
SELECT KOLEKSI.KATEGORI, COUNT(KOLEKSI.KOLEKSIID) AS JUMLAHKOLEKSI FROM KOLEKSI GROUP BY KOLEKSI.KATEGORI FUtama.ADOConnection1 qPinjam SELECT TOP 15 PINJAM.TGLPINJAM, COUNT(DPINJAM.DPINJAMID) AS PEMINJAMAN FROM PINJAM, DPINJAM WHERE (PINJAM.PINJAMID = DPINJAM.PINJAMID) GROUP BY PINJAM.TGLPINJAM ORDER BY PINJAM.TGLPINJAM DESC FUtama.ADOConnection1 qTop10 SELECT TOP 10 KOLEKSI.KOLEKSIID, KOLEKSI.JUDUL, COUNT(DPINJAM.DPINJAMID) AS PEMINJAMAN FROM KOLEKSI, DPINJAM, PINJAM WHERE (PINJAM.PINJAMID = DPINJAM.PINJAMID) AND (DPINJAM.KOLEKSIID = KOLEKSI.KOLEKSIID) GROUP BY KOLEKSI.KOLEKSIID, KOLEKSI.JUDUL ORDER BY 3 DESC
7. Buat persistent field query qMember. Klik dua kali qMember pada Object TreeView untuk membuka field editor, klik kanan pilih Add All Fields. 8. Tambahkan calculated field baru BulanTahun pada query qMember. Klik kanan pada field editor pilih New Field, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field BulanTahun Section Field Properties Property Name Type Size Field type Value BulanTahun String 10 Calculated
Field type
9. Buat persistent field query qKoleksi. 10. Tambahkan calculated field baru BulanTahun pada qKoleksi, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field BulanTahun Section Field Properties Property Name Type Size Field type Value BulanTahun String 10 Calculated
Field type
196
11. Buat persistent field query qKategori. 12. Tambahkan calculated field baru KategoriKoleksi pada qKategori, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field KategoriKoleksi Section Field Properties Property Name Type Size Field type Value KategoriKoleksi String 30 Calculated
Field type
13. Buat persistent field query qPinjam. 14. Buat persistent field query qTop10. 15. Tambahkan calculated field baru JudulKoleksi pada qTop10, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field JudulKoleksi Section Field Properties Property Name Type Size Field type Value JudulKoleksi String 50 Calculated
Field type
16. Tambahkan 1 buah Toolbar dari tab Win32 ke dalam FStatistik atur property seperti table di bawah ini :
Komponen ToolBar1 Tab Win32 Parent FStatistik Property Autosize ButtonHeight ButtonWidth Value True 44 46
17. Tambahkan 2 buah Speedbutton dari tab Additional ke dalam ToolBar1, atur property seperti table di bawah ini :
Komponen SpeedButton1 Tab Additional Parent ToolBar1 Property Caption Glyph Tag Caption Glyph Tag Value Refresh Reset.bmp 1 Tutup Batal.bmp 2
SpeedButton2
Additional
ToolBar1
18. Tambahkan 1 buah PageControl dari tab Win32, ubah property seperti table di bawah ini :
Komponen PageControl1 Tab Win32 Parent FStatistik Property Align Value alClient
19. Tambahkan 5 buah TabSheet pada PageControl1, Atur property sepertu table di bawah ini :
Komponen TabSheet1 TabSheet2 Parent PageControl1 PageControl1 Property Caption Caption Value Member Baru per Bulan Koleksi Baru per Bulan
197
Komponen TabSheet3 TabSheet4 TabSheet5
Parent PageControl1 PageControl1 PageControl1
Property Caption Caption Caption
Value Koleksi per Kategori Peminjaman Koleksi per Hari Top 10 Koleksi
20. Atur layout form FStatistik seperti gambar di bawah ini :
21. Tambahkan 1 buah DBChart dari tab Data Control ke dalam TabSheet1, atur property seperti table di bawah ini :
Komponen DBChart1 Tab Data Control Parent TabSheet1 Property Align Value alClient
22. Klik dua kali DBChart1 pada ObjectTreeView untuk membuka jendela Editing DBChart, klik tab Chart, klik subtab Series. Klik Add untuk menambahkan Series baru, pilih Bar, klik OK untuk melanjutkan. Klik Title, isi dengan Member Baru, klik OK untuk melanjutkan.
198
23. Masih pada jendela Editing DBChart tab Chart, pilih subtab Title, ketikkan MEMBER BARU PER BULAN pada isian Title, atur font menjadi Trebuchet ukuran 12 points. Lihat gambar berikut :
199
24. Masih pada jendela Editing DBChart, klik tab Series, pada subtab Format pilih Pyramid pada pilihan Style dan beri tanda cek pada pilihan Color Each, lihat gambar berikut ini :
25. Masih pada jendela Editing Chart tab Series, klik subtab Data Source, pilih Dataset pada pilihan DataSource, pilih qMember pada pilihan Dataset, pilih BulanTahun pada isian Labels dan pilih MemberBaru pada isian Bar, klik Close untuk menutup jendela. Lihat gambar berikut ini :
200
26. Untuk variasi tampilan silakan Anda eksplorasi sendiri dengan mencoba kombinasi pengaturan pada jendela Editing DBChart. 27. Tambahkan 1 buah DBChart dari tab Data Control ke dalam TabSheet2, atur property seperti table di bawah ini :
28. Klik dua kali DBChart2 pada Object TreeView untuk membuka jendela Editing DBChart, ubah setting pada masing-masing tab seperti table di bawah ini :
Tab Chart Subtab Series Title Settings Add Title Title Font Size Style Color Each DataSource Dataset Labels Bar Value Horizontal Bar Koleksi Baru KOLEKSI BARU PER BULAN Trebuchet 12 Rectangle True Dataset qKoleksi BulanTahun KoleksiBaru
Series
Koleksi Baru Format Datasource
201
Tab Chart Subtab Series Settings Add Title Title Title Font Size Kategori Koleksi Format Circled Pie Marks Style Datasource DataSource Dataset Labels Pie Value Pie Kategori Koleksi KOLEKSI PER KATEGORI Trebuchet 12 True Label and Percent Dataset qKategori KategoriKoleksi JumlahKoleksi
Series
Tab Chart Subtab Series Settings Add Title Add Title Title Title Font Size Pinjam Per Hari Marks Visible Style Datasource DataSource Dataset Labels X X.DateTime Y Rata2 Pinjam Per Hari DataSource DataSource Function Selected Series Value Line Pinjam Per Hari Line Rata2 Pinjam Per Hari PEMINJAMAN KOLEKSI PER HARI Trebuchet 12 True Value Dataset qPinjam TglPinjam TglPinjam True Peminjaman Function Average Pinjam Per Hari
Series
202
Komponen DBChart5
Tab Data Control
Parent TabSheet5
Property Align
Value alClient
Tab Chart Subtab Series Title Settings Add Title Title Font Size Value Pie Top 10 Koleksi TOP 10 KOLEKSI Trebuchet 12 10 Label and Value Dataset qTop10 JudulKoleksi Peminjaman
Series
Top 10 Koleksi Format Exploded Biggest Marks Style Datasource DataSource Dataset Labels Pie
35. Buat konstanta Bulan dengan type Array [1..12] of String di atas deklarasi variable Unit FStatistik, lihat gambar berikut :
36. Pilih qMember pada Object TreeView, buat event onCalcFields, ketikkan perintah seperti table di bawah ini :
Komponen qMember Event onCalcFields Code procedure TFStatistik.qMemberCalcFields(DataSet: TDataSet); begin qMemberBulanTahun.Value := Bulan[qMemberBulan.Value] + ' ' + inttostr(qMemberTahun.Value); end;
37. Pilih qKoleksi pada Object TreeView, buat event onCalcFields, ketikkan perintah seperti table di bawah ini :
203
Komponen qKoleksi
Event onCalcFields
Code procedure TFStatistik.qKoleksiCalcFields(DataSet: TDataSet); begin qKoleksiBulanTahun.Value := Bulan[qKoleksiBulan.Value] + ' ' + inttostr(qKoleksiTahun.Value); end;
38. Pilih qKategori pada Object TreeView, buat event onCalcFields, ketikkan perintah seperti table di bawah ini :
Komponen qKategori Event onCalcFields Code procedure TFStatistik.qKategoriCalcFields(DataSet: TDataSet); begin qKategoriKategoriKoleksi.Value := qKategoriKategori.Value; end;
39. Pilih qTop10 pada Object TreeView, buat event onCalcFields, ketikkan perintah seperti table di bawah ini :
Komponen qTop10 Event onCalcFields Code procedure TFStatistik.qTop10CalcFields(DataSet: TDataSet); begin qTop10JudulKoleksi.Value := '[' + qTop10KoleksiID.AsString + '] ' + qTop10Judul.Value; end;
40. Buat procedure UpdateChart pada blok Private, ketikkan perintah seperti table di bawah ini :
Komponen FStatistik Procedure UpdateChart Code procedure TFStatistik.UpdateChart; begin qMember.Close; qMember.Open; qKoleksi.Close; qKoleksi.Open; qKategori.Close; qKategori.Open; qPinjam.Close; qPinjam.Open; qTop10.Close; qTop10.Open; end;
41. Pilih FStatistik pada Object TreeView, buat event onCreate, onShow dan onClose, ketikkan perintah seperti table di bawah ini :
Komponen FStatistik Event onCreate Code procedure TFStatistik.FormCreate(Sender: TObject); begin PageControl1.ActivePageIndex := 0; end; procedure TFStatistik.FormShow(Sender: TObject); begin
onShow
204
Komponen
Event
onClose
Code UpdateChart; end; procedure TFStatistik.FormClose(Sender: TObject; var Action: TCloseAction); begin qMember.Close; qKoleksi.Close; qKategori.Close; qPinjam.Close; qTop10.Close; end;
42. Pilih SpeedButton1 dan SpeedButton2 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen SpeedButton1, SpeedButton2 Event onClick Code procedure TFStatistik.SpeedButton1Click(Sender: TObject); begin Case (Sender as TSpeedButton).Tag of 1 : UpdateChart; 2 : Close; End; end;
43. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 44. Klik menu File Use Unit, pilih UFStatistik, klik OK untuk melanjutkan. 45. Pilih Statistik1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Statistik1 Event onClick Code procedure TFUtama.Statistika1Click(Sender: TObject); begin FStatistik.ShowModal; end;
Komponen SpeedButton7 Event onClick Code procedure TFUtama.SpeedButton7Click(Sender: TObject); begin FStatistik.SHowModal; end;
NEW
Tugas Di Rumah :
1. Sempurnakan Latihan 17 s/d 29. 2. Selesaikan Latihan 30 s/d 32.
205
3. Masukkan 20 transaksi peminjaman dengan minimal pinjam 2 koleksi per transaksi. 4. Masukkan 20 transaksi kembali dengan minimal pengembalian 1 koleksi per transaksi.
206
Latihan 33 : Membuat Form Laporan Peminjaman
Form Laporan Peminjaman merupakan laporan standard yang menampilkan transaksi peminjaman berdasarkan periode tertentu dan karyawan. Karyawan dengan hak akses 1 hanya dapat melihat transaksi pada hari ini, sedangkan karyawan dengan hak akses 2 dapat melihat dan mencetak seluruh periode transaksi. Form ini terhubung dengan form transaksi peminjaman, klik dua kali pada baris transaksi akan menampilkan detail transaksi tersebut. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position Value Laporan Peminjaman bsSizeable FLPinjam poDesktopCenter
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFLPinjam.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan 2 buah ADOQuery dari tab ADO ke dalam FLPinjam, atur property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent FLPinjam Property Connection Name SQL Value FUtama.ADOConnection1 qLPinjam Select Pinjam.PinjamID, Pinjam.TglPinjam, Pinjam.MemberID, Member.Nama, Count(DPinjam.DPinjamID) as JumlahPinjam, sum(DPinjam.HargaSewa) as TotalSewa, Karyawan.Nama From Pinjam, DPinjam, Member, Karyawan Where (Pinjam.PinjamID = DPinjam.PinjamID) and (Pinjam.MemberID = Member.MemberID) and (Pinjam.KaryawanID = Karyawan.KaryawanID) and (Pinjam.TglPinjam >= :TglAwal) and (Pinjam.TglPinjam <= :TglAkhir) and (Karyawan.Nama like :NamaKaryawan) Group by Pinjam.PinjamID,
207
ADOQuery2
ADO
FLPinjam
Connection Name SQL
Pinjam.TglPinjam, Pinjam.MemberID, Member.Nama, Karyawan.Nama Order by Pinjam.TglPinjam, Pinjam.PinjamID FUtama.ADOConnection1 qKaryawan Select Karyawan.Nama From Karyawan Order by Karyawan.Nama
7. Atur property paramaters pada qLPinjam seperti table di bawah ini :

Komponen TParameters[0] TParameters[1] TParameters[2] Property DataType DataType DataType Value ftDate ftDate ftWideString
8. Buat persistent field query qLPinjam. Pilih field TotalSewa pada field editor, ubah property seperti table di bawah ini :
Komponen qLPinjamTotalSewa Property Currency Value True
9. Buat persistent field query qKaryawan. 10. Tambahkan 1 buah Datasource dari tab Data Access ke dalam FLPinjam, atur property seperti table di bawah ini :
Komponen Datasource1 Tab Data Access Parent FLPinjam Property Dataset Value qLPinjam
11. Tambahkan 3 buah GroupBox dari tab Standard ke dalam FLPinjam, atur property seperti table di bawah ini :
Komponen GroupBox1 GroupBox2 GroupBox3 Tab Standard Standard Standard Parent FLPinjam FLPinjam FLPinjam Property Align Caption Align Caption Align Caption Value alTop alBottom alClient
12. Tambahkan 3 buah Label dari tab Standard ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen Label1 Label2 Label3 Tab Standard Standard Standard Parent GroupBox1 GroupBox1 GroupBox1 Property Caption Caption Caption Value Periode s/d Karyawan
13. Tambahkan 2 buah DateTimePicker dari tab Win32 ke dalam GroupBox1. 14. Tambahkan 1 buah Combobox1 dari tab Standard ke dalam GroupBox1.
208
Komponen Combobox1
Tab Standard
Parent GroupBox1
Property Style Text
Value csDropDownList
15. Tambahkan 1 buah Bevel dari tab Additional ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen Bevel1 Tab Additional Parent GroupBox1 Property Shape Value bsLeftLine
Komponen BitBtn1 BitBtn2 Tab Additional Additional Parent GroupBox1 GroupBox1 Property Caption Glyph Caption Glyph Value Refresh Reset.bmp Cetak Printer.bmp
Komponen DBGrid1 Tab Data Control Parent GroupBox3 Property Align Datasource Options.dgRowSelect Options.dgAlwaysShowSelection Options.dgEditing Value alClient Datasource1 True True False
18. Klik dua kali DBGrid1 pada Object TreeView, klik kanan pada Column Editor, pilih Add All Fields untuk menambahkan seluruh kolom. Atur property masing-masing kolom seperti table di bawah ini :
Komponen DBGrid1.Columns[0] DBGrid1.Columns[1] DBGrid1.Columns[2] DBGrid1.Columns[3] DBGrid1.Columns[4] DBGrid1.Columns[5] DBGrid1.Columns[6] DBGrid1.Columns[0], DBGrid1.Columns[1], DBGrid1.Columns[2], DBGrid1.Columns[3], DBGrid1.Columns[4], DBGrid1.Columns[5], DBGrid1.Columns[6] Property Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Font.Style.fsBold Title.Alignment Value #Pinjam Tgl Pinjam #Member Nama Member Pinjam Total Sewa Nama Karyawan True taCenter
19. Tambahkan 2 buah Label ke dalam GroupBox2, atur property seperti table di bawah ini :
Komponen Tab Parent Property Value
209
Label4 Label5
Standard Standard
GroupBox2 GroupBox2
Caption Caption
Total Koleksi yang Dipinjam Total Pendapatan Sewa
20. Tambahkan 2 buah Edit ke dalam GroupBox2, atur property seperti table di bawah ini :
Komponen Edit1, Edit2 Tab Standard Parent GroupBox2 Property ReadOnly Text Value True
21. Atur layout form FLPinjam seperti gambar di bawah ini :
22. Tambahkan unit DateUtils pada blok Uses di unit UFLPinjam. 23. Buat procedure UpdateKaryawan, procedure UpdateTotal dan procedure UpdateqLPinjam pada blok Private, ketikkan perintah seperti table di bawah ini :
Komponen FLPinjam Procedure UpdateKaryawan Code procedure TFLPinjam.UpdateKaryawan; begin With Combobox1 do Begin Clear; Items.Add('SEMUA KARYAWAN'); qKaryawan.Open; While not qKaryawan.Eof do Begin Items.Add(qKaryawanNama.Value); qKaryawan.Next; End; qKaryawan.Close; ItemIndex := Items.IndexOf(FUtama.NamaKaryawan); End; end; procedure TFLPinjam.UpdateTotal; var
UpdateTotal
210
Komponen
Procedure
UpdateqLPinjam
Code TotalKoleksi : Integer; TotalSewa : Real; PrevRecord: TBookmark; begin PrevRecord := qLPinjam.GetBookmark; try qLPinjam.DisableControls; qLPinjam.First; TotalKoleksi := 0; TotalSewa := 0; while not qLPinjam.EOF do begin TotalKoleksi := TotalKoleksi + qLPinjamJumlahPinjam.Value; TotalSewa := TotalSewa + qLPinjamTotalSewa.Value; qLPinjam.Next; end; Edit1.Text := FormatFloat(',0', TotalKoleksi); Edit2.Text := FormatFloat(',0', TotalSewa); finally qLPinjam.EnableControls; if PrevRecord <> nil then begin qLPinjam.GoToBookmark(PrevRecord); qLPinjam.FreeBookmark(PrevRecord); end; end; end; procedure TFLPinjam.UpdateqLPinjam; begin qLPinjam.Close; qLPinjam.Parameters[0].Value := DateTimePicker1.Date - 1; qLPinjam.Parameters[1].Value := DateTimePicker2.Date; If Combobox1.ItemIndex = 0 then qLPinjam.Parameters[2].Value := '%' else qLPinjam.Parameters[2].Value := Combobox1.Text; qLPinjam.Open; UpdateTotal; end;
24. Pilih FLPinjam pada Object TreeView, buat event onShow, ketikkan perintah seperti table di bawah ini :
Komponen FLPinjam Event onShow Code procedure TFLPinjam.FormShow(Sender: TObject); begin DateTimePicker1.Date := Today; DateTimePicker2.Date := Today; UpdateKaryawan; UpdateqLPinjam; end;
25. Pilih DateTimePicker1, DateTimePicker2 dan Combobox1 pada Object TreeView, buat event onChange, ketikkan perintah seperti table di bawah ini :
211
Komponen DateTimePicker1, DateTimePicker2, Combobox1
Event onChange
Code procedure TFLPinjam.DateTimePicker1Change(Sender: TObject); begin BitBtn2.Enabled := False; end;
Komponen Datasource1 Event onStateChange Code procedure TFLPinjam.DataSource1StateChange(Sender: TObject); begin DateTimePicker1.Enabled := FUtama.HakAkses in [2]; DateTimePicker2.Enabled := FUtama.HakAkses in [2]; Combobox1.Enabled := FUtama.HakAkses in [2]; BitBtn1.Enabled := FUtama.HakAkses in [1,2]; BitBtn2.Enabled := FUtama.HakAkses in [2]; end;
Komponen BitBtn1 Event onClick Code procedure TFLPinjam.BitBtn1Click(Sender: TObject); begin UpdateqLPinjam; BitBtn2.Enabled := FUtama.HakAkses in [2]; end;
28. Klik menu File Use Unit, pilih unit UFPinjam, klik OK untuk melanjutkan. 29. Pilih DBGrid1 pada Object TreeView, buat event onDblClick, ketikkan perintah seperti table di bawah ini :
Komponen DBGrid1 Event onDblClick Code procedure TFLPinjam.DBGrid1DblClick(Sender: TObject); begin With FPinjam Do Begin PinjamID := qLPinjamPinjamID.value; ShowModal; End; end;
30. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 31. Klik menu File Use Unit, pilih UFLPinjam, klik OK untuk melanjutkan. 32. Pilih ransaksiPeminjaman1 pada ObjectTreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen ransaksiPeminjaman1 Event onClick Code procedure TFUtama.ransaksiPeminjaman1Click(Sender: TObject); begin
212
Komponen
Event
Code FLPinjam.ShowModal; end;
33. Simpan seluruh project, jalankan dan uji aplikasi.
213
Latihan 34 : Membuat QuickReport Laporan Peminjaman
QuickReport Laporan Peminjaman merupakan fasilitas cetak laporan yang dimiliki oleh form Laporan Peminjaman. Fasilitas ini hanya bisa diakses oleh karyawan dengan hak akses 2. Langkah-langkah :
1. Pastikan project Rental.dpr telah dibuka. 2. Buat Report baru, klik menu File New Others, pada tab New pilih Reports, klik OK untuk melanjutkan. 3. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 4. Copy dan paste qLPinjam dari form FLPinjam ke dalam QuickReport1. 5. Pilih QuickReport1 pada Object TreeView, ubah property seperti table di bawah ini :
Komponen QuickReport1 Property Dataset Name Value qLPinjam QRLPinjam
6. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UQRLPinjam.pas dalam folder Rental. 7. Klik dua kali QRLPinjam pada Object TreeView untuk membuka jendela Report Settings. Ubah Units dari Inch menjadi MM, klik Apply.
Settings Report Settings Section Paper size Margin Property Paper size Orientation Top Bottom Left Right Font Size PageHeader Title ColumnHeader DetailBand Summary Print first page header Print last page footer Value A5 148 x 210 mm Landscape 5.00 5.00 5.00 5.00 Trebuchet MS 10 True True True True True False False
Other Bands
214
9. Tambahkan 1 buah QRLabel dan 1 buah QRSysData dari tab QReports ke dalam PageHeaderBand1, ubah property seperti table di bawah ini :
Komponen QRLabel1 QRSysData1 Tab QReports QReports Parent PageHeaderBand1 PageHeaderBand1 Property Caption Alignment Autosize Data Value Halaman : taRightJustify False qrsPageNumber
10. Tambahkan 7 buah QRLabel dan 1 buah QRSysData dari tab QReports ke dalam TitleBand1, atur property seperti table di bawah ini :
Komponen QRLabel2 QRSysData2 Tab QReports QReports Parent TitleBand1 TitklBand1 Property Caption Alignment Autosize Data Caption Caption Caption Alignment AlignToBand Caption Font.Style.fsUnderline Font.Style.fsBold Value Halaman : taRightJustify False qrsPageNumber Nama Rental Alamat Rental Telepon Rental taCenter True LAPORAN PEMINJAMAN True True
QRLabel3 QRLabel4 QRLabel5 QRLabel6
QReports QReports QReports QReports
TitleBand1 TitleBand1 TitleBand1 TitleBand1
215
Komponen QRLabel7 QRLabel8
Tab QReports QReports
Parent TitleBand1 TitleBand1
Property Caption Caption
Value Periode : Nama Karyawan
12. Tambahkan 8 buah QRLabel dari tab QReports ke ColumnHeaderBand1, atur property seperti table di bawah ini :
Komponen QRLabel9 QRLabel10 QRLabel11 QRLabel12 QRLabel13 QRLabel14 QRLabel15 QRLabel16 QRLabel9, QRLabel11, QRLabel12, QRLabel14, QRLabel15 Tab QReports QReports QReports QReports QReports QReports QReports QReports Parent ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 Property Autosize Caption Caption Caption Caption Caption Caption Caption Caption Alignment
dalam
Value False No. Tgl Pinjam #Pinjam #Member Nama Member Pinjam Total Sewa Nama Karyawan taRightJustify
Komponen QRSysData3, QRExpr1, QRExpr2 QRSysData3 QRDBText1, QRDBText2, QRDBText3, QRDBText4, QRDBText5 QRSysData3, QRDBText2, Tab QReports Parent DetailBand1 Property Autosize Value False
QReports QReports
DetailBand1 DetailBand1
Data Dataset
qrsDetailNo qLPinjam
QReports
DetailBand1
Alignment
taRightJustify
216
Komponen QRDBText3, QRExpr1, QRExpr2 QRDBText1 QRDBText2 QRDBText3 QRDBText4 QRDBText5 QRExpr1 QRExpr2
Tab
Parent
Property
Value
QReports QReports QReports QReports QReports QReports QReports
DetailBand1 DetailBand1 DetailBand1 DetailBand1 DetailBand1 DetailBand1 DetailBand1
DataField DataField DataField DataField DataField Expression Expression
TglPinjam PinjamID MemberID Member.Nama Karyawan.Nama FORMATNUMERIC(',0', qLPinjam.JumlahPinjam) FORMATNUMERIC(',0', qLPinjam.TotalSewa)
Komponen QRLabel17 QRLabel18 QRSysData4 QRExpr3, QRExpr4 QRExpr3 QRExpr4 Tab QReports QReports QReports QReports QReports QReports Parent SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 Property Caption Caption Alignment Data Alignment Autosize Expression Expression Value Tgl Cetak : Grand Total taRightJustify qrsDateTime taRightJustify False FORMATNUMERIC(',0', SUM(qLPinjam.JumlahKoleksi)) FORMATNUMERIC(',0', sum(qLPinjam.TotalSewa))
17. Pilih PageFooterBand1 pada Object TreeView, ubah property seperti table di bawah ini :
Komponen PageFooterBand1 Property Frame.DrawTop Height Value True 32
18. Tambahkan 1 buah QRLabel dan 2 buah QRExpr dari tab QReports ke dalam PageFooterBand1, ubah property seperti table di bawah ini :
Komponen QRLabel19 QRExpr5, QRExpr6 QRExpr3 Tab QReports QReports QReports Parent PageFooterBand1 PageFooterBand1 PageFooterBand1 Property Caption Alignment Alignment Autosize Expression Value SubTotal taRightJustify taRightJustify False FORMATNUMERIC(',0',
217
Komponen QRExpr4
Tab QReports
Parent PageFooterBand1
Property Expression
Value SUM(qLPinjam.JumlahKoleksi)) FORMATNUMERIC(',0', sum(qLPinjam.TotalSewa))
19. Atur layout QRLPinjam seperti gambar di bawah ini :
20. Kembali ke form FLPinjam, klik menu View Forms, pilih FLPinjam, klik OK untuk melanjutkan. 21. Klik menu File Use Unit, pilih UQRLPinjam, klik OK untuk melanjutkan. 22. Pilih BitBtn2 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen BitBtn2 Procedure onClick Code procedure TFLPinjam.BitBtn2Click(Sender: TObject); begin With QRLPinjam do Begin qLPinjam.Close; qLPinjam.Parameters[0].Value := DateTimePicker1.Date - 1; qLPinjam.Parameters[1].Value := DateTimePicker2.Date; If Combobox1.ItemIndex = 0 then qLPinjam.Parameters[2].Value := '%' else qLPinjam.Parameters[2].Value := Combobox1.Text; qLPinjam.Open; QRLabel3.Caption := FUtama.NamaRental; QRLabel4.Caption := FUtama.AlamatRental; QRLabel5.Caption := FUtama.TelpRental; QRLabel7.Caption := 'Periode : ' + Datetostr(DateTimePicker1.Date) + ' s/d ' + DatetoStr(DateTimePicker2.Date); QRLabel8.Caption := Combobox1.Text; Preview; End; end;
218
Latihan 35 : Membuat Form Laporan Pengembalian
Form Laporan Pengembalian merupakan laporan standard yang menampilkan transaksi pengembalian koleksi berdasarkan periode tertentu dan karyawan. Karyawan dengan hak akses 1 hanya dapat melihat transaksi pada hari bersangkutan, sedangkan karyawan dengan hak akses 2 dapat melihat dan mencetak seluruh periode transaksi. Form ini terhubung dengan form transaksi pengembalian, klik dua kali pada baris transaksi akan menampilkan detail transaksi tersebut. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position Value Laporan Pengembalian bsSizeable FLKembali poDesktopCenter
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFLKembali.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan 2 buah ADOQuery dari tab ADO ke dalam FLKembali, atur property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent FLKembali Property Connection Name SQL Value FUtama.ADOConnection1 qLKembali Select Kembali.KembaliID, Kembali.TglKembali, Kembali.MemberID, Member.Nama, Count(DPinjam.DPinjamID) as JumlahKembali, sum(DPinjam.Denda) as TotalDenda, Karyawan.Nama From Kembali, DPinjam, Member, Karyawan Where (Kembali.KembaliID = DPinjam.KembaliID) and (Kembali.MemberID = Member.MemberID) and (Kembali.KaryawanID = Karyawan.KaryawanID) and (Kembali.TglKembali >= :TglAwal) and (Kembali.TglKembali <= :TglAkhir) and (Karyawan.Nama like :NamaKaryawan)
219
Komponen
Tab
Parent
Property
ADOQuery2
ADO
FLKembali
Connection Name SQL
Value Group by Kembali.KembaliID, Kembali.TglKembali, Kembali.MemberID, Member.Nama, Karyawan.Nama Order by Kembali.TglKembali, Kembali.KembaliID FUtama.ADOConnection1 qKaryawan Select Karyawan.Nama From Karyawan Order by Karyawan.Nama
7. Atur property paramaters pada qLKembali seperti table di bawah ini :

Komponen TParameters[0] TParameters[1] TParameters[2] Property DataType DataType DataType Value ftDate ftDate ftWideString
8. Buat persistent field query qLKembali. Pilih field TotalDenda pada field editor, ubah property seperti table di bawah ini :
Komponen qLPinjamTotalDenda Property Currency Value True
9. Buat persistent field query qKaryawan. 10. Tambahkan 1 buah Datasource dari tab Data Access ke dalam FLKembali, atur property seperti table di bawah ini :
Komponen Datasource1 Tab Data Access Parent FLKembali Property Dataset Value qLKembali
11. Tambahkan 3 buah GroupBox dari tab Standard ke dalam FLKembali, atur property seperti table di bawah ini :
Komponen GroupBox1 GroupBox2 GroupBox3 Tab Standard Standard Standard Parent FLKembali FLKembali FLKembali Property Align Caption Align Caption Align Caption Value alTop alBottom alClient
Komponen Label1 Label2 Label3 Tab Standard Standard Standard Parent GroupBox1 GroupBox1 GroupBox1 Property Caption Caption Caption Value Periode s/d Karyawan
13. Tambahkan 2 buah DateTimePicker dari tab Win32 ke dalam GroupBox1.
220
14. Tambahkan 1 buah Combobox1 dari tab Standard ke dalam GroupBox1.

Komponen Combobox1 Tab Standard Parent GroupBox1 Property Style Text Value csDropDownList
15. Tambahkan 1 buah Bevel dari tab Additional ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen DBGrid1.Columns[0] DBGrid1.Columns[1] DBGrid1.Columns[2] DBGrid1.Columns[3] DBGrid1.Columns[4] DBGrid1.Columns[5] DBGrid1.Columns[6] DBGrid1.Columns[0], DBGrid1.Columns[1], DBGrid1.Columns[2], DBGrid1.Columns[3], DBGrid1.Columns[4], DBGrid1.Columns[5], DBGrid1.Columns[6] Property Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Font.Style.fsBold Title.Alignment Value #Kembali Tgl Kembali #Member Nama Member Kembali Total Denda Nama Karyawan True taCenter
221
Komponen Label4 Label5
Tab Standard Standard
Parent GroupBox2 GroupBox2
Value Total Koleksi yang Dikembalikan Total Pendapatan Denda
Komponen Edit1, Edit2 Tab Standard Parent GroupBox2 Property ReadOnly Text Value True
21. Atur layout form FLKembali seperti gambar di bawah ini :
22. Tambahkan unit DateUtils pada blok Uses di unit UFLKembali. 23. Buat procedure UpdateKaryawan, procedure UpdateTotal dan procedure UpdateqLKembali pada blok Private, ketikkan perintah seperti table di bawah ini :
Komponen FLKembali Procedure UpdateKaryawan Code procedure TFLKembali.UpdateKaryawan; begin With Combobox1 do Begin Clear; Items.Add('SEMUA KARYAWAN'); qKaryawan.Open; While not qKaryawan.Eof do Begin Items.Add(qKaryawanNama.Value); qKaryawan.Next; End; qKaryawan.Close; ItemIndex := Items.IndexOf(FUtama.NamaKaryawan); End; end; procedure TFLKembali.UpdateTotal;
UpdateTotal
222
Komponen
Procedure
UpdateqLKembali
Code var TotalKoleksi : Integer; TotalDenda : Real; PrevRecord: TBookmark; begin PrevRecord := qLKembali.GetBookmark; try qLKembali.DisableControls; qLKembali.First; TotalKoleksi := 0; TotalDenda := 0; while not qLKembali.EOF do begin TotalKoleksi := TotalKoleksi + qLKembaliJumlahKembali.Value; TotalDenda := TotalDenda + qLKembaliTotalDenda.Value; qLKembali.Next; end; Edit1.Text := FormatFloat(',0', TotalKoleksi); Edit2.Text := FormatFloat(',0', TotalDenda); finally qLKembali.EnableControls; if PrevRecord <> nil then begin qLKembali.GoToBookmark(PrevRecord); qLKembali.FreeBookmark(PrevRecord); end; end; end; procedure TFLKembali.UpdateqLKembali; begin qLKembali.Close; qLKembali.Parameters[0].Value := DateTimePicker1.Date - 1; qLKembali.Parameters[1].Value := DateTimePicker2.Date; If Combobox1.ItemIndex = 0 then qLKembali.Parameters[2].Value := '%' else qLKembali.Parameters[2].Value := Combobox1.Text; qLKembali.Open; UpdateTotal; end;
24. Pilih FLKembali pada Object TreeView, buat event onShow, ketikkan perintah seperti table di bawah ini :
Komponen FLKembali Event onShow Code procedure TFLKembali.FormShow(Sender: TObject); begin DateTimePicker1.Date := Today; DateTimePicker2.Date := Today; UpdateKaryawan; UpdateqLKembali; end
223
25. Pilih DateTimePicker1, DateTimePicker2 dan Combobox1 pada Object TreeView, buat event onChange, ketikkan perintah seperti table di bawah ini :
Komponen DateTimePicker1, DateTimePicker2, Combobox1 Event onChange Code procedure TFLKembali.DateTimePicker1Change(Sender: TObject); begin BitBtn2.Enabled := False; end;
Komponen Datasource1 Event onStateChange Code procedure TFLKembali.DataSource1StateChange(Sender: TObject); begin DateTimePicker1.Enabled := FUtama.HakAkses in [2]; DateTimePicker2.Enabled := FUtama.HakAkses in [2]; Combobox1.Enabled := FUtama.HakAkses in [2]; BitBtn1.Enabled := FUtama.HakAkses in [1,2]; BitBtn2.Enabled := FUtama.HakAkses in [2]; end;
Komponen BitBtn1 Event onClick Code procedure TFLKembali.BitBtn1Click(Sender: TObject); begin UpdateqLKembali; BitBtn2.Enabled := FUtama.HakAkses in [2]; end;
28. Klik menu File Use Unit, pilih unit UFKembali, klik OK untuk melanjutkan. 29. Pilih DBGrid1 pada Object TreeView, buat event onDblClick, ketikkan perintah seperti table di bawah ini :
Komponen DBGrid1 Event onDblClick Code procedure TFLKembali.DBGrid1DblClick(Sender: TObject); begin With FKembali Do Begin KembaliID := qLKembaliKembaliID.value; ShowModal; End; end;
30. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 31. Klik menu File Use Unit, pilih UFLKembali, klik OK untuk melanjutkan. 32. Pilih ransaksiPengembalian1 pada ObjectTreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
224
Komponen ransaksiPengembalian1
Event onClick
Code procedure TFUtama.ransaksiPengembalian1Click(Sender: TObject); begin FLKembali.ShowModal; end;
225
Latihan 36 : Membuat QuickReport Laporan Pengembalian
QuickReport Laporan Pengembalian merupakan fasilitas cetak laporan yang dimiliki oleh form Laporan Pengembalian. Fasilitas ini hanya bisa diakses oleh karyawan dengan hak akses 2. Langkah-langkah :
1. Pastikan project Rental.dpr telah dibuka. 2. Buat Report baru, klik menu File New Others, pada tab New pilih Reports, klik OK untuk melanjutkan. 3. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 4. Copy dan paste qLKembali dari form FLKembali ke dalam QuickReport1. 5. Pilih QuickReport1 pada Object TreeView, ubah property seperti table di bawah ini :
Komponen QuickReport1 Property Dataset Name Value qLKembali QRLKembali
6. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UQRLKembali.pas dalam folder Rental. 7. Klik dua kali QRLKembali pada Object TreeView untuk membuka jendela Report Settings. Ubah Units dari Inch menjadi MM, klik Apply.
8. Masih pada jendela Report Settings, ubah setting lainnya seperti table berikut (lihat juga gambar di bawahnya), klik OK untuk melanjutkan.
Other Bands
226
Komponen QRLabel2 QRSysData2 Tab QReports QReports Parent TitleBand1 TitklBand1 Property Caption Alignment Autosize Data Caption Caption Caption Alignment AlignToBand Caption Font.Style.fsUnderline Font.Style.fsBold Caption Caption Value Halaman : taRightJustify False qrsPageNumber Nama Rental Alamat Rental Telepon Rental taCenter True LAPORAN PENGEMBALIAN True True Periode : Nama Karyawan
QRLabel7 QRLabel8
QReports QReports
TitleBand1 TitleBand1
227
Komponen QRLabel9 QRLabel10 QRLabel11 QRLabel12 QRLabel13 QRLabel14 QRLabel15 QRLabel16 QRLabel9, QRLabel11, QRLabel12, QRLabel14, QRLabel15 Tab QReports QReports QReports QReports QReports QReports QReports QReports Parent ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 Property Autosize Caption Caption Caption Caption Caption Caption Caption Caption Alignment
dalam
Value False No. Tgl Kembali #Kembali #Member Nama Member Kembali Total Denda Nama Karyawan taRightJustify
Komponen QRSysData3, QRExpr1, QRExpr2 QRSysData3 QRDBText1, QRDBText2, QRDBText3, QRDBText4, QRDBText5 QRSysData3, QRDBText2, QRDBText3, QRExpr1, QRExpr2 QRDBText1 QRDBText2 Tab QReports Parent DetailBand1 Property Autosize Value False
QReports QReports
Data Dataset
qrsDetailNo qLKembali
QReports
DetailBand1
Alignment
taRightJustify
QReports QReports
DataField DataField
TglKembali KembaliID
228
Komponen QRDBText3 QRDBText4 QRDBText5 QRExpr1 QRExpr2
Tab QReports QReports QReports QReports QReports
Parent DetailBand1 DetailBand1 DetailBand1 DetailBand1 DetailBand1
Property DataField DataField DataField Expression Expression
Value MemberID Member.Nama Karyawan.Nama FORMATNUMERIC(',0', qLKembali.JumlahKembali) FORMATNUMERIC(',0', qLKembali.TotalDenda)
Komponen QRLabel17 QRLabel18 QRSysData4 QRExpr3, QRExpr4 QRExpr3 QRExpr4 Tab QReports QReports QReports QReports QReports QReports Parent SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 Property Caption Caption Alignment Data Alignment Autosize Expression Expression Value Tgl Cetak : Grand Total taRightJustify qrsDateTime taRightJustify False FORMATNUMERIC(',0', SUM(qLKembali.JumlahKembali)) FORMATNUMERIC(',0', sum(qLKembali.TotalDenda))
Komponen QRLabel19 QRExpr5, QRExpr6 QRExpr5 QRExpr6 Tab QReports QReports QReports QReports Parent PageFooterBand1 PageFooterBand1 PageFooterBand1 PageFooterBand1 Property Caption Alignment Alignment Autosize Expression Expression Value SubTotal taRightJustify taRightJustify False FORMATNUMERIC(',0', SUM(qLKembali.JumlahKembali)) FORMATNUMERIC(',0', sum(qLKembali.TotalDenda))
19. Atur layout QRLKembali seperti gambar di bawah ini :
229
20. Kembali ke form FLKembali, klik menu View Forms, pilih FLKembali, klik OK untuk melanjutkan. 21. Klik menu File Use Unit, pilih UQRLKembali, klik OK untuk melanjutkan. 22. Pilih BitBtn2 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen BitBtn2 Procedure onClick Code procedure TFLKembali.BitBtn2Click(Sender: TObject); begin With QRLKembali do Begin qLKembali.Close; qLKembali.Parameters[0].Value := DateTimePicker1.Date - 1; qLKembali.Parameters[1].Value := DateTimePicker2.Date; If Combobox1.ItemIndex = 0 then qLKembali.Parameters[2].Value := '%' else qLKembali.Parameters[2].Value := Combobox1.Text; qLKembali.Open; QRLabel3.Caption := FUtama.NamaRental; QRLabel4.Caption := FUtama.AlamatRental; QRLabel5.Caption := FUtama.TelpRental; QRLabel7.Caption := 'Periode : ' + Datetostr(DateTimePicker1.Date) + ' s/d ' + DatetoStr(DateTimePicker2.Date); QRLabel8.Caption := Combobox1.Text; Preview; End; end;
NEW
Tugas Di Rumah :
1. Sempurnakan Latihan 17 s/d 32. 2. Selesaikan Latihan 33 s/d 36.
230
Latihan 37 : Membuat Form Laporan Koleksi Belum Kembali
Form Laporan Koleksi Belum Kembali adalah laporan yang menampilkan daftar koleksi yang belum kembali, member yang meminjamnya serta denda yang harus dibayar member tersebut. Form ini terhubung dengan form Member, klik dua kali pada baris koleksi akan menampilkan informasi lengkap member yang meminjamnya. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position Value Laporan Koleksi Belum Kembali bsSizeable FLKBKembali poDesktopCenter
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFLKBKembali.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan 1 buah ADOQuery dari tab ADO ke dalam FLKBKembali, atur property seperti table di bawah ini :
Komponen ADOQuery1 Tab ADO Parent FLKBKembali Property Connection Name SQL Value FUtama.ADOConnection1 qLKBKembali Select DPinjam.TglHarusKembali, Pinjam.TglPinjam, Koleksi.KoleksiID, Koleksi.Judul, Pinjam.MemberID, Member.Nama, Koleksi.HargaDenda From Koleksi, Pinjam, Member, DPinjam Where (Pinjam.PinjamID = DPinjam.PinjamID) and (Pinjam.MemberID = Member.MemberID) and (DPinjam.KoleksiID = Koleksi.KoleksiID) and (DPinjam.KembaliID = 0) And (DPinjam.TglHarusKembali <= :TglHarusKembali) Order by DPinjam.TglHarusKembali, Koleksi.Judul
7. Atur property paramaters pada qLKBKembali seperti table di bawah ini :
231
Komponen TParameters[0]
Property DataType
Value ftDate
8. Buat persistent field query qLKBKembali. 9. Tambahkan calculated field baru Telat pada qLKBKembali. Klik kanan pada field editor pilih New Field, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field Telat Section Field Properties Field type Property Name Type Field type Value Telat Integer Calculated
10. Tambahkan calculated field TotalDenda pada qLKBKembali, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field TotalDenda Section Field Properties Field type Property Name Type Field type Value TotalDenda Currency Calculated
11. Tambahkan 1 buah Datasource dari tab Data Access ke dalam FLKBKembali, atur property seperti table di bawah ini :
Komponen Datasource1 Tab Data Access Parent FLKBKembali Property Dataset Value qLKBKembali
12. Tambahkan 3 buah GroupBox dari tab Standard ke dalam FLKBKembali, atur property seperti table di bawah ini :
Komponen GroupBox1 GroupBox2 GroupBox3 Tab Standard Standard Standard Parent FLKBKembali FLKBKembali FLKBKembali Property Align Caption Align Caption Align Caption Value alTop alBottom alClient
Komponen Label1 Tab Standard Parent GroupBox1 Property Caption Value Sampai Dengan Tanggal
14. Tambahkan 1 buah DateTimePicker dari tab Win32 ke dalam GroupBox1. 15. Tambahkan 1 buah Bevel dari tab Additional ke dalam GroupBox1, atur property seperti table di bawah ini :
232
Komponen DBGrid1.Columns[0] DBGrid1.Columns[1] DBGrid1.Columns[2] DBGrid1.Columns[3] DBGrid1.Columns[4] DBGrid1.Columns[5] DBGrid1.Columns[6] DBGrid1.Columns[7] DBGrid1.Columns[8] DBGrid1.Columns[0], DBGrid1.Columns[1], DBGrid1.Columns[2], DBGrid1.Columns[3], DBGrid1.Columns[4], DBGrid1.Columns[5], DBGrid1.Columns[6], DBGrid1.Columns[7], DBGrid1.Columns[8] Property Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Caption Title.Font.Style.fsBold Title.Alignment Value Harus Kembali Tgl Pinjam #Koleksi Judul Koleksi #Member Nama Member Denda/Hari Telat Total Denda True taCenter
Komponen Label4 Label5 Tab Standard Standard Parent GroupBox2 GroupBox2 Property Caption Caption Value Total Koleksi Belum Kembali Estimasi Pendapatan Denda
233
Komponen Edit1, Edit2
Tab Standard
Parent GroupBox2
Property ReadOnly Text
Value True
21. Atur layout form FLKBKembali seperti gambar di bawah ini :
22. Tambahkan unit DateUtils pada blok Uses di unit UFLKBKembali. 23. Buat procedure procedure UpdateTotal dan procedure UpdateqLKBKembali pada blok Private, ketikkan perintah seperti table di bawah ini :
Komponen FLKBKembali Procedure UpdateTotal Code procedure TFLKBKembali.UpdateTotal; var TotalDenda : Real; PrevRecord: TBookmark; begin PrevRecord := qLKBKembali.GetBookmark; try qLKBKembali.DisableControls; qLKBKembali.First; TotalDenda := 0; while not qLKBKembali.EOF do begin TotalDenda := TotalDenda + qLKBKembaliTotalDenda.Value; qLKBKembali.Next; end; Edit1.Text := FormatFloat(',0', qLKBKembali.RecordCount); Edit2.Text := FormatFloat(',0', TotalDenda); finally qLKBKembali.EnableControls; if PrevRecord <> nil then begin qLKBKembali.GoToBookmark(PrevRecord); qLKBKembali.FreeBookmark(PrevRecord); end; end; end; procedure TFLKBKembali.UpdateqLKBKembali;
UpdateqLKBKembali
234
Komponen
Procedure
Code begin qLKBKembali.Close; qLKBKembali.Parameters[0].Value := DateTimePicker1.Date; qLKBKembali.Open; UpdateTotal; end;
24. Pilih FLKBKembali pada Object TreeView, buat event onShow, ketikkan perintah seperti table di bawah ini :
Komponen FLKBKembali Event onShow Code procedure TFLKBKembali.FormShow(Sender: TObject); begin DateTimePicker1.Date := Today; UPdateqLKBKembali; end;
25. Pilih DateTimePicker1 pada Object TreeView, buat event onChange, ketikkan perintah seperti table di bawah ini :
Komponen DateTimePicker1 Event onChange Code procedure TFLKBKembali.DateTimePicker1Change(Sender: TObject); begin BitBtn2.Enabled := False; end
26. Pilih qLKBKembali pada Object TreeView, buat event onCalcFields, ketikkan perintah seperti table di bawah ini :
Komponen qLKBKembali Event onCalcFields Code procedure TFLKBKembali.qLKBKembaliCalcFields(DataSet: TDataSet); var Telat : Integer; begin Telat := Trunc(Today - qLKBKembaliTglHarusKembali.Value); If Telat <= 0 then qLKBKembaliTelat.Value := 0 else qLKBKembaliTelat.Value := Telat; qLKBKembaliTotalDenda.Value := qLKBKembaliTelat.Value * qLKBKembaliHargaDenda.Value; end;
Komponen Datasource1 Event onStateChange Code procedure TFLKBKembali.DataSource1StateChange(Sender: TObject); begin DateTimePicker1.Enabled := FUtama.HakAkses in [2]; BitBtn1.Enabled := FUtama.HakAkses in [1,2]; BitBtn2.Enabled := FUtama.HakAkses in [2]; end;
235
Komponen BitBtn1 Event onClick Code procedure TFLKBKembali.BitBtn1Click(Sender: TObject); begin UpdateqLKBKembali; BitBtn2.Enabled := FUtama.HakAkses in [2]; end;
29. Klik menu File Use Unit, pilih unit UFMember, klik OK untuk melanjutkan. 30. Pilih DBGrid1 pada Object TreeView, buat event onDblClick, ketikkan perintah seperti table di bawah ini :
Komponen DBGrid1 Event onDblClick Code procedure TFLKBKembali.DBGrid1DblClick(Sender: TObject); begin With FMember do Begin MemberID := qLKBKembaliMemberID.Value; ShowModal; End; end;
31. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 32. Klik menu File Use Unit, pilih UFLKBKembali, klik OK untuk melanjutkan. 33. Pilih KoleksiBelumKembali1 pada ObjectTreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen KoleksiBelumKembali1 Event onClick Code procedure TFUtama.KoleksiBelumKembali1Click(Sender: TObject); begin FLKBKembali.ShowModal; end;
236
Latihan 38 : Membuat QuickReport Laporan Koleksi Belum Kembali
QuickReport Laporan Koleksi Belum Kembali merupakan fasilitas cetak laporan yang dimiliki oleh form Laporan Koleksi Belum Kembali. Fasilitas ini hanya bisa diakses oleh karyawan dengan hak akses 2. Langkah-langkah :
1. Pastikan project Rental.dpr telah dibuka. 2. Buat Report baru, klik menu File New Others, pada tab New pilih Reports, klik OK untuk melanjutkan. 3. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 4. Copy dan paste qLKBKembali dari form FLKBKembali ke dalam QuickReport1. 5. Pilih QuickReport1 pada Object TreeView, ubah property seperti table di bawah ini :
Komponen QuickReport1 Property Dataset Name Value qLKBKembali QRLKBKembali
6. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UQRLKBKembali.pas dalam folder Rental. 7. Klik dua kali QRLKBKembali pada Object TreeView untuk membuka jendela Report Settings. Ubah Units dari Inch menjadi MM, klik Apply.
Other Bands
237
Komponen QRLabel2 QRSysData2 Tab QReports QReports Parent TitleBand1 TitklBand1 Property Caption Alignment Autosize Data Caption Caption Caption Alignment AlignToBand Caption Font.Style.fsUnderline Font.Style.fsBold Caption Value Halaman : taRightJustify False qrsPageNumber Nama Rental Alamat Rental Telepon Rental taCenter True LAPORAN PENGEMBALIAN True True Periode :
QRLabel7
QReports
TitleBand1
238
Komponen ColumnHeaderBand1
Property Frame.DrawBottom Frame.DrawTop Height
Value True True 32
Komponen QRLabel8 QRLabel9 QRLabel10 QRLabel11 QRLabel12 QRLabel13 QRLabel14 QRLabel15 QRLabel8, QRLabel13, QRLabel14, QRLabel15 Tab QReports QReports QReports QReports QReports QReports QReports QReports Parent ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 ColumnHeaderBand1 Property Autosize Caption Caption Caption Caption Caption Caption Caption Caption Alignment Value False No. Harus Kembali Tgl Pinjam Judul Koleksi Nama Member Denda/Hr Telat Total Denda taRightJustify
dalam
Komponen QRSysData3, QRExpr1, QRExpr2, QRExpr3 QRSysData3 QRDBText1, QRDBText2, QRDBText3, QRDBText4, QRSysData3, QRExpr1, QRExpr2, QRExpr3 QRDBText1 QRDBText2 QRDBText3 QRDBText4 QRExpr1 QRExpr2 Tab QReports Parent DetailBand1 Property Autosize Value False
QReports QReports
Data Dataset
qrsDetailNo qLKBKembali
QReports
DetailBand1
Alignment
taRightJustify
QReports QReports QReports QReports QReports QReports
DetailBand1 DetailBand1 DetailBand1 DetailBand1 DetailBand1 DetailBand1
DataField DataField DataField DataField Expression Expression
TglHarusKembali TglPinjam Judul Nama FORMATNUMERIC(',0', qLKBKembali.HargaDenda) FORMATNUMERIC(',0',
239
Komponen QRExpr3
Tab QReports
Parent DetailBand1
Property Expression
Value qLKBKembali.Telat) FORMATNUMERIC(',0', qLKBKembali.TotalDenda)
Komponen QRLabel17 QRLabel18 QRSysData4 QRExpr4 Tab QReports QReports QReports QReports Parent SummaryBand1 SummaryBand1 SummaryBand1 SummaryBand1 Property Caption Caption Alignment Data Alignment Autosize Expression Value Tgl Cetak : Grand Total taRightJustify qrsDateTime taRightJustify False FORMATNUMERIC(',0', sum(qLKBKembali.TotalDenda))
Komponen QRLabel19 QRExpr5 Tab QReports QReports Parent PageFooterBand1 PageFooterBand1 Property Caption Alignment Alignment Autosize Expression Value SubTotal taRightJustify taRightJustify False FORMATNUMERIC(',0', sum(qLKBKembali.TotalDenda))
19. Atur layout QRLKBKembali seperti gambar di bawah ini :
240
20. Pilih qLKBKembali pada Object TreeView, buat event onCalcFields, ketikkan perintah seperti table di bawah ini (atau copy event onCalcFields milik qLKBKembali di form FLKBKembali) :
Komponen qLKBKembali Procedure onCalcFields Code procedure TQRLKBKembali.qLKBKembaliCalcFields(DataSet: TDataSet); var Telat : Integer; begin Telat := Trunc(Today - qLKBKembaliTglHarusKembali.Value); If Telat <= 0 then qLKBKembaliTelat.Value := 0 else qLKBKembaliTelat.Value := Telat; qLKBKembaliTotalDenda.Value := qLKBKembaliTelat.Value * qLKBKembaliHargaDenda.Value; end;
21. Kembali ke form FLKBKembali, klik menu View Forms, pilih FLKBKembali, klik OK untuk melanjutkan. 22. Klik menu File Use Unit, pilih UQRLKBKembali, klik OK untuk melanjutkan. 23. Pilih BitBtn2 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen BitBtn2 Procedure onClick Code procedure TFLKBKembali.BitBtn2Click(Sender: TObject); begin With QRLKBKembali do Begin qLKBKembali.Close; qLKBKembali.Parameters[0].Value := DateTimePicker1.Date; qLKBKembali.Open; QRLabel3.Caption := FUtama.NamaRental; QRLabel4.Caption := FUtama.AlamatRental; QRLabel5.Caption := FUtama.TelpRental; QRLabel7.Caption := 'Periode : s/d ' + DatetoStr(DateTimePicker1.Date); Preview; End;
241
Komponen
Procedure
Code end;
242
Latihan 39 : Membuat Form Laporan Pendapatan
Form Laporan Pendapatan merupakan laporan agregat gabungan dari pendapatan sewa dan pendapatan denda. Selain menampilkan data dalam bentuk tabulasi per tanggal transaksi, laporan ini juga menampilkan laporan dalam bentuk grafik. Langkah-langkah :
1. Jalankan aplikasi Microsoft Access 2003. 2. Buka file Rental.mdb yang dibuat pada Latihan 17. 3. Buat table baru, klik dua kali Create Table in Design View, buat field dan atur field properties seperti table di bawah ini, simpan dengan nama Kalendar :
Field Name Tanggal Data Type Date/Time Field Properties Format Value Short Date Ket.
4. 5. 6. 7. 8.
Simpan dan tutup aplikasi Microsoft Access. Kembali ke aplikasi Delphi. Pastikan project Rental.dpr telah dibuka. Buat form baru, klik menu File New Form. Ubah property form yang baru dibuat seperti pada table di bawah ini :
Komponen Form1 Property Caption BorderStyle Name Position Value Laporan Pendapatan bsSizeable FLPendapatan poDesktopCenter
9. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFLPendapatan.pas dalam folder Rental. 10. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 11. Tambahkan 1 buah ADOTable dan 1 buah ADOQuery dari tab ADO ke dalam FLPendapatan, atur property seperti table di bawah ini :
Komponen ADOTable1 Tab ADO Parent FLPendapatan Property Connection Name TableName Connection Name SQL Value FUtama.ADOConnection1 Kalendar Kalendar FUtama.ADOConnection1 qLPendapatan SELECT Kalendar.Tanggal, (Select sum(DPinjam.HargaSewa) From DPinjam, Pinjam Where (DPinjam.PinjamID = Pinjam.PinjamID) And (DateValue(Pinjam.TglPinjam) = DateValue(Kalendar.Tanggal))) AS Sewa, (Select sum(DPinjam.Denda) From DPinjam, Kembali
ADOQuery1
ADO
FLPendapatan
243
Where (DPinjam.KembaliID = Kembali.KembaliID) and (DateValue(Kembali.TglKembali) = DateValue(Kalendar.Tanggal))) AS Denda FROM Kalendar
12. Buat persistent field table Kalendar. 13. Buat persistent field query qLPendapatan, atur property masing-masing field seperti table di bawah ini :
Field Tanggal Sewa, Denda, SubTotal Property DisplayFormat Currency Value dd/mm/yyyy True
14. Tambahkan calculated field SubTotal pada qLPendapatan. Klik kanan pada field editor pilih New Field, lengkapi informasi pada jendela New Field seperti table di bawah ini :
Field SubTotal Section Field Properties Field type Property Name Type Field type Value SubTotal Currency Calculated
15. Tambahkan 1 buah Datasource dari tab Data Access ke dalam FLPendapatan, atur property seperti table di bawah ini :
Komponen Datasource1 Tab Data Access Parent FLPendapatan Property Dataset Value qLPendapatan
16. Tambahkan 3 buah GroupBox dari tab Standard ke dalam FLPendapatan, atur property seperti table di bawah ini :
Komponen GroupBox1 GroupBox2 GroupBox3 Tab Standard Standard Standard Parent FLPendapatan FLPendapatan FLPendapatan Property Align Caption Align Caption Align Caption Value alTop alLeft alBottom
17. Tambahkan 1 buah Splitter dari tab Additional ke dalam FLPendapatan. 18. Tambahkan 1 buah GroupBox dari tab Standard ke dalam FLPendapatan, atur property seperti table di bawah ini :
Komponen GroupBox4 Tab Standard Parent FLPendapatan Property Align Caption Value alClient
244
Komponen Label1 Label2
Tab Standard Standard
Parent GroupBox1 GroupBox1
Value Periode s/d
20. Tambahkan 2 buah DateTimePicker dari tab Win32 ke dalam GroupBox1. 21. Tambahkan 1 buah Bevel dari tab Additional ke dalam GroupBox1, atur property seperti table di bawah ini :
Komponen DBGrid1.Columns[0] DBGrid1.Columns[1] DBGrid1.Columns[2] DBGrid1.Columns[3] DBGrid1.Columns[0], DBGrid1.Columns[1], DBGrid1.Columns[2], DBGrid1.Columns[3] Property Title.Caption Title.Caption Title.Caption Title.Caption Title.Font.Style.fsBold Title.Alignment Value Tanggal Sewa Denda SubTotal True taCenter
Komponen Label3 Label4 Label5 Tab Standard Standard Standard Parent GroupBox3 GroupBox3 GroupBox1 Property Caption Caption Caption Value Pendapatan Sewa Pendapatan Denda Total Pendapatan
245
Komponen Edit1, Edit2, Edit3 Tab Standard Parent GroupBox3 Property ReadOnly Text Value True
27. Tambahkan 1 buah DBChart dari tab Data Control ke dalam GroupBox4, atur property seperti table di bawah ini :
Komponen DBChart1 Tab Data Control Parent GroupBox4 Property Align Value alClient
Tab Chart Subtab Series Settings Add Title Add Title Title Font Size Style Multiple Bar Visible DataSource Dataset Labels X X.DateTime Bar Style Multiple Bar Visible DataSource Dataset Labels X X.DateTime Bar Value Bar Total Sewa Bar Total Denda GRAFIK PENDAPATAN Trebuchet 12 Rectangle Stacked False Dataset qLPendapatan Tanggal Tanggal True Sewa Rectangle Stacked False Dataset qLPendapatan Tanggal Tanggal True Denda
Title
Series
Total Sewa Format Marks Datasource
Total Denda Format Marks Datasource
29. Atur layout form FLPendapatan seperti gambar di bawah ini :
246
30. Tambahkan unit DateUtils pada blok Uses di unit UFLPendapatan. 31. Buat procedure procedure UpdateTotal, procedure UpdateqLPendapatan dan function AwalBulan pada blok Private (lihat gambar), ketikkan perintah seperti table di bawah ini :
Komponen FLPendapatan
Procedure UpdateTotal
Code procedure TFLPendapatan.UpdateTotal; var TotalSewa, TotalDenda : Double; PrevRecord: TBookmark; begin PrevRecord := qLPendapatan.GetBookmark; try qLPendapatan.DisableControls; qLPendapatan.First; TotalSewa := 0; TotalDenda := 0; while not qLPendapatan.EOF do begin TotalSewa := TotalSewa + qLPendapatanSewa.Value; TotalDenda := TotalDenda + qLPendapatanDenda.Value; qLPendapatan.Next; end; Edit1.Text := FormatFloat(',0', TotalSewa); Edit2.Text := FormatFloat(',0', TotalDenda);
247
Komponen
Procedure
UpdateqLPendapatan
AwalBulan
Code Edit3.Text := FormatFloat(',0', TotalSewa + TotalDenda); finally qLPendapatan.EnableControls; if PrevRecord <> nil then begin qLPendapatan.GoToBookmark(PrevRecord); qLPendapatan.FreeBookmark(PrevRecord); end; end; end; procedure TFLPendapatan.UpdateqLPendapatan; var Tgl1, Tgl2 : TDate; begin Kalendar.Open; While not Kalendar.Eof do Kalendar.Delete; Tgl1 := DateTimePicker1.Date; Tgl2 := DateTimePicker2.Date; BitBtn1.Enabled := False; While Tgl1 <= Tgl2 do Begin Kalendar.Insert; KalendarTanggal.Value := Tgl1; Kalendar.Post; Tgl1 := Tgl1 + 1; End; Kalendar.Close; BitBtn1.Enabled := True; qLPendapatan.Close; qLPendapatan.Open; UpdateTotal; end; function TFLPendapatan.AwalBulan(D: TDate): TDate; var Yr, Mn, Dy : Word; begin DecodeDate(D, Yr, Mn, Dy); Result := EncodeDate(Yr, Mn, 1); end;
32. Pilih FLPendapatan pada Object TreeView, buat event onShow, ketikkan perintah seperti table di bawah ini :
Komponen FLKBKembali Event onShow Code procedure TFLPendapatan.FormShow(Sender: TObject); begin DateTimePicker1.Date := AwalBulan(Today); DateTimePicker2.Date := Today; BitBtn2.Enabled := False; end
33. Pilih DateTimePicker1 dan DateTimePicker2 pada Object TreeView, buat event onChange, ketikkan perintah seperti table di bawah ini :
Komponen Event Code
248
Komponen DateTimePicker1, DateTimePicker2
Event onChange
Code procedure TFLPendapatan.DateTimePicker1Change(Sender: TObject); begin BitBtn2.Enabled := False; end;
34. Pilih qLPendapatan pada Object TreeView, buat event onCalcFields, ketikkan perintah seperti table di bawah ini :
Komponen qLPendapatan Event onCalcFields Code procedure TFLPendapatan.qLPendapatanCalcFields(DataSet: TDataSet); begin qLPendapatanSubTotal.Value := qLPendapatanSewa.Value + qLPendapatanDenda.Value; end;
Komponen BitBtn1 Event onClick Code procedure TFLPendapatan.BitBtn1Click(Sender: TObject); begin UpdateqLPendapatan; BitBtn2.Enabled := True; end;
Komponen BitBtn2 Event onClick Code procedure TFLPendapatan.BitBtn2Click(Sender: TObject); begin DBChart1.PrintLandscape; end;
37. Kembali ke form FUtama, klik menu View Forms, pilih FUtama, klik OK untuk melanjutkan. 38. Klik menu File Use Unit, pilih UFLPendapatan, klik OK untuk melanjutkan. 39. Pilih Pendapatan1 pada ObjectTreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen Pendapatan1 Event onClick Code procedure TFUtama.Pendapatan1Click(Sender: TObject); begin FLPendapatan.ShowModal; end;
249
Latihan 40 : Membuat Form About
Form About digunakan untuk menampilkan judul aplikasi, versi dan pembuat aplikasi. Selain itu ditampilkan juga nama, alamat dan no telepon rental pengguna aplikasi. Langkah-langkah :
1. Jalankan aplikasi Delphi, buka project Rental.dpr. 2. Klik menu Project Options, pilih tab Application, atur setting seperti table di bawah ini, klik OK untuk melanjutkan.
Tab Application Version Info Section Application Settings Property Title Icon Include version Information in project Company Name Product Name Value Aplikasi Rental v1.0 App.ico True ROFFA Technologies Aplikasi Rental
3. Buat form baru, klik menu File New Form. 4. Ubah property form yang baru dibuat seperti pada table di bawah ini :
Komponen Form1 Property Caption BorderStyle Name Position Font.Name Value About bsDialog FAbout poDesktopCenter Trebuchet MS
5. Pilih menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFAbout.pas dalam folder Rental. 6. Klik menu File Use Unit, pilih FUtama, klik OK untuk melanjutkan. 7. Tambahkan 1 buah GroupBox dari tab Standard, ubah property seperti table di bawah ini :
Komponen GroupBox1 Tab Standard Parent FAbout Property Align Caption Value alClient
8. Tambahkan 1 buah Image dan 1 buah Bevel dan dari tab Additional ke dalam GroupBox1, ubah property seperti table di bawah ini :
Komponen Image1 Tab Additional Parent GroupBox1 Property Autosize Picture Transparent Shape Value True App.bmp True bsLeftLine
Bevel1
Additional
GroupBox1
250
Komponen Label1 Label2 Label3 Label4 Label5 Label6 Label1, Label4, Label5, Label6
Tab Standard Standard Standard Standard Standard Standard
Parent GroupBox1 GroupBox1 GroupBox1 GroupBox1 GroupBox1 GroupBox1
Property Caption Font.Size Caption Caption Caption Caption Caption Font.Size.fsBold
Value Application Title 12 Created by Company Name Licensed to Nama Rental Alamat Telepon True
Komponen BitBtn1 Tab Additional Parent GroupBox1 Property Caption Glyph Value OK Ok.bmp
11. Atur layout form FAbout seperti gambar di bawah ini :
12. Pilih FAbout pada Object TreeView, buat event onShow, ketikkan perintah seperti table di bawah ini :
Komponen FAbout Event onShow Code procedure TFAbout.FormShow(Sender: TObject); begin Label1.Caption := Application.Title; Label2.Caption := 'Created by ROFFA Technologies'; Label4.Caption := FUtama.NamaRental; Label5.Caption := FUtama.AlamatRental; Label6.Caption := FUtama.TelpRental; end;
Komponen BitBtn1 Event onClick Code procedure TFAbout.BitBtn1Click(Sender: TObject); begin
251
Komponen
Event
Code Close; end;
14. Kembali ke form FUtama, klik View Forms, pilih FUtama, klik OK untuk melanjutkan. 15. Klik menu File Use Unit, pilih unit UFAbout, klik OK untuk melanjutkan. 16. Pilih About1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :
Komponen About1 Event onClick Code procedure TFUtama.About1Click(Sender: TObject); begin FAbout.ShowModal; end;
NEW
Tugas Di Rumah :
1. Sempurnakan Latihan 17 s/d 40. Baca kembali modul dari awal, perhatikan tulisan berwarna merah, pastikan Anda telah melakukan perubahan sesuai dengan modul terbaru. 2. Uji aplikasi, pastikan semua form dan quickreport berfungsi dengan baik. 3. Masukkan data dan transaksi dengan benar, pastikan anda telah memasukkan minimal 10 data member, 15 data koleksi, 5 data pemasok, 2 data karyawan, 40 transaksi pinjam, dan 40 transaksi kembali. 4. Periode Konsultasi mulai 20 Desember 2010 s/d 31 Desember 2010 sesuai jadwal kuliah masing-masing kelas. 5. Aplikasi yang sudah siap, bisa didemokan di hadapan Dosen MataKuliah mulai tanggal 27 Desember 2010 s/d 7 Januari 2011 sesuai jadwal kuliah masing-masing kelas. Segera lakukan demo, supaya Anda masih punya waktu untuk perbaikan dan demo ulang. 6. Perbaikan dan demo ulang bisa dilakukan sampai dengan tanggal 7 Januari 2011.
252
Latihan 41 : Membuat Form Splash
Form Splash adalah form yang akan tampil pertama kali pada saat aplikasi dijalankan. Form ini berisi informasi yang sama seperti form About. Langkah-langkah :
Komponen Form1 Property Caption BorderStyle Name Position Value bsNone FSplash poDesktopCenter
4. Klik menu File Save All untuk menyimpan project. Simpan Unit1 menjadi UFSplash.pas dalam folder Rental. 5. Klik menu File Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan 1 buah Shape dari tab Additional, ubah property seperti table di bawah ini :
Komponen Shape Tab Additional Parent FSplash Property Align Pen.Color Pen.Width Value alClient clRed 2
7. Copy dan Paste Image1, Bevel1, Label1 s/d Label 6 dari form FAbout ke dalam FSplash, ubah property seperti table di bawah ini :
Komponen Label1, Label2, Label3, Label4, Label5, Label6 Property Transparent Value True
8. Tambahkan 1 buah Timer dari tab System ke dalam FSplash. 9. Atur layout form FSplash seperti gambar di bawah ini :
253
10. Tambahkan variabel Awal dengan type TTime pada blok private di unit UFSplash. 11. Pilih FSplash pada Object TreeView, buat event onShow, ketikkan perintah seperti table di bawah ini :
Komponen FSplash Event onShow Code procedure TFSplash.FormShow(Sender: TObject); begin Awal := Now; Label1.Caption := Application.Title; Label2.Caption := 'Created by ROFFA Technologies'; Label4.Caption := FUtama.NamaRental; Label5.Caption := FUtama.AlamatRental; Label6.Caption := FUtama.TelpRental; end;
12. Pilih Timer1 pada Object TreeView, buat event onTimer, ketikkan perintah seperti table di bawah ini :
Komponen Timer1 Event onTimer Code procedure TFSplash.Timer1Timer(Sender: TObject); begin If (Now - Awal) > encodetime(0,0,5,0) then Close; end;
13. Klik menu Project View Source, sebelum perintah Application.Run tambahkan perintah FSplash.Showmodal;, lihat gambar berikut :
254
FREQUENTLY ASK QUESTION (FAQ)
Pertanyaan :
1. Mengapa variabel PinjamID dan KembaliID pada form FLPinjam dan FLKembali tidak dikenali. 2. Mengapa fungsi Today tidak dikenali? 3. Mengapa Form Laporan Koleksi tidak bisa menampilkan data samasekali? 4. Bagaimana cara memeriksa kesalahan penulisan SQL? 5. Pada saat menjalankan perintah SQL terjadi kesalahan Datatype mismatch in criteria expression, apa yang harus diperbaiki? 6. Pada form FPinjam, pada saat melakukan peminjaman terjadi kesalahan dengan pesan DPinjamID cannot be modified, apa yang harus diperbaiki?
Jawaban :
1. Karena variable PinjamID dan KembaliID pada form FPinjam dan FKembali dideklarasikan di blok Private jadi variable tersebut tidak bisa diakses oleh form lain. Solusinya pindahkan variable PinjamID dan KembaliID di form FPinjam dan FKembali ke dalam blok Public. Lihat Latihan 26 point 39 dan Latihan 28 point 38. 2. Fungsi Today ada di dalam unit DateUtils. Solusinya tambahkan klausa DateUtils pada blok Uses di dalam unit/form yang bersangkutan. Lihat Latihan 26 point 38. 3. Pastikan field Judul, Pemeran Utama, Kategori dan JenisKoleksi pada form Koleksi sudah diisi dengan benar. 4. Cara paling mudah untuk memeriksa kesalahan penulisan SQL adalah dengan memanfaatkan Query pada Microsoft Access. Jalankan aplikasi Microsoft Access, buka file Rental.mdb, pilih object Queries, klik dua kali Creat Query in Design View, klik Close untuk menutup jendela Show Table, klik menu View SQL View, copy dan paste perintah SQL dari Delphi ke dalam jendela Query1, klik menu Query Run untuk menjalankan dan memeriksa kesalahan perintah SQL. 5. Saat membuat atau memperbaiki perintah SQL pada suatu ADOQuery, Delphi secara otomatis mereset datatype pada property parameters, cek lagi datatype pada property parameter. 6. Penyebab dari kasus ini biasanya akibat dari kesalahan pada saat membuat hubungan master detail, coba cek kembali property MasterFields pada komponen DPinjam, pastikan field yang dihubungkan PinjamID (lihat Latihan 26 point 18). adalah PinjamID
-+= SELESAI =+-+= Sampai Ketemu di Semester 4 =+-
255

Modul Pemrograman Visual 1 2011

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Modul Pemrograman Visual 1 2011

Diunggah oleh

Hak Cipta:

Format Tersedia

MODUL KULIAH PEMROGRAMAN VISUAL 1

Disusun Oleh : RONNY FASLAH, S.KOM

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Latihan Latihan Latihan Latihan Latihan Latihan

FREQUENTLY ASK QUESTION (FAQ)........................................... 255

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

ATURAN PENGERJAAN LATIHAN

Pemrograman Visual 1 Ronny Faslah - 2010

Berikut adalah bagian-bagian dalam IDE Delphi :

3. Tab Komponen / Component Pallette

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

PROPERTY DAN EVENT

Komponen Label1 GroupBox1 Label2 Edit1 Label1, Label2

Tab Standard Standard Standard Standard

Parent Form1 Form1 GroupBox1 GroupBox1

Property Font.Color Font.Style.fsBold Caption Caption Text Font.Style.fsItalic

Value clBlack True Departemen Bagian True

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

b. Memilih melalui Object TreeView.

c. Memilih melalui Object Inspector.

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

4. Sedapat mungkin pilih nilai property dari pilihan yang tersedia.

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Hue Sat Lum

Pemrograman Visual 1 Ronny Faslah - 2010

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

VARIABEL, PROCEDURE DAN FUNCTION

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Membuat Procedure atau Function

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Tekan tombol Ctrl+Shift+C procedure/function.

Ketikkan perintah/statement diantara blok Begin..End.

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Latihan 1 : Hello World!

Edit1 Edit2 Button1

Standard Standard Standard

FLatihan1 FLatihan1 FLatihan1

5. Atur layout Form1 seperti gambar di bawah ini :

7. Ketikkan perintah berikut pada blok procedure yang baru dibuat.

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Membuat aplikasi kalkulator sederhana untuk operasi pembagian.

Label1 Label2 Label3 Edit1

Standard Standard Standard Standard

Form1 Form1 Form1 Form1

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Edit2 Edit3 Button1

Standard Standard Standard

Form1 Form1 Form1

Text Text Caption

6. Buat event OnClick pada Button1 :

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Latihan 3 : Kalkulator Lagi!

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Latihan 5 : Curriculum Vitae

Pemrograman Visual 1 Ronny Faslah - 2010 06/09/2011 21:51:34

Komponen DateTimePicker1 Label4 RadioButton1 RadioButton2 Label5 Combobox1

Tab Win32 Standard Standard Standard Standard Standard

Parent Form1 Form1 Form1 Form1 Form1 Form1