Facelets Template Yapısı
Facelets bu noktada template destegi ile bizim yardimimiza kosmakta. Sablon dosyamizda dinamik bölgeler olusturarak, diger sayfalarda yapmamiz gereken sadece bu bölgeleri tanimlamak.
Örnek bir sablon yapisi üzerinden gidersek çok daha iyi olacak.
sablon.xhtml:
<?xml version=’1.0' encoding=’UTF-8' ?> <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <html xmlns=”http://www.w3.org/1999/xhtml” xmlns:ui=”http://java.sun.com/jsf/facelets”> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8? /> <title>Facelets – Template Example</title> </head> <body> <div> <ui:insert name=”icerik” /> </div> </body> </html>
Dinamik bölgeleri tanimlamak için <ui:insert /> bilesenini kullaniyoruz. name parametresi sayfalarimizda kullanirken belirtedegimiz tanimlama ismini belirtiyor. Simdi bu template dosyasini kullanan bir sayfa hazirlayalim.
ana_sayfa.xhtml:
<?xml version=’1.0' encoding=’UTF-8' ?> <!DOCTYPE composition PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <ui:composition xmlns=”http://www.w3.org/1999/xhtml” xmlns:ui=”http://java.sun.com/jsf/facelets” template=”./sablon.xhtml”> <ui:define name=”icerik”> Ana Sayfaya Hos Geldiniz ! </ui:define> </ui:composition>
Sayfamizi olustururken öncelikle ui:composition bilesenine parametre olarak hangi sablonu kullanacagimizi belirtiyoruz. Bizim sablon dosyamiz sablon.xhtml oldugu için parametre olarak bu dosyayi giriyoruz. Sonrasinda ise sablonumuzdaki dinamik bölgeleri tanimlayarak içerigimizi olusturuyoruz. Dinamik bölgeleri belirtmek için <ui:define /> bilesenini kullaniyoruz. Parametre olarak gönderdigimiz name sablonda kullandigimiz <ui:insert>‘e parametre olarak gönderdigimiz degeri yaziyoruz.
Bir önceki yazimizda (JSF ve Richfaces) netbeans kullaniyorduk. Netbeans’e facelets destegi kazandirmistik. Simdi bu facelets destegi kullanarak önce bir sablon dosyasi ve sonrasinda bu dosyayi kullanan bir sayfa hazirlayalim. Projemize Sag tiklayip New->Order seçenegini seçiyoruz. Categories bölümünden JavaServerFaces, File Types bölümünden ise Facelets Tepmlate‘i seçip next butonuna basiyoruz.
Daha sonra karsimiza çikan pencerede template dosyamiza bir isim vermemiz isteniliyor. Bir isim verdikten sonra bizim için daha önceden hazirlanmis layoutlar mevcut. Bunlardan herhangi bir tanesini seçiyoruz. Layout seklini css mi yoksa table kullanakarak mi vermek istedigimizi soruyor. Biz web standartlarina bagli kalarak css diyoruz tabiki
Finish butonuna basınca şablon dosyamız bizim için otomatik olarak üretiliyor.
Simdi bu template dosyasini kullanan bir sayfa olusturalim. Bunun için gene projemize sag tiklayip New->Other seçiyoruz. Buradan Categories bölümünden JavaServer Faces , FileTypes bölümünden de Facelets Template Client seçenegini seçerek next butonuna basiyoruz.
2. adimda çikan pencerede ise sayfamiza bir isim vermemiz isteniliyor. Ismi verdikten sonra bir tane de template seçmemiz isteniyor. Template karsisindaki browse butonuna tiklayarak biraz önce olusturdugumuz sablon.xhtml dosyasini seçiyoruz. Sablonu seçtikten sonra Genereted Root tag kisminda html mi <ui:composition> ‘mi kullanmak istedigimiz soruluyor. Burada <ui:composition> seçerekten finish diyoruz .
Otomatik olarak sablon dosyamizdaki dinamik bölgelere bakaraktan sayfamiz olusturuldu Her sey bu kadar basit. Template sistemi bizi bir çok yükten kurtardigi gibi projemize de dinamik bir templating yapisi sunmakta.
Kamil Örs
Software Developer
Etiketler :
[java server faces]
[web]
[richfaces]
[jsf]
[framework]
[java ee]
[yapı]
[uygulama çatısı]
[java]
[template]