4/8/2010
TEKNIK ELEKTRONIKA FT UNP PADANG
VISUAL JAVA PROGRAMMING
Java Education Network Indonesia
Basic Visual Java Component | Muhammad Adri, S.Pd, MT
TEKNIK ELEKTRONIKA FT UNP PADANG MODUL PRAKTIKUM PEMROGRAMAN JAVA Jl. Prof. Dr. Hamka Kampus Pusat UNP Padang, http://teknikelektronika.net, Elearning http://elearning.teknikelektronika.net
MODUL 3. VISUAL LIST OPTION COMPONENT Topik Pembina
: Basic Component Lanjutan : Muhammad Adri, S.Pd, MT
Waktu SKS
: 180 Menit : 2 SKS (Praktikum)
A. Tujuan : Setelah melaksanakan kegiatan Praktikum ini diharapkan mahasiswa dapat : 1. Memahami konsep pemrograman visual dalam Java 2. Menggunakan objek komponen dasar lanjutan dalam pemrograman visual Java 3. Membangun aplikasi sederhana berbasis pemrograman visual Java B. Teori Singkat Pada Modul 1 dan 2 telah dibahas 6 komponen dasar dalam pemrograman visual Java yaitu Jframe, Jlabel dan Jbutton, sebagai pengenalan konsep dasar pemrograman visual. Pada modul ini kita akan mencoba untuk membuat aplikasi pemrograman visual dengan beberapa tambahan komponen visual yang dapat digunakan sebagai komponen untuk menginputkan data, berupa data pilihan yang digunakan untuk membangun opsi/ pilihan kepada usernya. Dalam kegiatan praktikum ini, mahasiswa akan membangun aplikasi sederhana dengan objek-objek visual java sebagai berikut : 1. JComboBox, berupa dropdown menu yang digunakan untuk membuat suatu sistem pilihan yang terdiri dari multioption, namun hanya ada satu pilihan yang dapat diambil (one option choosen). Terdapat dua metoda/ event yang bisa digunakan pada combobox ini : a. Method jComboBox.getSelectedIndex() Metoda ini digunakan untuk mengambil suatu nilai string yang terdapat pada opsi pilihan yang disusun berdasarkan index yang dimulai dari indeks 0. Contoh : Terdapat pilihan Program pada suatu form isian dengan menggunakan sebuah ComboBox, yaitu : D3 Teknik Elektronika, S1 Pend. Teknik Elektronika dan S1 Pend. Teknik Informatika, maka dapat digunakan : pilihan = jComboBox1.getSelectedIndex() switch (pilihan) case 0 : prog = "D3. Teknik Elektronik”;break; case 1 : prog = "S1. Pend.Teknik Elektronika"; break; case 2 : prog = "S1. Pend.Teknik Informatika";
Created by : Muhammad Adri, S.Pd, MT
1
TEKNIK ELEKTRONIKA FT UNP PADANG MODUL PRAKTIKUM PEMROGRAMAN JAVA Jl. Prof. Dr. Hamka Kampus Pusat UNP Padang, http://teknikelektronika.net, Elearning http://elearning.teknikelektronika.net
b. Method jComboBox.getSelectedItem() Metoda ini digunakan untuk mengambil suatu nilai string yang terdapat pada opsi pilihan yang proses pengambilannya disesuaikan dengan item yang dipilih. Contoh : Terdapat pilihan Daerah Asal mahasiswa, yang berisi pilihan kab/ kota di Sumatera Barat, yaitu : Padang,Solok, Bukittinggi, Payakumbuh, Padang Panjang, Pariaman, Sawahlunto, Painan, Agam, Pasaman, Pasaman Barat, dll. Penyelesaian : if (jComboBox1.getSelectedItem == "Solok"){ asal = "Solok";} else if (jComboBox.getSelectedItem == "Padang"){ asal = "Padang"; 2. JList, adalah komponen pilihan yang mempunyai fungsi yang hamper sama dengan JComboBox, tapi dalam bentuk tampilan list lengkap dari opsi pilihan yang tersedia. Terdapat dua metoda/ event yang bisa digunakan pada listbox ini : a. Method jList.getSelectedIndex() Metoda ini digunakan untuk mengambil suatu nilai string yang terdapat pada opsi pilihan yang disusun berdasarkan index yang dimulai dari indeks 0. b. Method jList.getSelectedValue() Metoda ini digunakan untuk mengambil suatu nilai string yang terdapat pada opsi pilihan yang proses pengambilan nya disesuaikan dengan item yang diplih C. Kegiatan Praktikum 1. Komponen Visual Lanjutan Pada kegiatan praktikum awal ini, kita akan mendisain sebuah antarmuka yang digunakan untuk menampung biodata mahasiswa, antara lain : a. Nama mahasiswa b. NIM dan Tahun Masuk c. Jenis Kelamin d. Agama e. Alamat f. Daerah Asal Dengan langkah sebagai berikut : a. Buatlah sebuah interface seperti terlihat pada Gambar 1.
Created by : Muhammad Adri, S.Pd, MT
2
TEKNIK ELEKTRONIKA FT UNP PADANG MODUL PRAKTIKUM PEMROGRAMAN JAVA Jl. Prof. Dr. Hamka Kampus Pusat UNP Padang, http://teknikelektronika.net, Elearning http://elearning.teknikelektronika.net
Gambar 1. Rancangan interface Data Mahasiswa b. Pada Latihan sebelumnya, semua komponen visual telah kita atur properties visual masing-masing, khususnya properties komponen input. Maka pada kesempatan ini kita menggunakan methoda pengaturan melalui event yang diberikan pada Form pada saat form diaktifkan. c. Klik kanan pada Form, pilih Events Window Window Activated, kemudian ketikkan listing program berikut, setelah private void formWindowActivated(java.awt.event.WindowEvent evt) : jTextField1.setText(""); jTextField2.setText(""); jTextField3.setText(""); jTextField4.setText(""); jTextField5.setText(""); jButton1.setText("Proses"); jButton2.setText("Reset");
d. Kemudian deklarasikan variabel-variabel berikut, sebagai variabel global yang digunakan sebagai variabel penampung data input yang dimasukkan oleh user, setelah deklarasi method public class : public class Biodata extends javax.swing.JFrame { String namaMhs,nim,tm,jk,agama,alamat,asal;
e. Setelah itu deklarasikan value masiing-masing variabel, sebagai berikut : namaMhs = jTextField1.getText(); nim = jTextField2.getText(); tm =jTextField3.getText(); alamat = jTextField4.getText(); asal = jTextField5.getText(); // statemen if untuk kondisi Jenis Kelamin if (jRadioButton1.isSelected()) {jk = jRadioButton1.getText();} else if(jRadioButton2.isSelected()) {jk = jRadioButton2.getText();}
Created by : Muhammad Adri, S.Pd, MT
3
TEKNIK ELEKTRONIKA FT UNP PADANG MODUL PRAKTIKUM PEMROGRAMAN JAVA Jl. Prof. Dr. Hamka Kampus Pusat UNP Padang, http://teknikelektronika.net, Elearning http://elearning.teknikelektronika.net
// statemen if untuk pilihan agama if (jCheckBox1.isSelected()) {agama = jCheckBox1.getText();} else if (jCheckBox2.isSelected()) {agama = jCheckBox2.getText();} else if (jCheckBox3.isSelected()) {agama = jCheckBox3.getText();} else if (jCheckBox4.isSelected()) {agama = jCheckBox4.getText();} else if (jCheckBox5.isSelected()) {agama = jCheckBox5.getText();}
f. Selanjutnya, kita lanjutkan dengan memberikan event terhadap jButton1 (tombol Proses) untuk memperoleh keluaran yang akan ditampung di sebuah TextArea. g. Klik kanan pada jButton1, kemudian pilih eventsmouseonMouseClicked jTextArea1.setText("Nama Mahasiswa\t: "+namaMhs+"\nNim\t: "+nim+"\nTahun Masuk\t: "+tm+"\nJenis kelamin\t: "+jk+"\nAgama\t: "+agama+"\nAlamat\t: "+alamat+"\nDaerah Asal\t: "+asal);
h. Selanjutnya, silahkan anda seting untuk jButton2 (tombol reset), untuk mereset kembali semua data yang telah dientrikan, dengan menambahkan events mouseonMouseClicked jTextField1.setText(""); jTextField2.setText(""); jTextField3.setText(""); jTextField4.setText(""); jTextField5.setText(""); jTextArea1.setText("");
i.
Silahkan jalankan program anda, dan lihat hasilnya.
2. JComboBox Combo Box, adalah salah satu jenis komponen pilihan yang umum digunakan di dalam suatu aplikasi Visual, dengan tujuan untuk memberikan kemudahan kepada pengguna aplikasi dalam menentukan satu pilihan dari beberapa pilihan yang tersedia. Contoh Latihan : Misalkan anda akan memasukkan data yang berkaitan dengan daerah asal seorang mahasiswa, yang pilihannya ditampilkan dalam bentuk pilihan ComboBox, seperti terlihat pada Gambar 2 berikut : a. Buatlah sebuah Form baru dan beri nama dengan LatihanDasarComboBox b. Tambahkan sebuah Label dengan teks : Asal c. Lengkapi dengan sebuah Combo Box d. Tambahkan sebuah jButton, dengan teks Proses e. Jadikan sebuah TextArea sebagai penampung data Output f. Sehingga pada saat ini tampilan Form anda terlihat seperti pada Gambar 2.
Created by : Muhammad Adri, S.Pd, MT
4
TEKNIK ELEKTRONIKA FT UNP PADANG MODUL PRAKTIKUM PEMROGRAMAN JAVA Jl. Prof. Dr. Hamka Kampus Pusat UNP Padang, http://teknikelektronika.net, Elearning http://elearning.teknikelektronika.net
Gambar 2. Latihan Dasar Combo Box g. Untuk menambahkan opsi pilihan ComboBox, Klik kanan pada objek ComboBox, pilih Properties, sehingga jendela propeties dari ComboBox muncul. h. Klik poperties Model, dan isikan data 19 Kab/ Kota yang ada di Sumbar
i.
Gambar 3. Properties Model ComboBox yang telah dilengkapi Untuk menambahkan data pilihan, susunlah seperti terlihat pada Gambar 4.
Created by : Muhammad Adri, S.Pd, MT
5
TEKNIK ELEKTRONIKA FT UNP PADANG MODUL PRAKTIKUM PEMROGRAMAN JAVA Jl. Prof. Dr. Hamka Kampus Pusat UNP Padang, http://teknikelektronika.net, Elearning http://elearning.teknikelektronika.net
j.
Gambar 4. Memasukkan Pilihan pada Model Combo Box Kemudian silahkan pindah ke jendela Source, kemudian deklarasikan variabel asal sebagai variabel global class, setelah deklarasi public class public class BiodataCB extends javax.swing.JFrame { String asal;
k. Kemudian beri events pada JButton1, dengan cara klik kanan pda JButton1 Events Mouse mouseClicked Pada saat ini, kita mencoba salah satau metoda pengambilan data yang dapat digunakan di ComboBox, yaitu getSelectedItem(). Kemudia ketikkan kode berikut ini : private void jButton1MouseClicked(java.awt.event. MouseEvent evt) { // Definisikan daerah asal if (jComboBox1.getSelectedItem()== "Solok"){asal = "Solok";} else if (jComboBox1.getSelectedItem()== "Padang"){asal = "Padang";} else if (jComboBox1.getSelectedItem()== "Padang Panjang"){asal = "Padang Panjang";} else if (jComboBox1.getSelectedItem()== "Payakumbuh"){asal = "Payakumbuh";} else if (jComboBox1.getSelectedItem()== "Bukittinggi"){asal = "Bukittinggi";} else if (jComboBox1.getSelectedItem()== "Batu Sangkar"){asal = "Batu Sangkar";} ……… lengkapi dengan data kab/kota lainnya //Output jTextArea1.setText("Daerah Asal : "+asal); }
l.
Jalankan aplikasi anda, dan lihat hasilnya.
Tugas Latihan dasar: Dengan langkah yang sama, ganti method yang digunakan dari GetSelectedItem() menjadi GetSelectedIndex() Created by : Muhammad Adri, S.Pd, MT
6
TEKNIK ELEKTRONIKA FT UNP PADANG MODUL PRAKTIKUM PEMROGRAMAN JAVA Jl. Prof. Dr. Hamka Kampus Pusat UNP Padang, http://teknikelektronika.net, Elearning http://elearning.teknikelektronika.net
3. JList Dengan menggunakan form seperti pada Combo Box, gunakan method yang sama dengan latihan di atas, dengan menggunakan komponen JList. D. Tugas dan Latihan 1. Dengan menggunakan tampilan aplikasi seperti yang terlihat pada Latihan Praktikum Komponen Visual Lanjutan, lengkapilan Form Biodata mahasiswa tersebut dengan tambahan opsi dengan menggunakan ComboBox untuk : a. Program Studi (D3 Teknik Elektronika, S1 Pend. Teknik Elektronika, S1 Pend. Teknik Informatika b. Daerah Asal (masukkan pilihan 19 kab/ kota yang ada di Sumbar)
Biografi Singkat Penulis Muhammad Adri. Menyelesaikan S1 di Jurusan Teknik Elektronika FPTK IKIP Padang tahun 1999, dan S2 di Jurusan Teknik Elektro Universitas Gadjah Mada Yogyakarta, dengan konsentrasi Sistem Komputer dan Informatika (SKI) tahun 2004. Staf pengajar Teknik Elektronika Fakultas Teknik Universitas Negeri Padang. Kompetensi inti pada bidang Computer Networking and Security, Computer Architecture and Organization, Web-Based Application, Online Learning, Multimedia-Based Instructional Design, dan Knowledge Community. Penulis aktif, sebagai pemakalah dalam berbagai Seminar Nasional, instruktur pada model pembelajaran berbasis Multimedia dan Komputer., IT-Based Education. Penulis Aktif di Situs IlmuKomputer.com, dengan topik ICT dalam Pendidikan. Memegang Sertifikasi Microsoft, JENI (Java Education Network Indonesia) 1,2,dan 4. Ketertarikan penulis dalam bidang implementasi IT dalam dunia pendidikan, menghantarkan penulis sebagai mahasiswa doktoral Ilmu Pendidikan Pascasarjana Universitas Negeri Padang, terhitung mulai September 2006.
Created by : Muhammad Adri, S.Pd, MT
7