TOC

Пример JSF 2 Templating с Facelets

Пример шаблонов JSF 2 с Facelets

В веб-приложении большинство страниц соответствуют схожему макету и стилю веб-интерфейса, например, с одинаковым верхним и нижним колонтитулами. В JSF 2.0 вы можете использовать теги Facelets, чтобы легко обеспечить стандартный макет веб-интерфейса, на самом деле он выглядит аналогичноApache Tiles framework.

В этом примере показано использование 4 тегов Facelets для создания страницы из шаблона:

  1. ui:insert - используется в файле шаблона, он определяет содержимое, которое будет заменено файлом, загружающим шаблон. Контент можно заменить на тег «ui: define».

  2. ui:define - определяет контент, который вставляется в шаблон с соответствующим тегом «ui: insert».

  3. ui:include - аналогично JSP «jsp: include», включает содержимое с другой страницы XHTML.

  4. ui:composition - Если используется с атрибутом «шаблон», загружается указанный шаблон, и дочерние элементы этого тега определяют макет шаблона; В противном случае это группа элементов, которую можно куда-то вставить. Кроме того, JSF удаляет все теги «снаружи» тега «ui: состав».

1. Макет шаблона

В JSF 2.0 файл шаблона представляет собой обычный файл XHTML с несколькими тегами JSF-лицевых граней для определения макета шаблона.

Файл: commonLayout.xhtml

В этом шаблоне он определяет стандартный веб-макет:

  1. Использует тег «h:outputStylesheet» для включения файла CSS в заголовок для стилизации всего макета страницы.

  2. Использует тег «ui:insert» для определения трех заменяемых разделов: заголовка, содержимого и нижнего колонтитула.

  3. Использует тег «ui:include» для предоставления содержимого по умолчанию, если при использовании шаблона замена не указана.

2. Верхний колонтитул, содержание и нижний колонтитул

Три содержимого страницы по умолчанию.

Файл: commonHeader.xhtml 




    
        

        
This is default header

Файл: commonContent.xhtml 




    
        

        
This is default content

Файл: commonFooter.xhtml 




    
        

        
This is default footer

Когда эти страницы вставляются в файл шаблона, все теги за пределами «ui:composition» будут удалены. Например,

Файл: commonHeader.xhtml 




    
        ALL TAGS ABOVE THIS LINE WILL BE REMOVED BY JSF
        

        
This is default header


        
        ALL TAGS BELOW THIS LINE WILL BE REMOVED BY JSF

JSF принимает только следующие элементы и вставляет их в файл шаблона. 



    
This is default header

При вставке в шаблон «commonLayout» он стал…

Файл: commonLayout.xhtml 

    ...
    

    


        
    ...

3. Использование шаблона

Чтобы использовать существующий шаблон, например. «commonLayout.xhtml», вы используете тег «ui:composition» с атрибутом «template». Смотрите следующие два примера:

Файл: default.xhtml

Эта страница JSF загружает шаблон «commonLayout.xhtml» и отображает все содержимое страницы по умолчанию.

jsf2-facelets-template-example-1

Файл: page1.xhtml 




    

        

            
                
This is page1 content

            

        
                
This is page1 Footer

Эта страница JSF загружает шаблон «commonLayout.xhtml» и использует тег «ui: define» для переопределения тега «ui: insert», который определен в файле шаблона.

jsf2-facelets-template-example-2

Note
Пока имя тега «ui:define» совпадает с именем тега «ui:insert», который определен в шаблоне, «ui: вставить »содержимое заменяется.

Скачать исходный код

Скачать -JSF-2-Facelets-Template-Example.zip (12 КБ)

Рекомендации

  1. Фреймворк Apache Tiles

  2. JSF «ui: include» JavaDoc

  3. JSF «ui: insert» JavaDoc

  4. JSF «ui: define» JavaDoc

  5. JSF «ui: композиция» JavaDoc

Related