PRAKTIKUM PBO – SWING – MODUL 5
Pemograman Swing Topics:
Cara Menggunakan Netbeans Java Application Java Desktop Application Materi Tambahan
Netbeans: Pada pertemuan kali ini, kita akan membahas lebih jauh mengenai swing. Swing adalah sebuah library yang digunakan untuk “menggambar” objek-objek yang sifatnya grafis. Swing adalah pengembangan dari library yang sudah ada sebelumnya, yaitu AWT (Abstract Windowing Toolkit). Paket Swing sendiri bukan merupakan paket utama dari Java, sehingga untuk menggunakan paket Swing, harus mengimport paket javax.swing.*.
Cara Menggunakan Netbeans Penulis menggunakan netbeans versi 6.8. Namun tidak menutup kemungkinan praktikan bisa menggunakan netbeans versi di atasnya. Di bawah ini merupakan tampilan splash screen saat menjalankan netbeans.
Setelah masuk ke netbeans, silakan bikin project baru. Caranya adalah dengan masuk ke bagian menu bar (berada di bagian pojok kiri atas) [File] -> [New Project]. Untuk lebih jelasnya bisa lihat gambar di bawah ini.
© Tim Asisten PBO – UKDW 2010 [1]
PRAKTIKUM PBO – SWING – MODUL 5
Java Application Pilih Categories:java dan Projects: Java Application. Kemudian tekan tombol [next>].
Gantilah Project Name menjadi Latihan1 seperti tampak di bawah ini.
Lokasi untuk menyimpan Project
* Kalian bebas untuk menyimpan file project di mana saja. Sebaiknya simpan di direktori lain (bukan directori default yang diberikan oleh netbeans) dan beri nama folder sesuai dengan nim kalian agar project tersebut dapat dipakai lagi untuk belajar. Lalu tekan Finish. © Tim Asisten PBO – UKDW 2010 [2]
PRAKTIKUM PBO – SWING – MODUL 5
Tampilan Project di Netbeans
Icon Build
Icon Build and Clean
Run
blok main
Output
Tempat kita menulis program
Gambar di atas menunjukkan beberapa tampilan pada netbeans yang sering digunakan. Untuk lebih jelasnya silakan tambahkan code di bawah ini kedalam blok main.
Build dan Run Program. Kalian telah berhasil membuat sebuah project di Netbeans ^^ Hasil dari menjalankan program di netbeans dapat di lihat di bagian Output. Contoh program di atas merupakan contoh program Java Application yang dibuat melalui netbeans, sebenarnya Java Application ini telah kita pelajari di pertemuan sebelumnya Cuma bedanya kemarin kita menggunakan Editplus sebagai Text Editor.
Java Desktop Application Java Desktop Application atau bisa juga disebut sebagai pemograman berbasis GUI merupakan pemograman yang menggunakan library Swing ataupun AWT. Pada pemograman berbasis GUI, kita bisa membuat suatu aplikasi yang berbasis pada form yang sering kita jumpai saat menjalankan suatu aplikasi, software dan lainnya. Untuk lebih jelas mengenai pemograman berbasis GUI di java, silakan ikuti langkah di bawah ini. Langkah membuat aplikasi berbasis GUI menggunakan Netbeans. 1. Buat Project Baru (cara pembuatan project baru dapat di lihat di atas). [File] -> [New Project] 2. Pilih Categories: Java dan Projects: Java Desktop Application. Kemudian tekan tombol [next>]. © Tim Asisten PBO – UKDW 2010 [3]
PRAKTIKUM PBO – SWING – MODUL 5
3. Ubahlah Project Name menjadi JavaGUI, Project Location: (bebas) atau tidak perlu diubah (direktori default dari Netbeans). Seperti gambar di bawah ini.
Kemudian klik Finish. Apabila semua langkah telah dijalankan, maka kalian telah berhasil membuat suatu aplikasi yang berbasis GUI menggunakan Netbeans ^^. Coba Compile dan Jalankan aplikasi sederhana di atas. Gambar di bawah ini merupakan tampilan secara keseluruhan Java Desktop Application pada Netbeans.
Palette
Source and Design
Properties Form
Navigator
© Tim Asisten PBO – UKDW 2010 [4]
PRAKTIKUM PBO – SWING – MODUL 5
Tutorial 1 :: Mengenal komponen-komponen Swing pada Java Pada tutorial 1 ini kita akan membuat suatu aplikasi sederhana pada Netbeans yang berbasis GUI dengan menggunakan beberapa komponen yang disediakan dalam library Swing. Untuk lebih jelasnya silakan ikuti langkah-langkah di bawah ini. 1. Tambahkan beberapa komponen swing ke dalam form dengan cara di-drag ke dalam form. Komponen-komponen swing pada java terletak di bagian palette (lihat gambar di atas) Komponen: 1. Label (4 buah) 2. Text Field (1 buah) 3. Check Box (3 buah) 4. Radio Button (2 buah) 5. List (1 buah) 6. Button (1 buah) Untuk lebih jelasnya lihat gambar di bawah ini:
2. Ubalah property text dan name dari masing-masing komponen form menjadi: Komponen CheckBox1 CheckBox2 CheckBox3 Button 1 TextBox1 RadioButton1 RadioButton2 ListBox1
Name cbHob1 cbHob2 cbHob3 btnSubmit txtNama rdLaki rdPerempuan lstJurusan
Text Makan Shopping Tidur Submit! (kosong) Laki-Laki Perempuan (tidak diubah)
© Tim Asisten PBO – UKDW 2010 [5]
PRAKTIKUM PBO – SWING – MODUL 5
Setelah itu, tekan tombol “…” pada properti Model milik lstJurusan, akan muncul sebuah jendela dan isilah dengan:
Ubahlah juga semua property text pada masing-masing Label sehingga menjadi seperti gambar di bawah ini.
3. Nah, setelah kita mendesain tampilannya, kita akan masuk ke bagian coding. Klik kanan pada btnSubmit kemudian pilih [Events]-> [Action] -> [actionPerformed] maka kita akan masuk ke code editor.
© Tim Asisten PBO – UKDW 2010 [6]
PRAKTIKUM PBO – SWING – MODUL 5
Tambahkan code di bawah ini.
Gambar di bawah untuk meng-import JOptionPane secara otomatis.
Klik icon lampu dan pilih “Add import for javax.swing.JOptionPane”
Pada tahap ini kita telah berhasil membuat suatu aplikasi sederhana bersasis GUI. Untuk melihat hasilnya, klik Build dan Run. Coba klik radio button Laki-laki dan Perempuan. Lihat apa yang terjadi! Keanehan apa yang bisa kalian temukan? Untuk mengatasi keanehan tersebut, mari kita kembali membuka design pada form dan menambahkan satu komponen baru ke dalam form yaitu “Button Group”. Masuk ke property buttonGroup milik rdLaki dan rdPerempuan kemudian pilih buttonGroup1. Build dan Run kembali aplikasi Anda kemudian klik radio button Laki-laki dan Perempuan.
© Tim Asisten PBO – UKDW 2010 [7]
PRAKTIKUM PBO – SWING – MODUL 5
Tutorial 2 :: Pemanggilan Form lain Pada tutorial ini, kita akan memanggil form lain dari suatu form induk. Ikuti langkah-langkah di bawah ini: 1. Buatlah sebuah Project Baru dan pilih Java Desktop Application 2. Gantilah Nama Project menjadi ManggilForm 3. Tambahkan sebuah Button pada form ManggilForm. Ubah property text Button tersebut menjadi Panggil Form. 4. Tambahkan 1 form lagi sebagai form yang akan dipanggil. Caranya: Klik kanan pada package manggilform kemudian milih [new] -> [JFrame Form] seperti tampak pada gambar di bawah ini.
Ubahlah Class Name menjadi FormAnak. Kemudian tekan finish. Pembentukan form anak telah selesai. 5. Tambahakan sebuah Label. Ubah property text Label tersebut dengan “Saya adalah Form Anak”.
6. Tambahkan code di bawah ini pada Button yang telah kita buat tadi di form ManggilForm.
© Tim Asisten PBO – UKDW 2010 [8]
PRAKTIKUM PBO – SWING – MODUL 5
7. Build dan Run aplikasi tersebut. Coba Tekan tombol Panggil Form. * Coba jalankan kembali aplikasi tersebut dan panggil form anak kemudian tutup form anak, apa yang terjadi? Iya, form induk juga ikut ketutup saat form anak ditutup. Mengapa demikian? Coba ganti property defaultCloseOperation pada form anak menjadi “Dispose”. Build dan jalankan kembali aplikasi tersebut kemudian panggil form anak dan tutup jendela form anak.
Tutorial 2 :: Penggunaan MenuBar pada Netbeans Ikuti langkah-langkah di bawah ini: 1. Buatlah sebuah Project Baru dan pilih Java Application 2. Gantilah Nama Project menjadi CobaMenuBar. Jangan lupa untuk meng-uncheck bagian Create Main Class karena kita akan membuat Main Class kita sendiri 3. Tambahkan sebuah JFrameForm baru pada package Sources Package 4. Gantilah Class Name menjadi MenuBar. Kemudian tekan finish. 5. Tambahkan sebuah Menu Bar dengan cara meng-drag Menu Bar ke dalam form. Menu Bar terletak di dalam pallete dan berada dalam kategori Swing Menus
6. Tambahkan Menu Item ke dalam Menu Bar sebanyak 2 buah. Ganti property text masing-masing Menu Item menjadi Exit dan About.
7. Tambahkan code pada Menu Item Exit (menggunakan Event actionPerformed).
8. Tambahkan code pada Menu Item About (menggunakan Event actionPerformed).
© Tim Asisten PBO – UKDW 2010 [9]
PRAKTIKUM PBO – SWING – MODUL 5
9. Build dan Run Aplikasi tersebut. Klik menu File dan pilih About. Klik menu File dan pilih Exit. Beberapa contoh aplikasi di atas merupakan contoh sederhana dalam menggunakan Netbeans berbabis GUI. Untuk melatih dan mengembangkan skill dalam membuat aplikasi yang berbabis GUI, silakan untuk mencoba komponen lain yang telah disediakan oleh Netbeans. Misalnya Combo Box dan Tabbed Pane.
© Tim Asisten PBO – UKDW 2010 [10]
PRAKTIKUM PBO – SWING – MODUL 5
Latihan!! 1. Buatlah sebuah kalkulator sederhana dengan Java Desktop Application.
2. Buatlah sebuah Aplikasi yang bisa mengkonversi suatu temperatur dengan Java Desktop Application.
© Tim Asisten PBO – UKDW 2010 [11]
PRAKTIKUM PBO – SWING – MODUL 5
Materi Tambahan: Graphics2D Java telah menyediakan beberapa class untuk menggambar beberapa objek grafik yang sifatnya 2D, misalnya bujur sangkar, elipse, dan segitiga. Untuk menggunakan objek ini, Anda harus mengimport paket java.awt.* dan java.awt.geom.*;
Buatlah sebuah JFrame Form baru dan beri nama BermainGrafik. Tambahkan beberapa method di dalamnya seperti berikut: Untuk mengambar menggunakan grafik, kita harus menggoverride method paint
Untuk mencoba program di atas, silakan panggil method yang telah kita buat. Panggil method tersebut dari method paint.
Method yang telah kita buat
© Tim Asisten PBO – UKDW 2010 [12]
PRAKTIKUM PBO – SWING – MODUL 5
Latihan Mandiri Graphics!!! 1. Buatlah sebuah papan catur yang digambar menggunakan grafik. Keluaran yang diharapan seperti pada gambar di bawah ini.
© Tim Asisten PBO – UKDW 2010 [13]
