TUGAS MINGGU 11-ALPRO 1-SI UNIPDU

 

Graphical user interface (GUI)


1. Pengertian GUI

    Graphical user interface (GUI) adalah sistem komponen visual interaktif untuk software komputer. GUI menampilkan objek yang bisa menyampaikan informasi dan merepresentasikan aksi dari pengguna. Dengan adanya GUI, kita bisa mengetahui bahwa apa yang kita input telah diterima dan responsnya ditunjukkan secara visual.

    

2. AWT dan Swing

    AWT adalah singkatan dari Abstract Window Toolkit. Ini adalah API untuk mengembangkan aplikasi berbasis GUI atau Windows di Java. Ini membutuhkan objek OS asli untuk mengimplementasikan fungsionalitas. Juga, komponen AWT adalah kelas berat dan membutuhkan lebih banyak ruang memori. Apalagi mereka butuh waktu untuk mengeksekusi. Selanjutnya, programmer harus mengimpor paket javax.awt untuk mengembangkan GUI berbasis AWT. Tombol, scrollbars, bidang teks, daftar, dialog, dan panel adalah beberapa komponen AWT. Setelah membuat objek, mereka ditempatkan dalam sebuah wadah. Juga, ia menyediakan ruang yang diperlukan untuk memuat komponen. Biasanya, aplikasi AWT dalam satu OS mungkin terlihat berbeda di OS lain.

    Swing adalah platform-independent dan komponennya ringan. Selanjutnya, komponen membutuhkan ruang memori minimum. Oleh karena itu, aplikasi Swing mengeksekusi lebih cepat. Salah satu pola desain umum dalam pengembangan adalah pola Model, Tampilan, Pengendali (MVC). Ayunan mengikuti pola ini. Ini membantu menjaga kode dengan mudah.

Perbedaan Antara AWT dan Swing

Definisi

  • AWT: AWT adalah kumpulan komponen GUI (widget) dan layanan terkait lainnya yang diperlukan untuk pemrograman GUI di Java.
  • Swing: Swing adalah bagian dari Java Foundation Classes (JFC) yang digunakan untuk membuat aplikasi GUI front-end berbasis Java.

Jenis

  • AWT: Komponen AWT berat.
  • Swing: Komponen Swing ringan.

Ketergantungan Platform

  • AWT: AWT adalah platform yang bergantung.
  • Swing: Swing adalah platform independen.

Display

  • AWT: AWT tidak mendukung tampilan dan nuansa yang dapat pluggable.
  • Swing: Swing mendukung tampilan dan nuansa yang dapat pluggable.

Komponen

  • AWT: AWT memiliki komponen kurang berkembang dibandingkan swing.
  • Swing: Swing memiliki komponen yang lebih maju daripada AWT.

Kecepatan

  • AWT: Eksekusi AWT lebih lambat.
  • Swing: Swing mengeksekusi lebih cepat.

MVC

  • AWT: AWT tidak mendukung pola MVC
  • Swing: Swing mendukung pola MVC.

Ruang Memori

  • AWT: Komponen AWT memerlukan lebih banyak ruang memori.
  • Swing: Komponen Swing tidak memerlukan banyak ruang memori.

Paket

  • AWT: Programmer harus mengimpor paket javax.awt untuk mengembangkan GUI berbasis AWT.
  • Swing: Programmer harus mengimpor paket javax.swing untuk menulis aplikasi Swing.

3. Layout Manager

    Layout Manager adalah proses menentukan ukuran dan posisi dari komponen. Komponen dapat menyediakan dan petunjuk tata letak dan keselarasan untuk manager. Manajemen layout diperlukan untuk mengatur penempatan komponen di dalam frame agar bisa menghasilkan bentuk interface yang menarik. Penggunaan manajemen layout dalam menggunakan letak komponen juga akan memudahkan kita untuk menempelkan komponen pada frame.java, komponen ini menyediakan sejumlah metode layout dalam mengatur komponen kedalam frame. Kita pun diizinkan mengkombinasikan beberapa metode agar pemasangan komponen menjadi lebih baik dan mudah. 

Macam-macam Layout Manager terdiri dari:

1. Flow layout manager merupakan manager layout yang paling sederhana. Layout ini menyusun komponen berdasarkan ukuran default masing-masing, dengan posisi mulai dari kiri ke kanan dan dari atas kebawah di dalam container yang digunakan. . Apabila tidak muat lagi, maka akan dibuat baris baru dan aturan yang berlaku masih sama: kiri ke kanan FlowLayout merupakan layout standar yang dipakai oleh setiap obyek Jpanel.

2. Border Layout adalah layout standar yang dipakai oleh setiap content pane. Content pane adalah container utama dari semua frame, applet dan dialog. BorderLayout mempunyai 5 daerah untuk menampilkan komponen-komponen, yaitu: north, south, east, west, and center. Semua ruang yang tersisa diletakkan di daerah tengah (center).

3. Card Layout mengisi sebuah daerah yang berisi komponen-komponen yang berbeda pada waktu yang berbeda. Tabbed pane adalah contoh yang mempunyai kesamaan dengan CardLayout. Sebuah CardLayout biasanya dikendalikan oleh sebuah kotak kombo (combo box) dimana keadaannya (state) ditentukan oleh panel (kelompok komponen-komponen). CardLayout juga merupakan layout manager yang mampu menciptakan efek “tumpukan” komponen. Artinya, layout ini tidak memposisikan komponen di lokasi-lokasi tertentu di dalam kontainer, melainkan nampilkannya satu demi satu.

4. Gridlayout merupakan salah satu layout yang digunakan untuk mengatur tata letak pada panel. Gridlayout merupakan bagian dari library AWT. Grid layout menempatkan komponen dalam bentuk “rectangular grid”. GridLayout membuat komponen-komponen yang mempunyai ukuran yang sama dikumpulkan menjadi satu dan ditampilkan menurut jumlah baris dan kolom yang diberikan.

5. GridBag Layout merupakan layaout manager yang sangat fleksibel. Layout ini memampukan kita untuk memposisikan komponen relatif terhadap komponen lainnya berdasarkan constraint tertentu. Dengan menggunakan GridBagLayout, kita dapat menciptakan layout apapun juga, tanpa batas. Komponen disusun pada koordinat tertentu pada sebuah grid yang disebut “logical coordinate”, yang berarti bahwa koordinat suatu komponen ditentukan oleh sekumpulan komponen lainnya.Baris dan kolom dari grid tersebut bersifat “stretch” yang bergantung pada size dan constraint yang milikinya.

6. Box Layout adalah layout manager yang mengijinkan banyak komponen terpasang baik secara vertical maupun secara horizontal. Komponen tersebut akan tetap tersusun vertikal atau horizontal ketika ukuran frame diubah. Box Layout membuat semua komponen pada ukuran alaminya tetapi ukuran kontainer akan mengikuti ukuran komponen yang terlebar. Box Layout juga menempatkan komponen dalam satu baris yang kita pilih.

Contoh kode program yang bisa menampilkan output kalkulator sederhana :

Output :


PRAKTIKUM


GUI Dengan FlowLayout

Output :



GUI Dengan NULL Layout (Tanpa Layout)

Output :


Contoh kode program yang bisa menampilkan output kalkulator sederhana dengan menggunakan null layout :

Output :


Komentar