Java Look and Feel

Para pembaca yang budiman, salah satu hal yang penting dalam software development adalah user interface (UI). User Interface berperan sebagai barisan terdepan sebuah aplikasi ketika aplikasi tersebut digunakan oleh pengguna. Tak jarang pengguna langsung menilai bagus tidaknya sebuah aplikasi hanya dari tampilan user interface yang dihadapinya. Penilaian yang keluar dari para pengguna software ini bersifat subyektif bahkan cenderung ke masalah suka atau tidak suka. Para pengguna memiliki sebuah kekuatan opini yang dapat menentukan layak tidaknya aplikasi yang kita buat hanya dari penilaian mereka soal tampilan aplikasi saja. Kita sebagai seorang software developer mungkin mengganggap bahwa merupakan hal yang sangat menggangu ketika aplikasi kita tidak mau digunakan oleh user dengan alasan tampilannya jelek. Namun itulah user, yang kita buat akan mereka gunakan, dan sudah selayakanya user interface menjadi fokus penting kita selain tentu saja proses bisnis dari aplikasi yang kita buat.

Dalam pemrograman Java, terutama java desktop atau java swing, kita sebetulnya menghadapi masalah yang serius soal user interface. Swing Framework yang kita gunakan dalam membangun aplikasi desktop dengan bahasa pemrograman java memiliki keterbatasan. Oleh karena bahasa java merupakan bahasa pemrograman yang lintas platform, terkadang sebuah aplikasi java desktop yang kita buat dan kemudian dijalankan dalam sebuah sistem operasi menjadi sangat bagus tampilannya, namun ketika berpindah sistem operasi, tampilan aplikasi kita berantakan tidak karuan. Entah text field-nya kebesaran atau kekecilan, tombol yang tidak kelihatan labelnya dan segudang lain masalah tampilan user interface tersebut.

Kenapa hal diatas bisa terjadi?, sebab memang pada dasarnya java berjalan pada environment sendiri dan tidak bergantung pada elemen-elemen sebuah sistem operasi. Jadi ketika sebuah aplikasi java desktop berjalan pada sistem operasi windows misalnya, aplikasi tersebut tidak menggunakan elemen text-field, button, combo-box milik windows, melainkan milik java sendiri yang memang dibuat mirip-mirip dengan elemen-elemen di sistem operasi windows, demikian juga berlaku untuk semua sistem operasi dimana java bisa berjalan diatasnya. Meski sebetulnya Swing Framework memiliki sebuah standar tampilan yang bisa berlaku untuk keduanya, namun kita pasti akan lebih senang menggunakan tampilan-tampilan yang mirip-mirip dengan sistem operasi dimana aplikasi kita berjalan. Alasan lain yang membuat kita tidak menggunakan tampilan standar Swing Framework pada aplikasi kita adalah memang kita mesti akui bahwa tampilan tersebut kalah halus dibanding milik sistem operasi. 

Dalam tulisan kali ini kita tidak akan menyelesaikan masalah tersebut diatas, namun kali ini kita akan mencoba beberapa Look And Feel yang bisa kita gunakan dalam aplikasi java desktop kita. Mudah-mudahan saja dari kegiatan kita kali ini mungkin kita bisa menghadirkan solusi yang tepat untuk permasalahan diatas. Kita akan mencoba sedikit demi sedikit mengenal look and feel dalam aplikasi java desktop dengan menggunakan Swing Framework. Untuk percobaan kita yang pertama, mari kita cari tahu look and feel apa saja yang ada dalam distribusi java yang ter-install dalam komputer kita. Buatlah sebuah project java menggunakan IDE favorit anda, kemudian buatlah sebuah class dengan nama Bootstrap, dan isinya seperti berikut ini:

import javax.swing.*;
import java.util.ArrayList;
import java.util.List;

public class Bootstrap {

    public static void main(String[] args) {
        List<String> lfList = getInstalledLookAndFeel();
        for(String lfClassName : lfList){
            System.out.println(lfClassName);
        }
    }

    /*static get installed look and feel*/
    public static List<String> getInstalledLookAndFeel(){
        List<String> rList = new ArrayList<String>();
        for (UIManager.LookAndFeelInfo info : UIManager.getInstalledLookAndFeels()){
            rList.add(info.getClassName());
        }
        return rList;
    }
}

Kemudian jalankan compile dan jalankan program tersebut, pada komputer saya hasilnya bisa terlihat seperti gambar berikut ini:

Nah terlihat jelas bahwa di dalam komputer saya terinstall 4 buah look and feel yang bisa saya gunakan untuk membuat aplikasi java desktop dengan Swing Framework. Ok, sekarang mari kita mencoba melakukan percobaan penggunaan look and feel tersebut diatas. Dalam project yang sudah anda buat tadi buatlah sebuah form Jframe dengan menggunakan IDE Netbean, dengan contoh kira kira seperti gambar berikut ini:

Oleh karena kita menggunakan Netbeans dalam membuat form JFrame tersebut, biasanya Netbeans akan secara otomatis menambahkan method static void main dan langsung menginisialisai look and feel-nya. Kita akan menghapus atau meng-comment baris-baris tersebut, dan kita akan memanggil form tersebut menggunakan class Bootstrap yang sudah kita buat sebelumnya. Berilah comment baris main method yang dibuat oleh netbeans hingga menjadi seperti gambar berikut ini:

Dengan cara seperti itu maka form tersebut tidak akan bisa di eksekusi secara langsung, dan memerlukan class lain untuk menampilkannnya. Namun agar kita bisa memanggil form tersebut  dengan look and feel yang berbeda-beda nantinya, kita perlu membuat sebuah method baru dalam form ini, yaitu method showForm() dan di dalam method ini kita letakkan statement initComponent yang kita ambil dari constructor form tersebut, sebab jika kita tidak melakukan ini maka usaha kita tidak akan berhasil, berikut ini code yang bisa kita modifikasi pada form tersebut:

    public void showForm(){
        initComponents();
    }
    /**
     * Creates new form MainFrame
     */
    public MainFrame() {
        //initComponents();
    }

Kemudian pada class Bootstrap kita tambahkan code menjadi seperti berikut ini:

import javax.swing.*;
import java.util.ArrayList;
import java.util.List;

public class Bootstrap {

    public static void main(String[] args) {
        List<String> lfList = getInstalledLookAndFeel();
        for(String lfClassName : lfList){
            System.out.println(lfClassName);
        }

         final MainFrame mainFrame = new MainFrame();
        javax.swing.SwingUtilities.invokeLater(new Runnable() {
            public void run() {
                setLookAndFeel("javax.swing.plaf.metal.MetalLookAndFeel");
                 mainFrame.showForm();
                mainFrame.setVisible(true);
            }
        });
    }

    /*static get installed look and feel*/
    public static List<String> getInstalledLookAndFeel(){
        List<String> rList = new ArrayList<String>();
        for (UIManager.LookAndFeelInfo info : UIManager.getInstalledLookAndFeels()){
            rList.add(info.getClassName());
        }
        return rList;
    }


    public static void setLookAndFeel(String lookAndFeelClassName) {
        try {
            javax.swing.UIManager.setLookAndFeel(lookAndFeelClassName);
        } catch (javax.swing.UnsupportedLookAndFeelException ex) {
            java.util.logging.Logger.getLogger(MainFrame.class.getName()).log(java.util.logging.Level.SEVERE, null, ex);
        } catch (Exception e){
            e.printStackTrace();
        }
    }
}

Ok, mari kita bahas dengan detail tambahan kode-kode di atas.

    public static void setLookAndFeel(String lookAndFeelClassName) {
        try {
            javax.swing.UIManager.setLookAndFeel(lookAndFeelClassName);
        } catch (javax.swing.UnsupportedLookAndFeelException ex) {
            java.util.logging.Logger.getLogger(MainFrame.class.getName()).log(java.util.logging.Level.SEVERE, null, ex);
        } catch (Exception e){
            e.printStackTrace();
        }
    }

Pada code ini kita membuat sebuah method yang berfungsi menge-set secara global seluruh look and feel aplikasi java desktop kita, dengan cara membuat look and feel – nya menjadi parameter dari method ini, maka nantinya kita akan mudah mengganti-ganti tampilan look and feel aplikasi java desktop kita sesuai dengan yang kita inginkan. Kemudian perhatikan tambahan code pada method utama seperti berikut ini:

    public static void main(String[] args) {
         …
        final MainFrame mainFrame = new MainFrame();
        javax.swing.SwingUtilities.invokeLater(new Runnable() {
            public void run() {
                setLookAndFeel("javax.swing.plaf.metal.MetalLookAndFeel");
                mainFrame.showForm();
                mainFrame.setVisible(true);
            }
        });
    }

Perhatikan baris setLookAndFeel di atas, disanalah kita mengeset look and feel aplikasi java desktop kita, dan kemudian pemanggilan method showForm() akan mentrigger pembuatan masing-masing komponen yang ada dalam form tersebut sesuai dengan look and feel yang kita set sebelumnya. Dan saya mencoba memakai class MetalLookAndFeel pada contoh kode tersebut. Kemudian mari kita coba compile dan jalankan kembali file Bootstrap ini, dan kira kira seperti ini tampilan akhir dari form saya:

Dan jika saya ganti-ganti paramater yang kita buat pada method utama file Bootstrap tadi secara berturut-turut sesuai dengan yang look and feel yang ter-install dalam komputer saya maka seperti berikut ini hasilnya masing-masing:

Class : com.sun.java.swing.plaf.nimbus.NimbusLookAndFeel

Class : com.sun.java.swing.plaf.motif.MotifLookAndFeel

Class : com.sun.java.swing.plaf.gtk.GTKLookAndFeel

Hmm, menarik bukan?, bagaimana dengan anda?. Jika anda menggunakan sistem operasi windows, ada look and feel yang mirip windows disana, oleh karena saya menggunakan sistem operasi ubuntu, ya seperti diatas sajalah tampilannya.
Ok, jika diatas kita telah menggunakan look and feel dari distribusi java secara default, mungkin pertanyaannya adalah, adakah third party yang memiliki look and feel yang lain yang bisa kita pakai dalam aplikasi java desktop kita?, jawabannya ada, silahkan anda googling sendiri, akan ada beberapa third party yang menyediakan look and feel yang kita cari baik yang opensource, free, maupun berbayar. Sementara sekarang saya akan mencoba berbagi look and feel yang pernah saya pakai selain milik distribusi java default.
1. SeaGlass look and feel http://code.google.com/p/seaglass/
2. Jgoodies look and feel http://www.jgoodies.com/freeware/libraries/looks/

Kedua look and feel diatas adalah look and feel yang opensource dan free yang dapat kita gunakan dalam aplikasi java desktop kita. Adapun cara menggunakannya hanya menambahkan library jar file ke dalam project java desktop kita, dan bagi anda yang menggunakan maven, cukup menambahkan dependency kedua library tersebut seperti contoh berikut ini:

        <dependency>
            <groupId>com.seaglasslookandfeel</groupId>
            <artifactId>seaglasslookandfeel</artifactId>
            <version>0.2</version>
        </dependency>
        <dependency>
            <groupId>com.jgoodies</groupId>
            <artifactId>jgoodies-looks</artifactId>
            <version>2.6.0</version>
        </dependency>

dan untuk menggunakannya, class yang dipakai adalah sebagai berikut:

Seaglass : com.seaglasslookandfeel.SeaGlassLookAndFeel

Jgoodies : com.jgoodies.looks.plastic.PlasticLookAndFeel

Jgoodies : jgoodies: com.jgoodies.looks.plastic.PlasticXPLookAndFeel

Demikianlah pembaca, pembahasan kita tentang look and feel dalam java, semoga para pembaca bisa mengambil pengetahuan yang bermanfaat dari tulisan kali ini dan kemudian dapat mengembangkannya sesuai dengan selera dan kebutuhan dari masing-masing pembaca itu sendiri. Akhir kata wassalam dari saya.

Menteng, 6 Maret 2014

Josescalia