Работа с темой Struts 2

Работа с темой и шаблоном Struts 2

В Struts2, когда вы помещаете тег пользовательского интерфейса «s:textfield» на HTML-страницу

Следующие 2 столбца HTML-макета таблицы будут созданы автоматически



  Username:

Struts 2 использует функцию «Тема и шаблон» для создания предварительно разработанного макета таблицы.

Давайте посмотрим на последовательность:

Struts 2 видят тег «s:textfield».
Поиск в объявленной теме (если тема не объявлена, будет выбрана тема по умолчанию в формате xhtml).
Найдите соответствующий шаблон темы, например «s:textfield → text.ftl», «s:password →password.ftl». Весь предопределенный макет HTML определен в файле ftl.
Привязать значение в файл шаблона.
Показать окончательную разметку HTML.

Struts 2 тега + файл шаблона темы (ftl) = окончательный код HTML-разметки.

Struts 2 использует фреймворк Freemaker в качестве движка шаблонов по умолчанию, все ftl-файлы пишутся скриптом freemaker. Не беспокойтесь, синтаксис freemarker почти на человеческом языке объясняет слова, его довольно легко выучить.

Работа с темой и шаблоном Struts 2

В этой статье вы создадите новую тему для настройки местоположения сообщения об ошибке. В стандартной теме «xhtml» сообщение об ошибке появится над именем поля.

Struts2 xhtml theme

В новой теме сообщение об ошибке будет отображаться рядом с полем ввода и выделено красным цветом.

Struts2 example theme

1. Извлечь тему

Все файлы темы и шаблона находятся в папке шаблоновstruts2-core.jar. Распакуйте его на свой локальный диск.

Файл ftl - это обычный текстовый файл, вы можете открыть его в любом текстовом редакторе.

2. Создать новую тему

Создайте новую папку, скопируйте все существующие файлы шаблонов xhtml (ftl) и поместите новую папку в папку ресурсов проекта.

Struts 2 theme folder

Чтобы понять, как Struts 2 находит папку с шаблоном темы, прочтите "ВыборStruts 2 template directory" для более подробной информации.

Часто вам просто нужно скопировать и изменить существующую тему «xhtml», если у вас нет причин не делать этого.

3. Определить новую тему

Определите «struts.ui.theme» и «struts.ui.templateDir», чтобы сообщить Struts 2, где найти новую тему и папку с шаблонами.

struts.xml


    ...
    
    
    ...

Теперь, когда Struts 2 видит «s:textfield», он найдет тему «example» вместо темы по умолчанию «xhtml». ПрочтитеStruts 2 select a theme для более подробной информации.

4. Изменить тему

Чтобы изменить существующий файл шаблона (ftl), вам может потребоваться битfreemarker syntax.

1. Создайте новый файлerror-message.ftl, чтобы отобразить сообщение об ошибке.

error-message.ftl

<#--
    Only show message if errors are available.
    This will be done if ActionSupport is used.
-->
<#assign hasFieldErrors = parameters.name?? && fieldErrors?? && fieldErrors[parameters.name]??/>
<#if hasFieldErrors>
<#list fieldErrors[parameters.name] as error>
   ${error?html}<#t/>

2. Изменитеcontrolheader.ftl, добавив новый класс «errorsBg» в тег «td», если есть ошибки.

controlheader.ftl

<#include "/${parameters.templateDir}/example/controlheader-core.ftl" />
    
    class="errorsBg" <#t/>

<#if parameters.align??>
    align="${parameters.align?html}"<#t/>

><#t/>

3. Изменитеcontrolheader-core.ftl, удалив множество ненужных тегов и добавив новый класс «errorsBg» к тегу «td», если ошибки существуют.

controlheader-core.ftl

<#--
    Only show message if errors are available.
    This will be done if ActionSupport is used.
-->
<#assign hasFieldErrors = parameters.name?? && fieldErrors?? && fieldErrors[parameters.name]??/>
<#--
    if the label position is top,
    then give the label its own row in the table
-->




-->
><#rt/>

<#if parameters.label??>
    
<#if parameters.id??>
        for="${parameters.id?html}" <#t/>

<#if hasFieldErrors>
        class="errorLabel"<#t/>
<#else>
        class="label"<#t/>

 ><#t/>

<#if parameters.required?default(false) && parameters.requiredposition?default("right") != 'right'>
    *<#t/>

${parameters.label?html}<#t/>
<#if parameters.required?default(false) && parameters.requiredposition?default("right") == 'right'>
    *<#t/>


<#t/>


<#lt/>

4. Изменитеtext.ftl, добавив новый файл шаблона «error-message.ftl» после «simple/text.ftl».

text.ftl

<#include "/${parameters.templateDir}/${parameters.theme}/controlheader.ftl" />
<#include "/${parameters.templateDir}/simple/text.ftl" />
<#include "/${parameters.templateDir}/example/error-message.ftl" />
<#include "/${parameters.templateDir}/xhtml/controlfooter.ftl" />

5. Поместите CSS на страницу просмотра, чтобы отформатировать сообщение об ошибке.

5. Готово, сохранено, теперь сообщение об ошибке будет отображаться рядом с полем ввода и выделено красным цветом.

Надеюсь, что эта статья может дать вам общее представление о том, как создать или изменить тему в Struts2.

TOC

Работа с темой Struts 2

Работа с темой и шаблоном Struts 2

Работа с темой и шаблоном Struts 2

1. Извлечь тему

2. Создать новую тему

3. Определить новую тему

4. Изменить тему

Ссылка

Related