Kali ini saya ingin berbagi mengenai cara membuat autocomplete pada JTextField dan JComboBox dengan library yang bernama JIDE Common Layer. JIDE Common Layer merupakan sebuah product open source dari Jidesoft (sebuah perusahaan komersil yang menyediakan komponen custom Java Swing). Namun pada post kali ini saya hanya akan membahas komponen AutoCompletion yang disediakan pada library JIDE Common Layer.
Sebelumnya kita harus menambahkan dependency JIDE Common Layer pada project yang kita buat.
Karena saya menggunakan Maven dan JIDE Common Layer sudah tersedia pada maven repository, silahkan tambahkan dependency berikut pada pom.xml
Jalankan program dan buka form JIDE OSS AutoCompletion, lalu coba mengetik pada text field nama dan combobox kota. Pada komponen tersebut akan ditampilkan data pada List yang sesuai dengan nilai yang kita ketikkan. Sangat mudah bukan, dan kita tidak perlu melakukan reinvent the wheel karena JIDE Common Layer sudah menyediakannya untuk kita, gratis lagi :).
Source code bisa diakses via akun github saya di https://github.com/ekosuhariyadi/belajar-javaswing.
Semoga membantu :).
Sebelumnya kita harus menambahkan dependency JIDE Common Layer pada project yang kita buat.
Karena saya menggunakan Maven dan JIDE Common Layer sudah tersedia pada maven repository, silahkan tambahkan dependency berikut pada pom.xml
<dependency> <groupId>com.jidesoft</groupId> <artifactId>jide-oss</artifactId> <version>3.5.0</version> </dependency>
Untuk mencoba AutoCompletion, saya membuat sebuah form dengan JInternalFrame dan menambahkan sebuah JTextField serta sebuah JComboBox.
Karena komponen AutoCompletion membutuhkan data berupa java.util.List, maka saya harus menampung data pada class List (pada post ini saya menggunakan class ArrayList).
Pada potongan kode di atas, saya mendeklarasi 2 List untuk menampung data nama dan kota. Inisialisasi data saya buat pada method initData. Cara menggunakan JIDE AutoCompletion pada JTextField sangatlah mudah, seperti yang terlihat pada method initAutoCompletion, kita tinggal menginstantiasi class AutoCompletion dengan parameter berupa JTextField dan List data pada konstruktornya.
Lalu bagaimana dengan JComboBox ?
Berbeda dengan JTextField, untuk bisa menggunakan AutoCompletion kita harus menginstantiasi JComboBox dengan konstruktor milik JIDE Common Layer, bukan dengan konstruktor JComboBox.
Kita juga harus menyertakan List data pada konstruktornya.
Namun karena saya menggunakan fitur drag and drop pada Netbeans, maka saya tidak bisa mengedit secara langsung potongan kode pada method initComponents yang digenerate secara otomatis oleh Netbeans.
Namun kita bisa mengeditnya melalui Tab Properties dengan cara sebagai berikut:
Karena komponen AutoCompletion membutuhkan data berupa java.util.List, maka saya harus menampung data pada class List (pada post ini saya menggunakan class ArrayList).
private List<String> listNama; private List<String> listKota; /** * Creates new form JideOSSAutoCompletionIFrame */ public JideOSSAutoCompletionIFrame() { initData(); initComponents(); initAutoCompletion(); } private void initData() { listNama = new ArrayList<String>( Arrays.asList("Eko Suhariyadi", "Hiro Kunimi", "Chiaki Shinichi", "Kudo Shinichi", "Haruka Koga", "Megumi Noda", "Ran Mouri")); listKota = new ArrayList<String>( Arrays.asList("Sidoarjo", "Surabaya", "Malang", "Madiun", "Jakarta")); } private void initAutoCompletion() { AutoCompletion txtNamaCompletion = new AutoCompletion(txtNama, listNama); } private javax.swing.JComboBox comboKota; private javax.swing.JTextField txtNama;
Pada potongan kode di atas, saya mendeklarasi 2 List untuk menampung data nama dan kota. Inisialisasi data saya buat pada method initData. Cara menggunakan JIDE AutoCompletion pada JTextField sangatlah mudah, seperti yang terlihat pada method initAutoCompletion, kita tinggal menginstantiasi class AutoCompletion dengan parameter berupa JTextField dan List data pada konstruktornya.
Lalu bagaimana dengan JComboBox ?
Berbeda dengan JTextField, untuk bisa menggunakan AutoCompletion kita harus menginstantiasi JComboBox dengan konstruktor milik JIDE Common Layer, bukan dengan konstruktor JComboBox.
Kita juga harus menyertakan List data pada konstruktornya.
comboKota = new AutoCompletionComboBox(listKota.toArray());
Namun karena saya menggunakan fitur drag and drop pada Netbeans, maka saya tidak bisa mengedit secara langsung potongan kode pada method initComponents yang digenerate secara otomatis oleh Netbeans.
Namun kita bisa mengeditnya melalui Tab Properties dengan cara sebagai berikut:
- Klik comboKota pada Form Designer Netbeans, lalu buka Tab Properties.
Akses action bar Code, dan cari properti Custom Creation Code, lalu klik edit
- Masukkan potongan kode di atas pada dialog editor yang tersedia, lalu klik OK
Maka apabila kita periksa kembali potongan kode instantiasi comboKota akan berubah dari
menjadi
comboKota = new JComboBox();
menjadi
comboKota = new AutoCompletionComboBox(listKota.toArray());
Jalankan program dan buka form JIDE OSS AutoCompletion, lalu coba mengetik pada text field nama dan combobox kota. Pada komponen tersebut akan ditampilkan data pada List yang sesuai dengan nilai yang kita ketikkan. Sangat mudah bukan, dan kita tidak perlu melakukan reinvent the wheel karena JIDE Common Layer sudah menyediakannya untuk kita, gratis lagi :).
Source code bisa diakses via akun github saya di https://github.com/ekosuhariyadi/belajar-javaswing.
Semoga membantu :).
Comments
Post a Comment