[Tugas] Algoritma Pemrograman: Aplikasi Penjualan Tiket Metro Mini di Masa Depan dengan Java Netbeans

Hallo pemirsa, ketemu lagi bareng Virgiawan Listanto alias Mas kodok di edisi ngumpul tugas malem minggu. Karena waktu pengumpulan tugas sudah mepet makanya langsung saja kita simak bagaimana proses pembuatan aplikasinya. Kali ini saya akan membuat Aplikasi Penjualan Tiket Metro Mini di Masa Depan dengan Java di Netbeans. Oke cekidot!

Ilustrasinya:
Jadi, saya disuruh untuk membuatkan Aplikasi Penjualan Tiket Metro Mini ini oleh Bapak Gubernur Jokowi dengan kriteria Form sebagai berikut:

Nama:
Kode Mobil: -- 57 -- 604 -- dan 75
Tujuan: - sesuai dengan kode mobil -

Kriteria:
Jika 57 maka hasilnya akan muncul = Blok M -> Kampung Rambutan
Jika 604 maka hasilnya akan muncul = Manggarai -> Pasar Minggu
Jika 75 maka hasilnya akan muncul = Blok M -> Pasar Minggu

Jenis Penumpang: -- Anak-Anak -- dan Dewasa

Tarif Penumpang:
- Anak-anak = Rp.2500
- Dewasa = Rp.7500

Jumlah Beli Tiket: 
Total Harga:

Nah, karena Bapak Gubernur ingin programnya berjalan disetiap POS-POS Penjualan Tiket busway secara Komputerisasi, maka saya akan membuatkannya menggunakan Bahasa Pemrograman Java dengan IDE Netbeans.

NB: Ini hanya ilustrasi dan fiktif belaka =)) Program yang saya buat juga sangat sederhana :) jadi anda bisa lebih menyempurnakannya lagi. ini juga belum ada validasinya.

Langkah Pertama - Download and Install
1. Download Netbeans 6.91 (ini netbeans yang saya gunakan)
2. Download Java versi Terbaru
3. Install keduanya setelah di download.

Langkah Kedua - Setting Netbeans
1. Buka Netbeans anda, kemudian pilih File -> New Project

2. Setelah itu pilih Java -> Java Desktop Application

3. Setelah itu akan muncul dialog baru Name and Location.
lalu isikan Aplikasi Penjualan Tiket di Project Name

4. Kalau sudah, maka akan muncul seperti screenshoot dibawah ini:

5. Selanjutnya kita akan membuat Form baru di project Aplikasi Penjualan Tiket.
Klik kanan pada source aplikasipenjualantiket -> pilih New -> JFrame Form

6. Maka akan muncul dialog baru lagi. kemudian isikan formAplikasi pada class Name text Field

7. Jika sudah, sekarang kita setting dulu <default config> untuk menjalankan form nya. ikuti langkah seperti gambar dibawah ini:

8. Pada kotak input Main Class. Browse terlebih dahulu.

9. Kemudian pilih Main Class aplikasipenjualantiket.formAplikasi untuk menjalankan formnya nanti. setelah itu klik Select Main Class

10. Kita kembali kedialog sebelumnya. Lakukan penekanan tombol OK. untuk mengakhiri.

11. Sekarang kita akan melakukan konfigurasi untuk navigasi Inspector.
Klik Window -> pilih Navigating -> Klik Inspector

12. Maka akan muncul navigator baru di pojok bawah tampilan netbeans anda yang bernama Inspector.

13. Untuk memudahkan anda dalam membuat aplikasi, kita setting terlebih dahulu window propertiesnya. Klik Window -> Kemudian Pilih Properties. atau Ikuti langkah dibawah ini:

14. Dan akhirnya akan muncul sebuah JFrame Properties baru di pojok kanan Netbeans IDE anda.

Langkah ke Tiga - Membuat GUI Aplikasi (Graphical User Interfaces)
Sekarang kita akan membuat GUI Aplikasinya, ikuti dan simak terus artikel ini. jangan kemana-mana yak :))

1. Klik Pallete yang ada di pojok kanan Netbeans anda. Kemudian expand Swing Controls -> Klik Icon Label -> Lalu tarik ke Form Aplikasi

2. Klik kanan pada JLabel1 -> kemudian pilih Edit Text

3. Ganti namanya menjadi : Aplikasi Penjualan Tiket Metro Mini di Masa Depan. 
4. Langkah selanjutnya sama seperti langkah ke 2. cuma ditambahkan Text Field untuk input data. lebih lengkapnya ikuti screen shoot dibawah ini. (intinya mah tarik-tarik aja)

5. Klik kanan pada jTextField1 -> kemudian pilih Edit Text -> lalu Kosongkan isinya
6. Klik kanan pada jTextField1 -> kemudian pilih Change Variable Name

7. Setelah itu akan muncul dialog Rename. isikan textNama pada New Name

8. Jika sudah, maka kita buat lagi Input-input selanjutnya. Kali ini kita buat COMBOBOX. ikuti langkah pada screen shoot dibawah ini: (tarik maaaang)

9. Klik kanan pada Combobox Kode Mobil, kemudian pilih Change Variable Name

10. Lalu akan muncul dialog Rename. isikan comboKode pada kotak New Name. lalu klik OK

11. Sekarang kita pindah ke JFrame Properties (yang ada di pojok kanan). klik kiri ComboBox Kode, selanjutnya isikan 57, 604, 75 pada input Model. ya lebih lengkapnya seperti screen shoot dibawah ini. karna ribet njelasinnya =))

12. Lanjut! Buat input TextField baru. lalu klik kanan -> pilih Change Variable Name. (sebelumnya kosongkan dulu textnya di Edit Text) isikan textTujuan pada kotak Rename

13. Kemudian kita buat Radio Button baru. dengan spesifikasi: Anak-anak dan Dewasa untuk Jenis Penumpangnya.

14. Klik kanan pada Radio Button Anak-Anak -> kemudian pilih Change Variable Name isikan radioAnak untuk nama Variabelnya.

15. Lakukan Hal yang sama dengan nomor 14 untuk Radio Button Dewasa. isikan radioDewasa untuk nama Variabelnya. (jenis penumpang)

16. Jika sudah, sekarang kita akan membuat RADIO BUTTON GROUP. ini berfungsi untuk mengorganisasikan radio button. agar memiliki groupnya sendiri. ikuti langkah pada screen shoot dibawah ini.

17. Sekarang kita beralih ke INSPECTOR (dipojok kiri bawah) dibagian Other Components -> Klik kanan pada buttonGroup1 -> kemudian pilih Change Variable Name

18. isikan radioGroup untuk Nama Variabelnya

19. Lanjut, kita beralih ke JFrame Properties. klik kanan pada Radio Button Anak-Anak, lalu pindah ke tab code, isikan radioButton.add(radioAnak); pada Post-Creation Code. (ini berfungsi untuk meng-groupkan radio button yang kita buat sebelumnya)

20. Lakukan hal yang sama dengan NOMOR 19. namun yang kita bedakan adalah Post-Creation Codenya. isikan radioGroup.add(radioDewasa); seperti gambar dibawah ini:

21. Kemudian kita buat TextField baru, untuk Tarif Penumpang berdasarkan Jenis Penumpangnya. Jika sudah, klik kanan pada TextField tersebut, kemudian pilih Change Variable Name, lalu isikan textTarif (ya, lebih lengkap seperti gambar dibawah ini pemirsah)

22. Buat TextField baru lagi untuk Total Pembelian Tiketnya. jika sudah, klik kanan pada text Field kemudian pilih Change Variable Name -> lalu isikan textTotal

23. Selanjutnya, kita buat TOMBOL BUTTON. Untuk menjumlahkan keseluruhan pembelian tiket.

24. Huft, lumayan panjang pemirsah =)) sekarang klik kanan pada Button Jumlahkan, kemudian pilih Change Variable Name -> lalu isikan buttonJumlah

25. Kemudian buatlah Label untuk Cetak Tiket Pembeliannya, seperti gambar dibawah ini:

26. Klik kanan pada label Nama: kemudian ubah nama variabelnya (change variable name) isikan hasilNama

27. Nah sekarang kita sembunyikan Labelnya dengan mengkosongkan Textnya. supaya hanya muncul pada saat di Klik Tombol Jumlahkan. ya lebih lengkapnya ikuti instruksi berikut:

28. Lakukan hal yang sama dengan sebelumnya. untuk Kriteria LABEL Kode Mobil dan kawan-kawan ikuti spesifikasi dibawah ini:

1. Label Kode Mobil -> Change Variable Name -> hasilKode
2. Label Tujuan -> Change Variable Name -> hasilTujuan
3. Label Penumpang -> Change Variable Name -> hasilPenumpang
4. Label Tarif -> Change Variable Name -> hasilTarif
5. Label Jumlah Beli -> Change Variable Name -> hasilJumlahBeli
6. Label Total -> Change Variable Name -> hasilTotal

Langkah ke Empat - Coding and Events
Oke, karna GUI nya sudah jadi, sekarang kita akan membuat Events Actionnya.

1. Klik kanan pada COMBO BOX Kode Mobil -> pilih Events -> pilih Action -> klik actionPerformed

2. Kemudian isikan Code berikut ini. yang berfungsi untuk mengkondisikan hasil pemilihan jenis penumpang

3. Klik kanan pada RADIO BUTTON ANAK-ANAK -> pilih Events -> Action -> actionPerformed

4. Selanjutnya isikan CODE Berikut ini pemirsah.

5. Klik kanan pada RADIO BUTTON DEWASA -> pilih Events -> Action -> actionPerformed

6. Lalu isikan Code berikut ini seperti langkah-langkah sebelumnya.

7. Nah sekarang kita tinggal membuat aksi pada TOMBOL JUMLAHKAN. lakukan langkah berikut ini: klik kanan pada tombol jumlahkan -> pilih events -> pilih action -> actionPerformed

8. Untuk Finishing, Isikan CODE Berikut ini ya :D

Langkah ke Lima - Running Program
Oke, sekarang kita sudah sampai ke langkah-langkah terakhir. Ikuti instruksi berikut ini untuk menyelesaikan semua tragedi Tugas di malam minggu ini =))

1. Untuk menjalankan program, tekan tombol icon Panah Warna Hijau di atas

2. Dan taraaaaaaa! Hasilnya akan terlihat seperti ini. Sekarang program aplikasi penjualan tiket metromini dimasa depan siap disajikan, dan dikumpulkan :D yeyeyeye :D

Penutup
Ya demikianlah perjumpaan kita kali ini. kurang lebihnya saya mohon maaf. jika ada yang ingin bertanya-tanya bagaimana penjelasan lengkapnya. atau yang masih kurang lengkap dan greget silahkan mention twitter saya di @maskodokwi mudah-mudahan saya bisa menjawab semua pertanyaan-pertanyaan yang nyangkut dikepala anda :)

Hidup itu harus berbagi, Ikatlah ilmu dengan menuliskannya! GANBATTE!