Membuat GUI dengan Java

Pada bagian ini kita akan berkenalan dengan membuat GUI menggunakan Java. IDE yang akan digunakan dalam pembelajaran kita adalah Netbeans. Dalam modul ini, yang dipakai adalah Netbeans versi 13. Anda bisa download Netbeans di situs resminya.

Membuat Project Baru

1. Klik menu: File - New Project…. Pilih Categories: Java with Ant dan Projects: Java Application, kemudian klik Next.

   

   Catatan: Jika ini adalah pertama kalinya Anda membuat project di Netbeans, biasanya setelah next ada proses Activating IDE yang memakan waktu beberapa menit. Silahkan tunggu sampai proses selesai.

2. Berikutnya Anda bisa menentukan Project Name dan Project Location.

   

   Aturan penulisan Project Name sesuai dengan aturan penamaan variabel, yaitu tidak mengandung spasi, tidak diawali angka, tidak menggunakan karakter spesial. Klik Finish untuk menyimpan project yang baru ini.

Basic Interface

Membuat JFrame/Form

Mari kita membuat form (dalam Java disebut JFrame) pertama kita. Caranya, klik kanan pada nama package (dalam Source Packages), pilih New - JFrame Form….

Pada window New JFrame Form Anda bisa menentukan nama form. Untuk contoh ini, kita akan memberi nama FormUtama.

Menambahkan Komponen/Objek/Class

Pada panel sebelah kanan, Anda bisa menemukan Swing Containers dan Swing Controls. Ini adalah komponen/class yang bisa Anda tambahkan kepada form Anda. Cara menambahkan komponen ke dalam form dilakukan dengan drag and drop ke form Anda. Tambahkah 3 komponen: jLabel, jTextField, dan jButton, sehingga menjadi contoh di bawah ini.

Hal penting lain yang perlu dilakukan setelah menambahkan komponen adalah memberi nama variabel kepada komponen. Lakukan ini kepada komponen yang akan berinteraksi dengan kode program kita. Pada contoh diatas, komponen: jTextField1 dan jButton. Memberi nama variabel dilakukan dengan klik kanan pada komponen kemudian Change Variable Name….

Lakukan Change Variable Name… pada masing-masing objek pada form:

• jLabel1 ➡ pesan
• jTextField1 ➡ namaUser
• jButton1 ➡ tombolPesan

Walaupun nama variabel sudah berubah, tapi tulisan pada tampilan form belum berubah. Kita akan merubah tulisan tersebut pada bagian selanjutnya.

Merubah Properti/Atribut

Setiap komponen/objek yang kita buat memiliki atribut/properti. Ini kita bisa lihat pada panel Properties di sebelah kanan. Atribut ini bisa menentukan rupa-rupa sifat dari objek, misalnya: jenis tulisan, ukuran objek, warna tulisan, warna background, posisi, dll. Untuk merubah atribut, yang perlu kita lakukan adalah klik pada objek, kemudian cari properties yang kita mau rubah.

Contoh pada form diatas, klik pada tombol dan di panel Properties akan menampilkan semua atributnya. Cari atribut text kemudian rubah jadi “Salam”.

Lakukan perubahan berikut:

• pesan.text (jLabel1) ➡ Pesan
• namaUser.text (jTextField1) ➡ kosong
• tombolPesan.text (jButton1) ➡ Salam

Jika Anda melakukannya dengan benar maka form akan berubah menjadi seperti berikut:

Menambahkan Kode Program

Misalnya pada contoh form di atas, kita mau mau membuat program, dimana ketika program dijalankan, maka user bisa input nama pada TextField (misalnya: Budi), kemudian ketika user klik tombol “Salam” maka label akan memunculkan tulisan “Halo, Budi”. Untuk ini kita perlu menambahkan kode program pada tombolPesan, caranya double klik tombolPesan. Source editor akan muncul.

tambahkan kode program berikut pada fungsi tombolPesanActionPerformed

        pesan.setText("Hallo, "+namaUser.getText());

Berikutnya, tambahkan program untuk menampilkan form, pada program utama.

Menjalankan Program

Untuk penjalankan program yang kita buat di atas, klik tombol “play” pada toolbar atau tekan F6

Catatan:

• Jika Anda mendapati TextField/Button/Label terpotong, coba edit form, rubah ukuran komponen TextField/Button/Label tersebut, kemudian coba jalankan kembali programnya.

Latihan