让我们在本节中考虑Tapestry XML模板. XML模板是一个格式良好的XML文档.页面的表示(用户界面)层是XML模板.除了下面给出的项目之外，XML模板还有正常的HTML标记;

• Tapestry命名空间

• 扩展

• 元素

• 组件

现在让我们讨论详细说明.

Tapestry命名空间

Tapestry命名空间只不过是XML命名空间.应在模板的根元素中定义命名空间.它用于在模板中包含Tapestry组件和组件相关信息.最常用的命名空间如下 :

• xmlns:t ="https://tapestry.apache.org/schema/tapestry_5_4.xsd" - 它用于识别Tapestry的元素，组件和属性.

• xmlns:p ="tapestry:parameter" - 它是用于将任意代码块传递给组件.

Tapestry命名空间的示例如下 :

                              
Hello World
       refresh page     

扩展

扩展是在页面呈现阶段动态更改XML模板的简单而有效的方法.扩展使用$ {< name>}语法.有许多选项可以表达XML模板中的扩展.让我们看一些最常用的选项 :

属性扩展

它映射相应Page类中定义的属性.它遵循Java类规范中的Java Bean规范.它进一步忽略了属性名称的情况.让我们使用属性扩展来更改"Hello World"示例.以下代码块是修改后的Page类.

package com.example.MyFirstApplication.pages; public class HelloWorld {      // Java Bean Property    public String getName {       return "World!";    } }

然后，更改相应的XML模板，如下所示.

                                 
Hello ${name}
     

在这里，我们在Page类中将 name 定义为 Java Bean Property 并动态处理它在XML模板中使用扩展 $ {name} .

消息扩展

每个Page类可能有也可能没有资源文件夹中的关联属性文件 -  « page_name» .properties .属性文件是纯文本文件，每行具有单个键/值对(消息).让我们在 -

"/src/main/resources/com/example/MyFirstApplication/pages/helloworld.properties"中为HelloWorld页面创建一个属性文件，并添加一条"问候"消息.

Greeting = Hello

问候语消息可以在XML模板中用作 $ {message:greeting}

                                 
${message:greeting} ${name}
     

元素

Tapestry有一小部分要在XML模板中使用的元素.元素是在Tapestry命名空间下定义的预定义标签 :

https://tapestry.apache.org/schema/tapestry_5_4.xsd

每个元素都是为特定目的而创建的.可用的tapestry元素如下 :

< t:body>

当嵌套两个组件时，父组件的模板可能必须包装子组件的模板. < t:body>元素在这种情况下很有用. < t:body>的用途之一在模板布局中.

通常，Web应用程序的用户界面将具有公共页眉，页脚，菜单等.这些常用项目在XML模板中定义，它称为模板布局或布局组件.在Tapestry中，它需要由应用程序开发人员创建.布局组件只是另一个组件，位于components文件夹下，该文件夹具有以下路径 -   src/main/« java | resources»/« package_name»/components .

让我们创建一个名为 MyCustomLayout 的简单布局组件. MyCustomLayout的代码如下 :

                                  
Sample Web Application
       
${title}
                    
(C) 2016 TutorialsPoint.
     

package com.example.MyFirstApplication.components;  import org.apache.tapestry5.*; import org.apache.tapestry5.annotations.*; import org.apache.tapestry5.BindingConstants;  public class MyCustomLayout {    @Property    @Parameter(required = true, defaultPrefix = BindingConstants.LITERAL)       private String title; }

在MyCustomLayout组件类中，我们声明了一个标题字段，并且通过使用注释，我们将其设为必填项.现在，更改HelloWorld.html模板以使用我们的自定义布局，如下面的代码块所示.

   t:type = "mycustomlayout" title = "Hello World Test page"      xmlns:t = "http://tapestry.apache.org/schema/tapestry_5_4.xsd">    
${message:greeting} ${name}
 

我们在这里可以看到XML模板没有head和body标签. Tapestry将从布局组件和< t:body>中收集这些详细信息.布局组件的替换将由HelloWorld模板替换.一切都完成后，Tapestry将发出类似于下面指定的标记 :

                                  
Sample Web Application
       
Hello World Test Page
       
Hello World!
       
(C) 2016 TutorialsPoint.
     

布局可以嵌套.例如，我们可以通过包含管理功能来扩展我们的自定义布局，并将其用于管理部分，如下所示.

< t:container>

< t:container>是一个顶级元素，包含一个tapestry命名空间.这用于指定组件的动态部分.

例如，网格组件可能需要一个模板来标识如何在HTML中呈现其行 -  tr(和列td) table.

    ${name}    ${age} 

< t:block>

< t:block>是模板中动态部分的占位符.通常，块元素不呈现.仅，模板中定义的组件使用块元素.组件会将数据动态注入块元素并进行渲染.其中一个常见的用例是 AJAX .

块元素为要呈现的动态数据提供准确的位置和标记.每个块元素都应该具有相应的Java属性.只有这样才能动态渲染.块元素的id应遵循Java变量标识符规则.部分样本如下所示.

@Inject private Block block;    
${title}
       
Highly dynamic section
    I'v been updated through AJAX call    The current time is: ${currentTime}    

< t:content>

< t:content> element用于指定模板的实际内容.通常，所有标记都被视为模板的一部分.如果< t:content>如果指定，则只考虑其中的标记.设计人员使用此功能设计没有布局组件的页面.

< t:remove>

< t:remove>正好与内容元素相反. remove元素中的标记不被视为模板的一部分.它可以用于仅服务器注释和设计目的.

资产

资产是静态资源文件，如样式表，图像和JavaScript文件.通常，资产放在Web应用程序根目录/src/main/webapp 中.

Tapestry还将存储在 Java Classpath 中的文件视为资产. Tapestry提供高级选项，通过扩展选项将资产包含到模板中.

• 上下文 : 选项以在Web上下文中获取资源.

 < img src ="$ { context:image/tapestry_banner.gif}"alt ="Banner"/>

资产 : 组件通常将自己的资产与Java类一起存储在jar文件中.从Tapestry 5.4开始，在类路径中存储资产的标准路径是 META-INF/assets .对于图书馆，存储资产的标准路径是 META-INF/assets/« library_name»/. asset:还可以调用 context:扩展来从Web上下文中获取资源.

可以使用Inject和Path注释将资产注入Tapestry页面或组件. Path注释的参数是资产的相对路径.

  @Inject  @Path("images/edit.png" )私人资产图标;

路径参数还可以包含 AppModule.java 部分中定义的Tapestry符号.

例如，我们可以定义一个符号，skin.root，其值为context:skins/basic，并使用如下所示 :

@Inject @Path("images/edit.png") private Asset icon;

本地化

通过tapestry包含资源可提供额外的功能.一个这样的功能是"本地化". Tapestry将检查当前的语言环境并包含适当的资源.

例如，如果当前语言环境设置为 de ，则 edit_de.png

CSS

Tapestry具有内置样式表支持. Tapestry将注入 tapestry.css 作为核心Javascript堆栈的一部分.从Tapestry 5.4开始，tapestry还包括 bootstrap css框架.我们可以使用普通链接标记包含我们自己的样式表.在这种情况下，样式表应该位于Web根目录 -  /src/main/webapp/.

Tapestry提供高级选项，通过扩展选项将样式表包含到模板中，如前所述.

Tapestry还提供了导入注释，将样式表直接包含在Java类中.

@Import(stylesheet="context:css/site.css") public class MyCommonLayout { }

Tapestry提供了许多通过AppModule.java管理样式表的选项.一些重要的选项是 :

• 可以删除tapestry默认样式表.

@Contribute(MarkupRenderer.class) public static void deactiveDefaultCSS(OrderedConfiguration configuration) {    configuration.override("InjectDefaultStyleheet", null); }

• 也可以通过覆盖其路径来禁用Bootstrap.

configuration.add(SymbolConstants.BOOTSTRAP_ROOT, "classpath:/METAINF/assets");

• 启用动态最小化资产(CSS和JavaScript).我们还需要包含 tapestry-webresources 依赖项(在pom.xml中).

@Contribute(SymbolProvider.class) @ApplicationDefaults public static void contributeApplicationDefaults(    MappedConfiguration configuration) {       configuration.add(SymbolConstants.MINIFICATION_ENABLED, "true"); }     org.apache.tapestry    tapestry-webresources    5.4 

客户端JavaScript

当前一代Web应用程序在很大程度上依赖于JavaScript来提供丰富的客户端体验. Tapestry承认它并为JavaScript提供一流的支持. JavaScript支持深深植根于挂毯，并且在编程的每个阶段都可用.

早些时候，Tapestry过去只支持Prototype和Scriptaculous.但是，从版本5.4开始，tapestry完全重写了JavaScript层，使其尽可能通用，并为JQuery(JavaScript的事实库)提供了一流的支持.此外，tapestry鼓励基于模块的JavaScript编程，并支持RequireJS，这是AMD的一种流行的客户端实现(异步模块定义 -  JavaScript规范，以异步方式支持模块及其依赖).

位置

JavaScript文件是Tapestry应用程序的资产.根据资产规则，JavaScript文件放置在Web上下文/sr/main/webapp/下，或放在 META-INF/assets/location 下的jar中.

链接JavaScript文件

链接XML模板中JavaScript文件的最简单方法是直接使用脚本标记，即 :  < script language ="javascript"src ="relative/path/to/js"> .但是，tapestry不推荐这些方法. Tapestry提供了几个选项来链接页面/组件本身的JavaScript文件.其中一些在下面给出.

• @import annotation :  @import annotation提供了使用上下文表达式链接多个JavaScript库的选项.它可以应用于Page类及其方法.如果应用于Page类，则它适用于其所有方法.如果应用于Page的方法，它只适用于该方法，然后Tapestry仅在调用方法时链接JavaScript库.

@Import(library = {"context:js/jquery.js","context:js/myeffects.js"}) public class MyComponent {    // ... }

• JavaScriptSupport界面 :  JavaScriptSupport是由tapestry定义的接口，它有一个方法 importJavaScriptLibrary 来导入JavaScript文件.只需使用@Environmental注释声明和注释即可轻松创建JavScriptSupport对象.

@Inject @Path("context:/js/myeffects.js") private Asset myEffects;  @Environmental private JavaScriptSupport javaScriptSupport;  void setupRender() {    javaScriptSupport.importJavaScriptLibrary(myEffects); }

• 只能使用

@Inject private JavaScriptSupport javaScriptSupport; public MyServiceImpl(JavaScriptSupport support) {    // ... }

• addScript方法 : 这类似于JavaScriptSupport接口，只是它使用 addScript 方法，代码直接添加到页面底部的输出中.

void afterRender() {    javaScriptSupport.addScript(      "$('%s').observe('click', hideMe());", container.getClientId()); }

JavaScript堆栈

Tapestry允许组合一组JavaScript文件和相关样式表并用作一个单一的实体.目前，Tapestry包括基于Prototype和基于JQuery的堆栈.

开发人员可以通过实现 JavaScriptStack 接口开发自己的堆栈并在 AppModule中注册它的.java 的.注册后，可以使用 @import 注释导入堆栈.

@Contribute(JavaScriptStackSource.class) public static void addMyStack(   MappedConfiguration configuration) {       configuration.addInstance("MyStack", myStack.class); }  @Import(stack = "MyStack") public class myPage { }