Tutorial Kotak Centang Java Swing Menggunakan NetBeans

Tutorial Kotak Centang Java Swing Menggunakan NetBeans

Dalam tutorial ini, Anda akan belajar menggunakan kotak centang Java Swing menggunakan NetBeans IDE. Aplikasi Java ini akan menampilkan beberapa makanan beserta harganya. Pengguna diminta untuk memilih item makanan yang akan dibeli. Saat memilih makanan, jumlah tagihan untuk makanan yang dipilih akan ditampilkan seperti yang ditunjukkan pada gambar di bawah ini:

Gambar 1

Saya menggunakan NetBeans IDE untuk membuat aplikasi Java. Untuk membuat aplikasi ini, ikuti langkah-langkah yang diberikan di bawah ini:

  • Luncurkan NetBeans, pilih File-> opsi Proyek Baru.
  • Kotak dialog Pilih Proyek akan terbuka. Karena kita ingin membuat aplikasi desktop Java, pilih opsi “Java” dari panel Kategori dan opsi “Aplikasi Java” dari panel Proyek. Pilih tombol Next untuk melangkah lebih jauh. Kotak dialog berikutnya akan menanyakan nama aplikasi Java dan lokasi pada drive tempat kita ingin membuat aplikasi. Mari kita tetapkan nama, “checkBoxDemoApp” untuk aplikasi java ini dan biarkan lokasi menjadi lokasi default seperti yang ditunjukkan pada gambar di bawah ini.

Gambar 2

  • Klik tombol Finish untuk membuat aplikasi. NetBeans IDE akan secara otomatis membuat file kelas Java untuk Anda dengan nama, CheckBoxDemoApp.java dengan beberapa kode default. Akan muncul jendela Projects seperti di bawah ini:

Gambar 3

Untuk membuat GUI (Graphical User Interface), kita akan menggunakan toolkit Java Swing. Untuk bekerja dengan toolkit Java Swing, Anda perlu menambahkan formulir JFrame ke aplikasi. Oleh karena itu, klik kanan paket, centang kotakdemoapp di node Source Packages di jendela Projects dan pilih opsi New->JFrame Form dari menu konteks yang muncul. Anda akan diminta untuk menentukan nama kelas untuk formulir JFrame baru. Mari kita masukkan FastFood sebagai nama kelas. Menjaga sisa kotak teks di kotak dialog ke nilai defaultnya, klik tombol Selesai untuk membuat formulir JFrame.

Gambar 4

File kelas Java, file FastFood.java akan ditambahkan ke proyek dengan beberapa kode default. Jendela Proyek sekarang akan muncul seperti yang ditunjukkan di bawah ini:

Gambar 5

Juga, formulir JFrame kosong akan dibuat dan dibuka di jendela Editor dengan bilah alat yang berisi beberapa tombol. Kami akan bekerja terutama dengan dua tombol toolbar berikut:

  • Desain – Tombol ini akan memungkinkan kita untuk bekerja dengan komponen GUI. Kita dapat menyeret komponen GUI dari jendela Palette dan meletakkannya di formulir
  • Sumber – Tombol ini akan menampilkan kode sumber kelas. Kami dapat menulis kode Java untuk komponen apa pun, mengedit, kode debug, dll. Dalam mode ini

Dalam aplikasi ini, kita akan membutuhkan dua komponen Label dan tiga komponen Kotak Centang. Tiga komponen Kotak Centang akan menampilkan tiga item makanan beserta harganya. Dari dua komponen Label, satu akan digunakan untuk menampilkan judul dan komponen Label kedua akan digunakan untuk menampilkan jumlah tagihan dari bahan makanan yang dipilih.

Pilih formulir JFrame yaitu file FastFood.java dari jendela Proyek diikuti dengan memilih tombol toolbar Desain dari tab Editor. Berada dalam mode Desain, seret komponen Label dari kategori Kontrol Ayun di jendela Palette dan letakkan di formulir JFrame. Ulangi prosedur untuk komponen Label kedua. Demikian pula seret komponen Kotak Centang dari kategori Kontrol Ayun dan jatuhkan pada formulir JFrame. Ulangi prosedur untuk dua Kotak Centang lagi karena kami ingin tiga komponen Kotak Centang dalam aplikasi ini. Untuk meningkatkan visibilitas komponen GUI ini, kita perlu meningkatkan ukuran fontnya. Jadi, pilih semua lima komponen yaitu Ctrl+klik setiap komponen pada formulir JFrame dan pilih properti font dari jendela Properties. Pilih font dan ukuran yang diinginkan seperti yang ditunjukkan pada gambar di bawah ini:

Gambar 6

Setelah memperbesar ukuran font, posisikan kelima komponen tersebut hingga muncul seperti pada gambar di bawah ini:

Gambar 7

Langkah selanjutnya adalah mengubah teks komponen tersebut. Anda dapat mengubah teks komponen apa pun dengan salah satu dari dua cara berikut:

  • Klik kanan komponen pada formulir JFrame dan pilih opsi Edit Teks dari menu konteks yang muncul. Anda dapat menimpa teks komponen diikuti dengan menekan tombol Enter
  • Klik komponen pada formulir JFrame dan pilih properti teks dari jendela Properties. Ketik materi yang diinginkan di properti teks komponen.

Dengan menggunakan salah satu metode di atas, mari kita ubah properti teks dari komponen seperti yang diberikan di bawah ini:

  • Atur teks komponen Label pertama ke “Select Food Items”.
  • Setel teks Kotak Centang pertama menjadi “Burger $5”
  • Setel teks Kotak Centang kedua menjadi “Hot Dog $7”
  • Setel teks Kotak Centang ketiga menjadi “Pizza $10”
  • Hapus properti teks dari komponen Label kedua karena properti teksnya akan disetel melalui kode Java. Melalui komponen Label inilah kami akan menampilkan jumlah total tagihan dari item makanan yang dipilih.

Setelah mengatur properti teks dari semua lima komponen, formulir JFrame akan muncul seperti yang ditunjukkan di bawah ini:

Angka 8

Setiap komponen Java Swing yang telah kita jatuhkan pada formulir JFrame diberi nama variabel default seperti jLabel1, jLabel2, jCheckBox1, jCheckBox2 dan seterusnya. Kita perlu menetapkan nama variabel yang berarti untuk komponen ini. Untuk menetapkan nama variabel ke komponen apa pun, cukup klik kanan padanya dan pilih opsi Ubah Nama Variabel dari menu konteks yang terbuka. Mari kita atur nama variabel Kotak Centang pertama menjadi jCheckBoxBurger, nama variabel Kotak Centang kedua menjadi jCheckBoxHotDog dan kotak Centang ketiga menjadi jCheckBoxPizza. Juga, atur nama variabel komponen Label kedua ke jLabelResponse.

Kami ingin setiap kali salah satu kotak centang dicentang atau tidak dicentang, jumlah tagihan dari kotak centang yang dipilih ditampilkan.

Menulis Kode

Saat ini, kita berada dalam mode Desain dan untuk menulis kode, kita perlu beralih ke mode Sumber. Untuk beralih ke mode Sumber, Anda dapat mengklik tombol toolbar Sumber dari jendela Editor atau cukup klik dua kali pada komponen Java Swing mana pun dalam formulir JFrame. Saat mengklik dua kali komponen tersebut, Anda akan dibawa ke mode Sumber untuk menulis kode untuk komponen tersebut. Kami akan mulai menulis kode untuk komponen jCheckBoxBurger. Jadi, klik dua kali jCheckBoxBurger dan Anda akan dibawa ke mode Sumber. Tulis kode berikut:

int jumlah tagihan=0;

private void jCheckBoxBurgerActionPerformed(java.awt.event.ActionEvent evt) {

if (jCheckBoxBurger.isSelected()) {

jumlah tagihan=jumlah tagihan+5;

} lain {

jumlah tagihan=jumlah tagihan-5;

}

jLabelResponse.setText(“Jumlah Tagihan adalah $”+String.valueOf(BillAmount));

}

Deskripsi kode di atas

Anda mendefinisikan variabel integer global yang disebut billAmount dan menginisialisasinya ke 0. Metode jCheckBoxBurgerActionPerformed akan dipanggil setiap kali beberapa tindakan dilakukan pada jCheckBoxBurger yaitu setiap kali dicentang atau tidak dicentang. Dalam metode jCheckBoxBurgerActionPerformed, kita menentukan apakah checkbox dicentang atau tidak. Jika kotak centang dicentang, nilai integer 5 ditambahkan ke variabel billAmount. Jika kotak centang tidak dicentang, nilai 5 dikurangi dari variabel billAmount.

Setelah menulis kode untuk jCheckBoxBurger, kita perlu menulis kode untuk jCheckBoxHotDog. Jadi, dari mode Kode, kita akan kembali ke mode Desain dengan mengklik tombol toolbar Desain dari jendela Editor. Dari mode Desain, klik dua kali pada jCheckBoxHotDog dan tulis kode berikut dalam metode jCheckBoxHotDogActionPerformed yang secara otomatis dibuat dalam mode Kode:

private void jCheckBoxHotDogActionPerformed(java.awt.event.ActionEvent evt) {

if (jCheckBoxHotDog.isSelected()) {

jumlah tagihan=jumlah tagihan+7;

} lain {

jumlah tagihan=jumlah tagihan-7;

}

jLabelResponse.setText(“Jumlah Tagihan adalah $”+String.valueOf(BillAmount));

}

Sekali lagi, kembali ke mode Desain dengan mengklik tombol toolbar Desain. Klik dua kali pada jCheckBoxPizza dan tulis kode berikut dalam mode Kode:

private void jCheckBoxPizzaActionPerformed(java.awt.event.ActionEvent evt) {

if (jCheckBoxPizza.isSelected()) {

jumlah tagihan=jumlah tagihan+10;

} lain {

billAmount=jumlah tagihan-10;

}

jLabelResponse.setText(“Jumlah Tagihan adalah $”+ String.valueOf(BillAmount));

}

Setelah menulis kode untuk ketiga kotak centang, proyek kami siap dijalankan. Anda dapat menjalankan proyek dengan memilih salah satu dari tiga opsi berikut:

  • Memilih tombol bilah alat Jalankan Proyek dari bilah alat di bagian atas
  • Tekan tombol F6
  • Pilih Jalankan-> Jalankan opsi Proyek dari bilah menu

Jika Anda menjalankan proyek sekarang, Anda tidak akan mendapatkan output apa pun karena kelas utama proyek saat ini adalah CheckBoxDemoApp.java dan kami belum menulis kode apa pun di file java ini. Jadi, pertama-tama kita perlu mengubah file kelas utama. Jadi, klik kanan proyek checkBoxDemoApp di jendela Proyek dan pilih opsi Properties dari menu konteks yang muncul. Dari dialog Properti, pilih kategori Jalankan dari panel Kategori. Di kotak teks Kelas Utama, Anda akan menemukan teks, checkboxdemoapp.CheckBoxDemoApp yang menegaskan bahwa pada menjalankan proyek, file CheckBoxDemoApp.java akan dieksekusi terlebih dahulu. Ubah konten di kotak teks Kelas Utama menjadi kotak centangdemoapp.FastFood untuk menunjukkan bahwa Anda ingin file FastFood.java dijalankan terlebih dahulu setiap kali proyek dijalankan seperti yang ditunjukkan pada gambar di bawah

Gambar 9

Sekarang Anda siap untuk menjalankan proyek. Saat menjalankan proyek, Anda akan mendapatkan tiga item makanan berikut dalam bentuk kotak centang untuk dipilih. Pilih sejumlah makanan dan Anda mendapatkan jumlah tagihannya:

Gambar 10

Anda dapat mengunduh proyek lengkap dari tautan

 

Pemrograman