Struts 2-테마 및 템플릿
이 장의 실제 튜토리얼을 시작하기 전에 다음과 같이 몇 가지 정의를 살펴 보겠습니다. https://struts.apache.org−
| Sr. 아니요 | 용어 및 설명 |
|---|---|
| 1 | TAG JSP, FreeMarker 또는 Velocity 내에서 실행되는 작은 코드입니다. |
| 2 | TEMPLATE 일반적으로 FreeMarker로 작성되며 특정 태그 (HTML 태그)로 렌더링 할 수있는 약간의 코드입니다. |
| 삼 | THEME 공통 기능을 제공하기 위해 함께 패키지 된 템플릿 모음입니다. |
또한 연습을 수행하기 위해 동일한 예제를 다시 사용할 것이므로 Struts2 Localization 장을 살펴볼 것을 제안 합니다.
사용할 때 Struts 2웹 페이지에서 <s : submit ...>, <s : textfield ...> 등과 같은 태그를 사용하면 Struts 2 프레임 워크는 미리 구성된 스타일과 레이아웃으로 HTML 코드를 생성합니다. Struts 2에는 세 가지 기본 제공 테마가 있습니다.
| Sr. 아니요 | 주제 및 설명 |
|---|---|
| 1 | SIMPLE theme "종소리와 휘파람"이없는 최소한의 테마. 예를 들어, textfield 태그는 레이블, 유효성 검사, 오류보고 또는 기타 형식이나 기능없이 HTML <input /> 태그를 렌더링합니다. |
| 2 | XHTML theme 이것은 Struts 2에서 사용하는 기본 테마이며 간단한 테마가 제공하는 모든 기본 사항을 제공하고 HTML에 대한 표준 2 열 테이블 레이아웃, 각 HTML에 대한 레이블, 유효성 검사 및 오류보고 등과 같은 여러 기능을 추가합니다. |
| 삼 | CSS_XHTML theme 이 테마는 간단한 테마가 제공하는 모든 기본 사항을 제공하고 HTML Struts 태그에 <div>를 사용하고 CSS 스타일 시트에 따라 배치 된 각 HTML Struts 태그에 대한 레이블을 사용하여 표준 2 열 CSS 기반 레이아웃과 같은 여러 기능을 추가합니다. . |
위에서 언급했듯이 테마를 지정하지 않으면 Struts 2는 기본적으로 xhtml 테마를 사용합니다. 예를 들어,이 Struts 2 select tag −
<s:textfield name = "name" label = "Name" />다음 HTML 마크 업 생성-
<tr>
<td class="tdLabel">
<label for = "empinfo_name" class="label">Name:</label>
</td>
<td>
<input type = "text" name = "name" value = "" id = "empinfo_name"/>
</td>
</tr>여기 empinfo struts.xml 파일에 정의 된 조치 이름입니다.
테마 선택
Struts 2, 태그 기준에 따라 테마를 지정하거나 Struts 2가 사용해야하는 테마를 지정하기 위해 다음 방법 중 하나를 사용할 수 있습니다.
특정 태그의 테마 속성
태그 주변 양식 태그의 테마 속성
"theme"라는 페이지 범위 속성
"theme"라는 요청 범위 속성
"theme"라는 세션 범위 속성
"theme"라는 애플리케이션 범위 속성
struts.properties의 struts.ui.theme 속성 (기본값은 xhtml)
다음은 다른 태그에 대해 다른 테마를 사용하려는 경우 태그 수준에서 지정하는 구문입니다.
<s:textfield name = "name" label = "Name" theme="xhtml"/>태그별로 테마를 사용하는 것은 그리 실용적이지 않기 때문에 간단히 규칙을 지정할 수 있습니다. struts.properties 다음 태그를 사용하여 파일-
# Standard UI theme
struts.ui.theme = xhtml
# Directory where theme template resides
struts.ui.templateDir = template
# Sets the default template type. Either ftl, vm, or jsp
struts.ui.templateSuffix = ftl다음은 설정과 함께 기본 테마를 사용한 현지화 장에서 가져온 결과입니다. struts.ui.theme = xhtml 에 struts-default.properties struts2-core.xy.z.jar 파일에 기본적으로 제공되는 파일입니다.
테마는 어떻게 작동합니까?
주어진 테마에 대해 모든 struts 태그에는 다음과 같은 연관된 템플릿이 있습니다. s:textfield → text.ftl 과 s:password → password.ftl 기타
이러한 템플릿 파일은 struts2-core.xy.z.jar 파일에 압축되어 있습니다. 이러한 템플릿 파일은 각 태그에 대해 미리 정의 된 HTML 레이아웃을 유지합니다.
이런 식으로, Struts 2 프레임 워크는 Sturts 태그 및 관련 템플릿을 사용하여 최종 HTML 마크 업 코드를 생성합니다.
Struts 2 tags + Associated template file = Final HTML markup code.기본 템플릿은 FreeMarker로 작성되며 확장자가 있습니다. .ftl.
Velocity 또는 JSP를 사용하여 템플릿을 디자인하고 그에 따라 struts.properties에서 구성을 설정할 수 있습니다. struts.ui.templateSuffix 과 struts.ui.templateDir.
새로운 테마 만들기
새 테마를 만드는 가장 간단한 방법은 기존 테마 / 템플릿 파일을 복사하고 필요한 수정을 수행하는 것입니다.
라는 폴더를 만드는 것으로 시작하겠습니다. template에서 의 WebContent / WEBINF / 클래스 와 우리의 새로운 테마의 이름을 가진 하위 폴더. 예를 들어 WebContent / WEB-INF / classes / template / mytheme 입니다.
여기에서 처음부터 템플릿 작성을 시작하거나 Struts2 distribution 나중에 필요에 따라 수정할 수 있습니다.
기존 기본 템플릿을 수정하겠습니다. xhtml학습 목적으로. 이제 struts2-core-xyzjar / template / xhtml 에서 테마 디렉토리로 컨텐츠를 복사하고 WebContent / WEBINF / classes / template / mytheme / control .ftl 파일 만 수정 하겠습니다. control.ftl을 열면 다음 줄이 있습니다.
<table class="${parameters.cssClass?default('wwFormTable')?html}"<#rt/>
<#if parameters.cssStyle??> style="${parameters.cssStyle?html}"<#rt/>
</#if>
>위의 파일을 변경하겠습니다. control.ftl 다음 내용을 가지려면-
<table style = "border:1px solid black;">확인한다면 form.ftl 그러면 당신은 그것을 찾을 것입니다 control.ftl이 파일에서 사용되지만 form.ftl은 xhtml 테마에서이 파일을 참조합니다. 따라서 다음과 같이 변경하겠습니다.
<#include "/${parameters.templateDir}/xhtml/form-validate.ftl" />
<#include "/${parameters.templateDir}/simple/form-common.ftl" />
<#if (parameters.validate?default(false))>
onreset = "${parameters.onreset?default('clearErrorMessages(this);\
clearErrorLabels(this);')}"
<#else>
<#if parameters.onreset??>
onreset="${parameters.onreset?html}"
</#if>
</#if>
#include "/${parameters.templateDir}/mytheme/control.ftl" />나는 당신이 그것에 대해 많이 이해하지 못할 것이라고 가정합니다. FreeMarker 템플릿 언어를 사용하더라도 .ftl 파일을 살펴보면 수행 할 작업에 대한 좋은 아이디어를 얻을 수 있습니다.
그러나 위의 변경 사항을 저장하고 현지화 예제로 돌아가서 WebContent/WEB-INF/classes/struts.properties 다음 내용이 포함 된 파일
# Customized them
struts.ui.theme = mytheme
# Directory where theme template resides
struts.ui.templateDir = template
# Sets the template type to ftl.
struts.ui.templateSuffix = ftl이제이 변경 후 프로젝트 이름을 마우스 오른쪽 버튼으로 클릭하고 Export > WAR FileWar 파일을 만듭니다. 그런 다음 Tomcat의 webapps 디렉토리에이 WAR을 배포합니다. 마지막으로 Tomcat 서버를 시작하고 URL에 액세스하십시오.http://localhost:8080/HelloWorldStruts2. 다음 화면이 생성됩니다.
xhtml 테마에서 복사 한 후 out 테마에서 변경 한 결과 인 양식 구성 요소 주변의 테두리를 볼 수 있습니다. FreeMarker를 배우는 데 약간의 노력을 기울이면 테마를 매우 쉽게 만들거나 수정할 수 있습니다.
이제 기본적인 이해가 되셨기를 바랍니다. Sturts 2 테마와 템플릿, 그렇지 않습니까?