При разработке веб приложения большинство страниц выглядят одинаково. Вместо того что-бы не создавать кучу ненужного кода, используются шаблоны. В JSF 2 предусмотрена гибкая система шаблонов. В основном мы будем использовать Facelet теги, такие как:
Это структура шаблона, которую я обычно использую. В head мы будем вставлять css для определенных страниц. Тэг ui:insert определяет область куда будет вставляться контент. Если для тэга ui:insert не указан соответствующий тэг ui:define, то по стандарту будет использоваться код находящийся внутри ui:insert. К примеру, в данном случае если мы не укажем <ui:define name="headerBlock">, то по стандарту будет использоваться
<ui:include src="/pages/includes/defaultHeader.xhtml" />.
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
1. ui:composition - при добавлении аттрибута "template" ваша страница будет использовать шаблон указанный в значении аттрибута.
2. ui:insert - определяет область в которую будет вставлена информация в шаблон из страницы (аттрибут "name" тегов ui:insert и ui:define должны совпадать).
3. ui:define - Определяет область страницы, которая будет вставлена в шаблон.
4. ui:include - вставляет код отдельной страницы.
Базовая структура шаблона
<!DOCTYPE composition 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:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:p="http://primefaces.org/ui" xmlns:pretty="http://ocpsoft.com/prettyfaces">
<h:head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <h:outputStylesheet library="css" name="layout.css"></h:outputStylesheet> <ui:insert name="pageHeader" /></h:head><h:body>
<ui:insert name="headerBlock" />
<ui:include src="/pages/includes/defaultHeader.xhtml" />
</ui:insert>
<div id="content"> <ui:insert name="contentBlock">
<ui:include src="/pages/includes/defaultContent.xhtml" />
</ui:insert>
</div></h:body></html>
Пример страницы с использованием шаблона
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
template="/layout/template.xhtml">
<ui:define name="pageHeader">
</ui:define>
<h:outputStylesheet library="css" name="page1.css"></h:outputStylesheet>
<ui:define name="headerBlock">
This is the content of headerBlock.
</ui:define>
<ui:define name="contentBlock">This is the content of contentBlock.
</ui:define>
</ui:composition>
Для того что-бы ваша страница использовала шаблон необходимо добавить аттрибут template в тело тэга ui:composition.
Зная выше перечисленное вы сможете еффективно создавать шаблоны с помощью JSF 2 Facelets.
С уважением,
Netlink community member
Комментариев нет:
Отправить комментарий