Konfigurasi dan Hello World Komponen Primefaces

33

2.3.3 Konfigurasi dan Hello World

Untuk integrasi Primefaces pada aplikasi yang akan dikembangkan pada dasarnya tidak memerlukan konfigurasi yang begitu rumit melainkan cukup mudah dan hampir sama dengan teknologi yang lainnya. Setelah mengunduh file utama Primefaces pengembang tinggal menambahkan properties pada class path aplikasi. Berikut ini contoh coding implementasi pada halaman user interfaces : html xmlns=http:www.w3c.org1999xhtml xmlns:h=http:java.sun.comjsfhtml xmlns:p=http:primefaces.prime.com.trui h:head h:head h:body p:spinner h:bodyhtml sumber: primefaces.org , 2011

2.3.4 Komponen Primefaces

Primefaces memiliki banyak komponen yang sudah mendukung untuk teknologi AJAX dengan tampilan simple dan ringan pengembang bisa menggunakan library ini untuk membangun aplikasi enterprise. Berikut beberapa jenis komponen yang dimiliki Primefaces dan diterapkan dalam pembuatan aplikasi yang akan dibuat antara lain:  Input element merupakan komponen yang berkaitan dengan interaksi pengguna terhadap aplikasi yang memberikan masukan dari pengguna yang nanti akan diolah Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh kHak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.arya tulis ini tanpa mencantumkan dan menyebutkan sumber. 34 oleh sistem, contoh: Calendars, Popup, Sliders, Captcha, Auto Complete, Button, Carousel , Color Picker, context menu dll. Gambar 2.13 Komponen Inputtext Gambar 2.14 Komponen Color Picker Gambar 2.15 Komponen Kalender Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh kHak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.arya tulis ini tanpa mencantumkan dan menyebutkan sumber. 35  Charts Charts pada dasarnya suatu komponen yang berguna untuk memberikan informasi secara grafik, biasanya digunakan untuk pelaporan yang sifatnya grafik. Contoh charts antara lain : Bar chart, pie chart, line graph dll. Gambar 2.16 Komponen Pie Chart Gambar 2.17 Komponen Line Chart  Image viewer Merupakan suatu fitur komponen yang disediakan oleh Primefaces yang digunakan untuk menampilkan gambar-gambar, seperti galeri foto. Pada Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh kHak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.arya tulis ini tanpa mencantumkan dan menyebutkan sumber. 36 komponen ini sudah mendukung dengan teknologi AJAX sehingga akan memudahkan bagi pengembang. Gambar di bawah adalah contoh screenshoot untuk komponen image viewer. Gambar 2.18 Komponen Image Viewer  Popup windows Berguna sebagai menampilkan media informasi dalam bentuk popup, contoh : Dialog boxes, menus, Mac-like “Growl” notification dll. untuk gambar lengkapnya bisa dilihat pada gambar di bawah : Gambar 2.19 Komponen Popup Dialog Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh kHak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.arya tulis ini tanpa mencantumkan dan menyebutkan sumber. 37 Gambar 2.20 komponen Context Menu  Data Table Suatu komponen yang berfungsi untuk menampilkan informasi berupa data tabel yang didapat dari database ataupun data static, komponen ini juga dilengkapi dengan fitur paging, sehingga akan mempermudah pengolahan data yang akan tampil ketika data tersebut banyak. Gambar 2.21 Komponen Data Tabel  Menu Bar Komponen ini sama halnya seperti komponen menu, yang berperan sebagai pengatur navigasi pada suatu aplikasi. Gambar 2. 22 Komponen Menu Bar Hak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh kHak Cipta © milik UPN Veteran Jatim : Dilarang mengutip sebagian atau seluruh karya tulis ini tanpa mencantumkan dan menyebutkan sumber.arya tulis ini tanpa mencantumkan dan menyebutkan sumber. 38

2.3.5 Partial Rendering