Facelet
A Facelet technológia egy nyílt forráskódú web sablon rendszer, amelyet a JavaServer Faces keretrendszerben a megjelenítő oldalak leírására használnak. A Faceletek szabványos XML alapú dokumentumok. Leírhatóak vele a JSF felhasználói felületet reprezentáló komponensek, így felépíthető a nézet oldalt tükröző JSF komponensfa.
Kezdetben a Faceletek egy alternatív nézet leíró nyelvként szolgáltak, a JSF korábbi változatai a JSP-t használták a megjelenítésre. A JSF 2 már a Faceleteket használja alapértelmezetten.
A Faceletek nagyban támogatják a tartalom újrafelhasználását. A lehetőségek között megtalálható a külső lap beemelése, saját elemek, összetett komponensek készítése. Emellett sablonozás is lehetséges.
Tartalomjegyzék |
A Faceletek lehetőségei [szerkesztés]
Sablonozás [szerkesztés]
A Faceletek lehetőséget nyújtanak a sablonozásra.[1] Ezt azt jelenti, hogy egy oldalon elhelyezhetünk helyőrző elemeket, amelyekhez egy másik oldalon definiálhatunk tartalmat.
A következő példa bemutatja a sablonok használatát:
templates/layout.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:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets"> <h:body> <div id="header"> <ui:insert name="header"> Alapértelmezett fejléc </ui:insert> </div> <div id="content"> <ui:insert name="content"> A fő tartalom helye </ui:insert> </div> </h:body> </html>
Az <ui:insert> elemek helyőrzők a tartalom számára. A nyitó és záró tag közötti rész akkor kerül megjelenítésre, ha a sablont felhasználó kliens lap nem definiálja a megfelelő tartalmat.
sablon-kliens.xhtml
<ui:composition template="/templates/layout.xhtml" xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets"> <ui:define name="content"> Ez a szöveg kerül a fő tartalom helyére. </ui:define> </ui:composition>
A fenti sablon kliens lap saját tartalmi részt definiál. Erre a <ui:define> elemek használhatóak. A definíciókat nyitó és záró <ui:composition> elemek között kell elhelyezni, az ezen kívüli részek nem lesznek megjelenítve. A példában a header rész nem lesz kicserélve, hiszen azt a sablon kliens nem definiálta.
Fájl beemelése [szerkesztés]
A sablonozás mellett lehetőség van már megírt Faceletek tartalmát egy egyszerű hivatkozással hozzáadni az oldalhoz. Ezt a <ui:include> elemmel lehet megtenni. A hivatkozott fájl nevét az src attribútum értékeként kell megadni.
include-pelda.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:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets"> <h:body> <div id="header"> <ui:insert name="header"> <ui:include src="/templates/default-header.xhtml" /> </ui:insert> </div> <div id="content"> <ui:insert name="content"> A fő tartalom helye </ui:insert> </div> </h:body> </html>
A példa az előző sablon példa módosítása: az alapértelmezett fejlécet egy külön fájl tartalmazza és ezt emeljük be.
Saját tagek [szerkesztés]
Lehetőség van saját tagek létrehozására is. Ezeket külön lapon kell megírni, a megvalósítást <ui:composition> és </ui:composition> közé írva. Egy taglib XML fájlban lehet hozzárendelni őket egy XML névtérhez.
Egy ilyen taglib XML felépítését mutatja a következő példa. Tegyük fel, hogy a regisztrálandó saját tag a mytag.xhtml fájlban van megírva.
mytag.taglib.xml
<?xml version="1.0" encoding="UTF-8"?> <facelet-taglib xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facelettaglibary_2_0.xsd" version="2.0"> <namespace>http://example.com/my</namespace> <tag> <tag-name>mytag</tag-name> <source>mytag.xhtml</source> </tag> </facelet-taglib>
A <namespace> jelöli a kívánt névteret, a <tag-name> pedig azt, hogy milyen néven akarunk a tagre hivatkozni. A <source> pedig a taget tartalmazó fájl elérési útja. Egy példa a tag használatára:
mytag-pelda.xhtml
<!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:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:sajat="http://example.com/my"> <h:body> Itt használjuk a taget: <sajat:mytag> </h:body> </html>
Összetett komponensek [szerkesztés]
A Faceletek további lehetősége az összetett komponensek létrehozása.[2] Az összetett komponenseket egy előre meghatározott, resources nevű könyvtárban kell elhelyezni (ezen belül hozhatunk létre alkönyvtárakat is). A komponens automatikusan kap nevet és XML névteret. A névtér http://java.sun.com/jsf/composite, utána írva az esetleges a könyvtár nevét. Az elem neve megegyezik az .xhtml fájl nevével kiterjesztés nélkül.
resources/sajat/udv.xhtml
<ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:cc="http://java.sun.com/jsf/composite"> <cc:interface> <cc:attribute name="nev" /> </cc:interface> <cc:implementation> <h:outputText value="Üdvözöllek, #{cc.attrs.nev}!"/> </cc:implementation> </ui:composition>
A példán is látható, hogy a komponens megadása két részre osztható: az interfészre és az implementációs részre. Az interfészben adhatunk meg attribútumokat, amelyek értékét a komponenst felhasználó oldal határozza meg. Ezekre az attribútumokra az implementációs részben a cc.attrs.ATTRIBUTUM_NEVE módon hivatkozhatunk.
Egy példa a használatra:
udv-pelda.xhtml
<!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" xmlns:my="http://java.sun.com/jsf/composite/sajat"> <my:udv nev="Teszt Elek" /> </html>
