GUI Nimbus - Jurusan Informatikainformatika.unsyiah.ac.id/~viska/pjl/P2-1 GUI Nimbus.pdf ·...

GUI Nimbus

Prepared by Viska Mutiawani

1 viska@unsyiah.ac.id

Subtopik GUI Nimbus

Netbeans GUI Builder

GUI dan Look & Feel

Nimbus

2 viska@unsyiah.ac.id

Netbeans GUI Builder

3 viska@unsyiah.ac.id

Permasalahan mendesign GUI tanpa IDE

Penggunaan Swing API dan layout manager sebetulnya kompleks karena harus disusun agar rapi dan sesuai dengan kaedah HCI

Resizing dan alignment juga repot

Menyediakan Look and Feel sesuai OS juga repot

4 viska@unsyiah.ac.id

Netbeans GUI Builder

Nama lainnya: Matisse

Membuat form tanpa perlu pemahaman detil mengenai Swing

Good looking by default – spacing ishandled according to underlying OS's Lookand Feel

Komponen GUI ditambah dan dipindah dengan drag & drop

Komponen GUI dikelompokkan dan akan bereaksi jika ada perubahan pada lingkungan

Form behaves intelligently when resized

GUI components alignment can be easily5 viska@unsyiah.ac.id

Fitur Matisse

Simple and intuitive layout of GUIs without the complexity of Swing layout managers

Drag and drop capability

Automatic form alignment

Visual guidelines for optimal spacing between components and alignment of components

Support for both visual and non-visual forms

6 viska@unsyiah.ac.id

Fitur Matisse

Component Inspector showing a components tree and properties

Support for null layout

In-place editing of text labels of components (labels, buttons, textfields, etc)

Full JavaBeans support - installing, using and customizing (properties, events, customizers)

Visual JavaBean customization - ability to create forms from any JavaBean classes

7 viska@unsyiah.ac.id

Cara kerja Matisse?

Mirip seperti Visual Studio pada Windows, Interface Builder pada Mac

Supports multiple OS'es

New layout manager – GroupLayout layout manager

This layout manager can be used separately

8 viska@unsyiah.ac.id

GUI dan Look & Feel

9 viska@unsyiah.ac.id

GUI

Untuk membuat aplikasi GUI bisa menggunakan AWT dan Swing

Untuk menambah interaktivitas, tampilan GUI tadi akan ditambahkan event dengan metode event delegation model

10 viska@unsyiah.ac.id

Look and Feel

The "look" of an application refers to its appearance.

The "feel" refers to how the widgets behave.

You can choose to use the default Swing look and feel (e.g. the Ocean theme for the Metal look and feel), or the look and feel of the native platform (e.g. Windows, GTK+), or you can customize your own look and feel.

11 viska@unsyiah.ac.id

Sun’s JRE menyediakan beberapa L&F

CrossPlatformLookAndFeel—merupakan "Java L&F" (nama lainnya "Metal") yang tampilannya mirip padasemua platform OS. Ada di Java API (javax.swing.plaf.metal) dan merupakan setting L&F default.

SystemLookAndFeel—merupakan L&F yang mengikutitampilan OS tempat aplikasi berjalan. Sistem L&F ditentukan saat runtime.

Synth—L&F yang dapat dimodifikasi sendiri dengan file XML.

Multiplexing— cara method UI untuk mendelegasikan kebeberapa L&F pada waktu yang sama.

12 viska@unsyiah.ac.id

SystemLookAndFeel

Platform Look and Feel

Solaris, Linux with GTK+ 2.2 or later

GTK+

Other Solaris, Linux Motif

IBM UNIX IBM*

HP UX HP*

Classic Windows Windows

Windows XP Windows XP

Windows Vista Windows Vista

Macintosh Macintosh*

13 viska@unsyiah.ac.id

Tema Ocean pada cross-platform Java (Metal) L&F

14 viska@unsyiah.ac.id

Tema Steel pada cross-platform Java (Metal) L&F

15 viska@unsyiah.ac.id

Nimbus

16 viska@unsyiah.ac.id

Nimbus Look & Feel

Nimbus merupakan ‘polished’ cross-platform look and feel yang diperkenalkan di rilis Java SE 6 Update 10 (6u10).

17 viska@unsyiah.ac.id

Nimbus L&F

Nimbus menggunakan grafis vector Java 2D untuk menggambar User Interface (UI).

Jadi tampilan UI menjadi lebih cantik pada resolusi berapapun.

Nimbus dapat diubah-ubah. Namun anda dapat menggunakan Nimbus L&F default juga.

18 viska@unsyiah.ac.id

Scalable components

Vector based di Nimbusvs bitmap base di Metal L&F

19 viska@unsyiah.ac.id

Cara menggunakan Nimbus Waktu runtime

java -Dswing.defaultlaf=javax.swing.plaf.nimbus.NimbusLookAndFeelMyApp

Dalam coding, tambahkan sebelum membuat komponen GUIimport javax.swing.UIManager.*;

try {for (LookAndFeelInfo info : UIManager.getInstalledLookAndFeels()) {

if ("Nimbus".equals(info.getName())) {UIManager.setLookAndFeel(info.getClassName());break;

}}

} catch (Exception e) {// If Nimbus is not available, you can set the GUI to another look and feel.

}

20 viska@unsyiah.ac.id

Mengubah tampilan Nimbus

Tampilan Nimbus dapat dimodifikasi, seperti:

Resizing a component: ada 4 size yaitu mini, small, regular, large

Changing the color theme

Skinning a component

21 viska@unsyiah.ac.id