Tutorial: Membuat GUI Java Application with SWING Pandu Aji Wirawan Selasa, 29 November 2011 3 Comments

GUI, merupakan kata yang cukup asing bagi sebagian orang, padahal hampir setiap orang menggunakannya. GUI adalah Graphic User Interface, atau yang lebih enak dikenal sebagai tampilan aplikasi. Awalnya sebuah aplikasi tidaklah memiliki GUI / Interface, namun Steve Jobs berhasil meluncurkan komputer dengan GUI, hingga saat ini 90% lebih komputer pribadi di dunia menggunakan GUI, entah itu dalam bentuk Linux, Mac, Windows maupun yang lain.

Materi kuliah visual programming saat ini sedang memasuki tahap pembuatan GUI sederhana dengan memanfaatkan SWING yang ada pada Eclipse. Disini saya akan menjelaskan bagaimana menggunakan SWING untuk membuat sebuah template. Tutorial ini akan tetap berlanjut, jadi terus pantau ya.

Seperti kata Pak Hasbi, pertama-tama kita belajar hal yang menyenangkan terlebih dahulu, sehingga memiliki ketertarikan untuk mencoba lebih dalam. Tidak menyerah di awal belajar. Seperti kata pepatah bahwa memulai itu susah, apalagi mempertahankan. Untuk mencapai fase mempertahankan kita harus memulai, karena tanpa memulai apa yang harus dipertahankan??

Pertama, download Eclipse Indigo di http://www.eclipse.org/downloads/. Saya sarankan untuk mendownload yang Eclipse IDE for Java Developers sebesar 127MB (Portable Linux Version). Saya sarankan untuk download versi tersebut karena saya menggunakan versi tersebut, dan jangan download versi classic, karena banyak fitur eclipse yang tidak ada di dalamnya. Saya pernah mendowload  versi tersebut dan saya tidak menemukan Fitur SWING serta Marketplace.

Kedua, buka eclipse dan buatlah sebuah workspace trus buat sebuah project yang kemudian dilanjutkan dengan Create New Visual Classes. Ubah tampilannya menjadi design.

Ketiga, cermati jendela-jendela yang ada pada lembar kerja seperti Structure, yang merupakan outline dari apa yang ada pada lembar kerja termasuk Properties di dalamnya. Atau Palette yang terdiri dari banyak fitur yang dapat ditambahkan pada lembar kerja seperti JLabel untuk menambahkan tulisan pada GUI, atau JButton untuk menambahkan tombol pada GUI. Silakan coba, jangan takut untuk salah, sekarang saatnya menunjukkan desain aplikasi yang sudah dibuat.

Keempat, setelah menambahkan apa yang ada di palette, kita dapat melakukan seleksi dan akan muncul properties dari objek tersebut. Sehingga kita bisa custom sendiri. Untuk JButton, JLabel dan sebagainya, kita hanya dapat mengganti textnya satu kali ketika baru saja kita letakkan pada lembar kerja, setelah itu jika ingin mengganti textnya harus melalui jendela properties > text.

bentuk calculator
Setelah membuat tampilan sedemikian rupa, kita belum dapat melakukan operasi matematika sebagaimaa mestinya, karena kita hanya membuat tampilan kalkulator dan belum mmeberikan perintah tersendiri pada masing-masing tombol, oleh karena itu saya akan segera tulis tutorial membuat kalkulator tersebut jalan sesuai dengan tombolnya.
Pandu Aji Wirawan

Pemuda yang masih lajang, suka jalan-jalan dan nulis blog. Hidup tidak teratur, mengalir seperti air. Kalau ada yang minta tolong, kadang bikin website yang simpel dan enggak ribet.

3 komentar :

  1. Ade Malsasa Akbar12 November 2012 08.38

    Mas, mas tahu kan aplikasi Windows yang diinstal kita klik nex nex nex itu?


    Saya nggak bisa bikin yang seperti itu. Bisanya kalau klik next, mbuka Jframe baru. Buka lagi baru. Buka lagi baru. Jelek banget. Bagaimana biar hanya membuka dalam satu Jframe yang sama (gak banyak jframe)?


    Dan bagaimana kalau saya mau bikin image slider kayak Ubiquity?

    BalasHapus
  2. saya kurang tahu masalah itu de, soalnya nggak pernah otak-atik sampai segitu.

    BalasHapus
  3. coba buka gambar atas, dibagian atas workspace swing ada tulisan metal itu diganti GTK klo nggak salah.

    BalasHapus

Silakan berkomentar dengan baik, jangan menggunakan nama sebagai keyword backlink. Saya anggap itu sebagai SPAM. Apabila dalam komentar mengandung link yang tidak berhubungan dengan tulisan, akan saya hapus