Coding Antarmuka Pengguna Grafis Java Sederhana

Antarmuka pengguna grafis (GUI) yang dibangun menggunakan Platform Java NetBeans terdiri dari beberapa lapis wadah. Lapisan pertama adalah jendela yang digunakan untuk memindahkan aplikasi di sekitar layar komputer Anda. Ini dikenal sebagai wadah tingkat atas, dan tugasnya adalah memberi semua wadah lain dan komponen grafis tempat untuk bekerja. Biasanya untuk aplikasi desktop, wadah tingkat atas ini akan dibuat menggunakan

kelas.

Anda dapat menambahkan jumlah lapisan apa pun ke desain GUI Anda, tergantung pada kerumitannya. Anda dapat menempatkan komponen grafis (mis., Kotak teks, label, tombol) langsung ke dalam

, atau Anda dapat mengelompokkannya dalam wadah lain.

Lapisan GUI dikenal sebagai hierarki penahanan dan dapat dianggap sebagai pohon keluarga. Jika

adalah kakek duduk di atas, maka wadah berikutnya dapat dianggap sebagai ayah dan komponen yang dipegangnya sebagai anak-anak.

Untuk contoh ini, kita akan membangun GUI dengan a

mengandung dua

dan a

. Pertama

akan memegang

dan

. Kedua

akan memegang

dan a

. Hanya satu

(dan karenanya komponen grafis yang dikandungnya) akan terlihat pada satu waktu. Tombol akan digunakan untuk mengalihkan visibilitas keduanya

.

Ada dua cara untuk membangun GUI ini menggunakan NetBeans. Yang pertama adalah mengetik secara manual kode Java yang mewakili GUI, yang dibahas dalam artikel ini. Yang kedua adalah menggunakan alat Builder NetBeans GUI untuk membangun GUI Swing.

Untuk informasi tentang menggunakan JavaFX daripada Swing untuk membuat GUI, lihat Apa itu JavaFX??

Catatan: Kode lengkap untuk proyek ini di Contoh Kode Java untuk Membangun Aplikasi GUI Sederhana.

Buat yang baru Jawa Proyek aplikasi di NetBeans dengan kelas utama. Kami akan memanggil proyek

Titik Periksa: Di jendela Proyek NetBeans haruslah folder GuiApp1 tingkat atas (jika namanya tidak dicetak tebal, klik kanan folder tersebut dan pilih

). Di bawah

folder harus berupa folder Paket Sumber dengan

disebut GuiApp1. Folder ini berisi kelas utama yang disebut

.Jawa.

Sebelum kita menambahkan kode Java apa pun, tambahkan impor berikut ke bagian atas

kelas, antara

garis dan

:

Impor ini berarti bahwa semua kelas yang kita butuhkan untuk membuat aplikasi GUI ini akan tersedia untuk kita gunakan.

Dalam metode utama, tambahkan baris kode ini:

Ini berarti bahwa hal pertama yang harus dilakukan adalah membuat yang baru

obyek. Ini adalah jalan pintas yang bagus untuk program contoh, karena kita hanya perlu satu kelas. Agar ini berfungsi, kita memerlukan konstruktor untuk

kelas, jadi tambahkan metode baru:

Dalam metode ini, kita akan meletakkan semua kode Java yang diperlukan untuk membuat GUI, yang berarti bahwa setiap baris mulai sekarang akan berada di dalam

metode.

Catatan desain: Anda mungkin telah melihat kode Java diterbitkan yang menunjukkan kelas (mis.,

) diperpanjang dari a

. Kelas ini kemudian digunakan sebagai jendela GUI utama untuk suatu aplikasi. Sebenarnya tidak perlu melakukan ini untuk aplikasi GUI normal. Satu-satunya waktu Anda ingin memperpanjang

kelas adalah jika Anda perlu membuat jenis yang lebih spesifik

(melihat

untuk informasi lebih lanjut tentang cara membuat subclass).

Seperti disebutkan sebelumnya, lapisan pertama GUI adalah jendela aplikasi yang terbuat dari

. Untuk membuat

objek, panggil

konstruktor:

Selanjutnya, kami akan mengatur perilaku jendela aplikasi GUI kami, menggunakan empat langkah ini:

1. Pastikan aplikasi ditutup ketika pengguna menutup jendela sehingga tidak terus berjalan di latar belakang:

2. Tetapkan judul untuk jendela sehingga jendela tidak memiliki bilah judul kosong. Tambahkan baris ini:

3. Atur ukuran jendela, sehingga ukuran jendela sesuai dengan komponen grafis yang Anda tempatkan di dalamnya.

Catatan desain: Opsi alternatif untuk mengatur ukuran jendela adalah dengan memanggil

metode

kelas. Metode ini menghitung ukuran jendela berdasarkan komponen grafis yang dikandungnya. Karena aplikasi contoh ini tidak perlu mengubah ukuran jendelanya, kami hanya akan menggunakan

metode.

4. Tengahkan jendela untuk muncul di tengah layar komputer sehingga tidak muncul di sudut kiri atas layar:

Dua baris di sini buat nilai-nilai Untuk

dan

objek yang akan kita buat segera, menggunakan dua

array. Ini membuatnya lebih mudah untuk mengisi beberapa entri contoh untuk komponen-komponen tersebut:

Sekarang, mari kita buat yang pertama

obyek. Ini akan berisi a

dan a

. Ketiganya dibuat melalui metode konstruktor mereka:

Catatan pada tiga baris di atas:

• Itu

  JPanel

  variabel dideklarasikan terakhir. Ini berarti bahwa variabel hanya dapat menampung

  JPanel

  yang dibuat di baris ini. Hasilnya adalah kita bisa menggunakan variabel di kelas dalam. Ini akan menjadi jelas mengapa kita ingin nanti dalam kode.
• Itu

  JLabel

  dan

  JComboBox

  memiliki nilai yang diteruskan ke mereka untuk mengatur properti grafis mereka. Label akan muncul sebagai "Buah:" dan kotak kombo sekarang akan memiliki nilai yang terkandung di dalamnya

  fruitOptions

  array dideklarasikan sebelumnya.
• Itu

  Menambahkan()

  metode

  JPanel

  menempatkan komponen grafis ke dalamnya. SEBUAH

  JPanel

  menggunakan FlowLayout sebagai standarnya manajer tata letak. Ini bagus untuk aplikasi ini karena kami ingin label duduk di sebelah kotak kombo. Selama kita menambahkan

  JLabel

  pertama, itu akan terlihat baik-baik saja:

Kedua

mengikuti pola yang sama. Kami akan menambahkan

dan a

dan atur nilai komponen-komponen itu menjadi "Sayuran:" dan yang kedua

Himpunan

. Satu-satunya perbedaan lainnya adalah penggunaan

metode untuk menyembunyikan

. Jangan lupa akan ada

mengendalikan visibilitas keduanya

. Agar ini bekerja, seseorang harus tidak terlihat pada awalnya. Tambahkan baris ini untuk mengatur yang kedua

:

Satu baris yang perlu diperhatikan dalam kode di atas adalah penggunaan

metode

. Itu

nilai membuat daftar menampilkan item yang dikandungnya dalam dua kolom. Ini disebut "gaya koran" dan merupakan cara yang bagus untuk menampilkan daftar item daripada kolom vertikal yang lebih tradisional.

Komponen terakhir yang dibutuhkan adalah

untuk mengontrol visibilitas

s. Nilai yang diteruskan dalam

constructor menetapkan label tombol:

Ini adalah satu-satunya komponen yang akan menentukan pendengar acara. "Peristiwa" terjadi ketika pengguna berinteraksi dengan komponen grafis. Misalnya, jika pengguna mengklik tombol atau menulis teks ke dalam kotak teks, maka suatu peristiwa terjadi.

Seorang pendengar acara memberi tahu aplikasi apa yang harus dilakukan ketika acara itu terjadi.

menggunakan kelas ActionListener untuk "mendengarkan" untuk klik tombol oleh pengguna.

Karena aplikasi ini melakukan tugas sederhana ketika tombol diklik, kita dapat menggunakan kelas dalam anonim untuk menentukan pendengar acara:

Ini mungkin terlihat seperti kode menakutkan, tetapi Anda hanya perlu memecahnya untuk melihat apa yang terjadi:

• Pertama, kami menyebutnya

  addActionListener

  metode

  JButton

  . Metode ini mengharapkan turunan dari

  Daftar Tindakan

  kelas, yang merupakan kelas yang mendengarkan acara.
• Selanjutnya, kita buat instance dari

  Daftar Tindakan

  kelas dengan mendeklarasikan objek baru menggunakan

  ActionListener baru ()

  dan kemudian memberikan kelas dalam anonim - yang merupakan semua kode di dalam kurung keriting.
• Di dalam kelas batin anonim, tambahkan metode yang disebut

  actionPerformed ()

  . Ini adalah metode yang dipanggil ketika tombol diklik. Semua yang diperlukan dalam metode ini adalah menggunakan

  setVisible ()

  untuk mengubah visibilitas

  JPanel

  s.

Akhirnya, kita perlu menambahkan keduanya

dan

ke

. Secara default, a

menggunakan manajer tata letak BorderLayout. Ini berarti ada lima area (melintasi tiga baris) dari

yang dapat berisi komponen grafis (UTARA, {BARAT, PUSAT, TIMUR}, SELATAN). Tentukan area ini menggunakan

metode:

Akhirnya, semua kode di atas akan sia-sia jika kita tidak mengaturnya

agar terlihat:

Sekarang kita siap untuk menjalankan proyek NetBeans untuk menampilkan jendela aplikasi. Mengklik tombol akan beralih antara menampilkan kotak kombo atau daftar.