동적 레이아웃을위한 FTL 템플릿을 작성하는 방법은 무엇입니까?

jsp 뷰를 생성하기 위해 freemarker 템플릿을 만들고 있습니다. 양식의 각 필드가 부동이고 열의 전체 너비를 차지하는 레이아웃을 2 열에서 사용합니다.동적 레이아웃을위한 FTL 템플릿을 작성하는 방법은 무엇입니까?

각 필드 유형은 필드를 쉽게 추가하고 제거하기 위해 독립적 인 FTL에 있습니다. 데이터를 채우기 위해 XML을 사용하여, FMPP와

<#if (data)?has_content> 
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> 
<%@ taglib prefix="s" uri="/struts-tags" %> 
<!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"> 
    <head> 
     <#include "estructura/Cabecera.ftl"> 
     <s:include value="${tipoFormulario}_${data.Artefacto.nombreSubModulo?lower_case}_scripts.jsp"></s:include> 
    </head> 
    <body> 

     <div class="" id="dim-listas"> 
      <s:fielderror /> 
     </div> 

     <s:form theme="simple" action="Mostrar${data.Artefacto.nombreSubModulo?cap_first}.action"> 

     <#-- Estructura en columnas, parseo usando CSS --> 
     <#list data.Artefacto.formulario.grupoCampos as grupoCampos> 
     <div class="grupoCampos" <#if grupoCampos[0][email protected][0]?has_content >id="${grupoCampos[0][email protected][0]!}"</#if> <#if grupoCampos[0][email protected][0]?has_content >style="${grupoCampos[0][email protected][0]!}"</#if>> 
      <#list grupoCampos?children as nodos> 

       <#if nodos?node_type = 'element' && chequearPermisos(nodos[0][email protected]ermiso[0]!"all")> 
        <#if ((nodos[0][email protected][0]!"todos") == 'todos' || (nodos[0][email protected][0]!"todos") == tipoFormulario)> 
         <div style="${nodos[0][email protected][0]!}" <#if nodos[0][email protected][0]?has_content>id="${nodos[0][email protected][0]!}"</#if> class="${nodos?node_name} ${nodos[0][email protected][0]!}"> 

          <#list nodos?children as campo> 
           <#if campo?node_type = 'element' && chequearPermisos(campo[0][email protected][0]!"all")> 
            <#if ((campo[0][email protected][0]!"todos") == 'todos' || (campo[0][email protected][0]!"todos") == tipoFormulario)> 
             <#switch campo?node_name> 
              <#case "subtitulo"> 
              <div class="subtitulo " style="${campo[0][email protected][0]!}">${campo[0]}</div> 
             <#break> 
              <#case "texto"> 
              <#-- campo de texto --> 
              <#include "campos/Campos Texto.ftl"> 
             </#switch> 
            </#if> 
           </#if> 
          </#list> 
         </div> 
        </#if>     
       </#if>   
      </#list> 
     </div> 
     </#list> 

     </s:form> 
     <#include "estructura/Pie.ftl">  
    </body> 
</html> 
<#else> 
<@pp.dropOutputFile /> 
</#if>

이 FTL 실행 :

FTL 템플릿은 다음과 같은 코드가 있습니다.

내가보기의 레이아웃을 조정해야 할 때 나는 데 문제는,이 레이아웃 형태로 2 열 설계되었으며 I을 수행해야한다 :

레이아웃에 머리글 또는 열을 추가
변화 배경 색상이나 이미지, 글꼴 크기 및 색상
내가 #IF으로 FTL을 복잡하게하지 않고 작업을 수행하는 방법을 모르는

헤더에 이미지를 추가 CSS의 각 부분을 표시한다 ~ 그러면 큰 xml을가집니다.

freemarket에는 레이아웃이 있습니까? 예를 들어 보거나 사용할 수 있습니까?

아이디어는 Java에서 웹 시스템과 간단한 웹 페이지의 단일 세트를 계속 사용하는 것입니다.

출처

2014-01-29 Aegis

이 문제를 구현하는 데있어 더 구체적으로 설명해야한다고 생각합니다. 너는 어떤 자세로 붙어 있니? 마찬가지로 손으로 편집 한 JSP/CSS로 원하는 것을 얻을 수 있다면 FMPP로 동일한 출력을 생성 할 수없는 이유는 무엇입니까? – ddekany

나는 손으로 편집 한 JSP로/CSS를 할 수 있지만 너무 많은 if와 레이블을 사용하지 않고 freemarker에서 어떻게하는지 모른다. 내가 내 질문을 향상 – Aegis

[Freemarker : 하위 변수의 동적 보간] 가능한 중복 (http://stackoverflow.com/questions/12392822/freemarker-dynamic-interpolation-of-sub-variables) –

레이아웃으로 사용할 프리 마스터 템플릿을 만들 수 있습니다. 템플릿에서 복잡한 논리뿐만 아니라 스타일을 포함시키고 자 할 것입니다.

다음은 현재 프로젝트에서 사용하고있는 레이아웃 템플릿의 예입니다.

<#include "../common/commonStyles.ftl"> 
<#if document.visuallyImpaired> 
    <link rel="stylesheet" type="text/css" href="css/visuallyImpaired/devLetterLayout.css" media="all" /> 
<#else> 
    <link rel="stylesheet" type="text/css" href="css/devLetterLayout.css" media="all" /> 
</#if> 

<table class="headerTable"> 
    <tbody> 
     <#if document.visuallyImpaired> 
      <tr> 
       <td class="visImpairedTitle"> 
        <#include "title.ftl"> 
       </td> 
      </tr> 
     </#if> 
     <tr> 
      <td class="headerSideColumn"> 
       <#include "bannerImage.ftl"> 
      </td> 
      <td class="headerCenterColumn"> 
       <#if !document.visuallyImpaired> 
        <#include "title.ftl"> 
       </#if> 
      </td> 
      <td class="headerSideColumn"> 
      </td> 
     </tr> 
     <tr> 
      <td class="letterDate"> 
       <#include "letterDate.ftl"> 
      </td> 
     </tr> 
    </tbody> 
</table>

은 기본 템플릿에서 당신은 당신이 만든 .ftl 템플릿에 끌어 당신의 변수에 대한 <#assign> 태그와 <#include> 태그를 사용합니다.

논리의 일부를 별도의 템플릿으로 분해하여 원본 페이지를 깨끗하게 유지할 수도 있습니다. <#list>에 <#assign>과 <#include>을 넣으면됩니다.

컬럼 수에 관해서 아직 아무 것도 발견하지 못했지만, <#assign columnCount=x>과 같은 것을 할 수 있고, 추가 할 변경 사항의 양을 제한하기 위해 <#include "tableColumn" + columnCount + ".css">을 할 수 있습니다.

<#local>을 사용하여 로컬 변수를 할당하고 매번 테이블이 동적으로 생성되는 경우 가지고있는 열 수를 결정하기 위해 카운터를 구현할 수도 있습니다.

출처

2016-10-03 16:00:02

동적 레이아웃을위한 FTL 템플릿을 작성하는 방법은 무엇입니까?

답변

관련 문제