`
dengyin2000
  • 浏览: 1229511 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

T5 技巧 3：使用“t::body”进行布局。

TapestryIEXHTMLHTMLXML 
阅读更多
现在正在使用T5开发一个小项目。 因为现在T5还正处于发展中。 而且没有像T4一样有许多的文档。 和例子(Workbench, Vlib)。 所以我会把在这个开发中遇到的一些问题记录下来。

我们知道在tapestry4的自带的例子中会有个Border组件。这个自定义的组件其实是起到了一个布局的作用。对网站的统一风格有很大的好处。但是在tapestry5中没有RenderBody这个组件。然而在tapestry5的文档中倒是有提怎样实现。请看http://tapestry.apache.org/tapestry5/tapestry-core/guide/templates.html， 但是作者也是随便提了提。

我们创建一个Layout组建。这个其实就是tapestry4中Border组建了。
Layout.html 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_0_0.xsd">   
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Gtts</title>
<link rel="stylesheet" type="text/css" href="../../css/main.css" media="screen" />
<link rel="stylesheet" type="text/css" href="../../css/print.css" media="print" />
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="css/ie6_or_less.css" />
<![endif]-->
<script type="text/javascript" src="../../js/common.js"></script>
<style type="text/css">
table.t-data-grid {
	border-collapse:collapse;
	border-left:1px solid silver;
	width:100%;
}

table.t-data-grid thead tr {
background:#990000 url(../../images/sprites.gif) repeat-x scroll 0pt -1300px;
color:white;
}

div.t-data-grid-pager span.current {
background:#FFFFFF none repeat scroll 0%;
border:1px solid #CCCCCC;
color:#CCCCCC;
padding:2px 5px;
text-decoration:none;
}

div.t-data-grid-pager a:hover {
background:#CC0000 none repeat scroll 0%;
color:#FFFFFF;
}

div.t-data-grid-pager a {
border:1px solid silver;
color:#CC0000;
font-size:medium;
margin-right:5px;
padding:2px 5px;
text-decoration:none;
}

div.t-data-grid-pager span.current {
border:1px solid silver;
color:black;
font-size:medium;
margin-right:5px;
padding:2px 5px;
text-decoration:none;
}
</style>
</head>
<body id="type-a">
<div id="wrap">

	<div id="header">
		<div id="site-name">Gtts</div>
		<div id="search">
			<form action="">
			<label for="searchsite">Site Search:</label>
			<input id="searchsite" name="searchsite" type="text" />
			<input type="submit" value="Go" class="f-submit" />
			</form>
		</div>
		<ul id="nav">
		<li class="first"><a href="#">Home</a></li>
		<li class="active"><a href="#">Products</a>
			<ul>
			<li class="first"><a href="#">Maecenas</a></li>
			<li class="active"><a href="#">Phasellus</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li class="last"><a href="#">Mauris at enim</a></li>
			</ul>
		</li>
		<li><a href="#">Client list</a>
			<ul>
			<li class="first"><a href="#">Maecenas</a></li>
			<li><a href="#">Phasellus</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li class="last"><a href="#">Mauris at enim</a></li>
			</ul>
		</li>
		<li><a href="#">Case Studies &amp; References</a>
			<ul>
			<li class="first"><a href="#">Maecenas</a></li>
			<li><a href="#">Phasellus</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li><a href="#">Phasellus</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li><a href="#">Phasellus</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li><a href="#">Phasellus</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li><a href="#">Phasellus</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li class="last"><a href="#">Mauris at enim</a></li>
			</ul>
		</li>
		<li class="last"><a href="#">Locations</a>
			<ul>
			<li class="first"><a href="#">Maecenas</a></li>
			<li><a href="#">Phasellus</a></li>
			<li><a href="#">Mauris sollicitudin</a></li>
			<li class="last"><a href="#">Mauris at enim</a></li>
			</ul>
		</li>
		</ul>
	</div>
	
	<div id="content-wrap">
	
		<div id="content">
		
			<!-- body goes here. -->
			<t:body/>
			
			<div id="footer">
			<p>作者：邓胤</p>
			<p><a href="mailto:deng.yin@gmail.com">邮箱</a> | <a href="http://dengyin2000.iteye.com">博客</a></p>
			</div>		
		</div>
	</div>

</div>
</body>
</html>



这其实是一个很普通的tapestry的页面模板。请注意123行的“<t:body/>”。这就是关键所在，当你使用这个Layout组建时， 组建body的内容就会被render到t:body的地方。

对应的，你需要再增加个page class， 虽然它在这里其实是个空壳。 但是你也可以定义参数之类的。 它是一个tapestry component（组件）

Layout.java 

package com.javaeye.dengyin2000.gtts.components;

public class Layout {

}


下面是怎样使用这个布局组件。

AddOrEditDriver.html 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<t:layout xmlns:t="http://tapestry.apache.org/schema/tapestry_5_0_0.xsd">
			<form  t:type="form" t:id="form" clientValidation="true" action="forms.html" method="post" class="f-wrap-1">
			
			<div class="req"><b>*</b> 为必填项</div>
			
			<fieldset>

			<h3>${action}司机</h3>
			<table width="100%" border="0">
				<tr>
					<td colspan="2">
						<div t:type="Message" />
						<t:errors/>			
					</td>
				</tr>
				<tr>
					<td>
						<label t:type="Any" for="name"><b><span class="req">*</span>姓名：</b>
						<input t:type="TextField" t:id="name"  validate="required" value="driver.name" label="姓名"  class="f-name" tabindex="1" /><br />
						</label>					
					</td>
					<td>
						<label t:type="Any" for="idCard"><b><span class="req">*</span>身份证：</b>
						<input t:type="TextField" t:id="idCard"  validate="required" value="driver.idCard" label="身份证"  class="f-name" tabindex="2" /><br />
						</label>					
					</td>
				 </tr>
				 <tr>
				 	<td>
						<label t:type="Any" for="carNo"><b><span class="req">*</span>车牌号码：</b>
						<input t:type="TextField" t:id="carNo"  validate="required" value="driver.carNo" label="车牌号码"  class="f-name" tabindex="3" /><br />
						</label>					
					</td>		
				 	<td>
						<label t:type="Any" for="telNo"><b><span class="req">*</span>电话：</b>
						<input t:type="TextField" t:id="telNo"  validate="required" value="driver.telNo" label="电话"  class="f-name" tabindex="4" /><br />
						</label>					
					</td>						
				 </tr>
				 <tr>
				 	<td>
						<label t:type="Any" for="national"><b>民族：</b>
						<input t:type="TextField" t:id="national"  value="driver.national" label="民族"  class="f-name" tabindex="5" /><br />
						</label>					
					</td>		
				 	<td>
						<label t:type="Any" for="carLong"><b>车长：</b>
						<input t:type="TextField" t:id="carLong"  value="driver.carLong" label="车长"  class="f-name" tabindex="6" /><br />
						</label>					
					</td>						
				 </tr>
				 <tr>
				 	<td>
						<label t:type="Any" for="carWidth"><b>车宽：</b>
						<input t:type="TextField" t:id="carWidth"  value="driver.carWidth" label="车宽"  class="f-name" tabindex="7" /><br />
						</label>					
					</td>		
				 	<td>
						<label t:type="Any" for="carHeight"><b>车高：</b>
						<input t:type="TextField" t:id="carHeight"  value="driver.carHeight" label="车高"  class="f-name" tabindex="8" /><br />
						</label>					
					</td>						
				 </tr>
				 <tr>
				 	<td colspan="2">
						<label t:type="Any" for="address"><b>住址：</b>
						<input t:type="TextField" t:id="address"  value="driver.address" label="住址" size="30"  class="f-name" tabindex="9" /><br />
						</label>					
					</td>	
				 </tr>			 		 
				<tr>
					<td colspan="2">
							<div class="f-submit-wrap">
							<input type="submit" value="修改" class="f-submit" tabindex="9" /><br />
							</div>						
					</td>
				</tr>			
			</table>
			
			</fieldset>
			</form>
</t:layout>


所有的页面都是t:layout包括。  当然这部分页面会被layout组件render出来。

注意： 你最好是在你的所有的page template开头加上<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 这个部分。 要不然会遇到页面中如果有&nbsp;之类的tag。 页面解析会报错。
分享到：
| T5 技巧 2：为Grid组件的每一行增加“删除 ...
评论
2 楼 dengyin2000 2007-08-31  
hitalang 写道
<form  t:type="form" t:id="form" clientValidation="true" action="forms.html" method="post" class="f-wrap-1"> 
中的action="forms.html"什么意思??


没有意思，  假的， tapestry  render会忽略这些属性。
1 楼 hitalang 2007-08-30  
<form  t:type="form" t:id="form" clientValidation="true" action="forms.html" method="post" class="f-wrap-1"> 
中的action="forms.html"什么意思??
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    Bart_T5-summarization:使用Bart和T5模型的汇总任务

    Bart_T5-摘要使用来自Bart和T5模型的汇总任务可以直接比较文本摘要Bart和T5的最佳模型。安装需求pip install -U transformerspip install -U torchpip install flask跑步python app.py巴特总结T5总结

    T5-Model:使用T5（文本到文本的传输转换器）模型在笔记本上进行收集

    3. **加载模型和分词器**：使用`T5Tokenizer`对文本进行分词，然后加载预训练的T5模型，例如`tokenizer = T5Tokenizer.from_pretrained('t5-base')`和`model = T5ForConditionalGeneration.from_pretrained('t5-base...

    迪文串口屏T5UIC1开发资料.rar

    7. **开发流程**：使用这些资料，开发者首先需要了解T5UIC1的硬件接口和基本操作，然后使用SDK中的工具和库来编写控制代码，最后将代码烧录到主控器中，通过串口与屏幕进行通信，实现所需的显示效果和交互功能。...

    谷歌FLAN-T5作者亲讲：5400亿参数，1800个任务，如何实现大语言模型“自我改进”_鲟曦研习社.pdf

    知识点3：Chain of Thought（CoT）是一种最新的Prompting机制，可以让语言模型有了自我改进的能力。 知识点4：谷歌研究者们推进了Instruction Tuning的性能水平，模型参数上升至540B，微调任务的数量高达1800多个。...

    GNUVario-TTGO-T5-website:GNUVario-TTGO-T5-网站

    【GNUVario-TTGO-T5-website:GNUVario-TTGO-T5-网站】是一个专注于GNUVario-E项目的在线资源平台，该平台致力于提供基于ESP32芯片的开源硬件设计和变量计的详细信息。这个项目的核心是将开源精神应用于电子工程领域...

    t5-pegasus：中文生成式预训练模型

    中文生成式预训练模型，以mT5为基础架构和初始权重，通过类似PEGASUS的方式进行预训练。 详情可见： ://kexue.fm/archives/8209 分词器 我们将T5 PEGASUS的令牌生成器转换成BERT的令牌生成器，它对中文更友好。同时...

    T5 CPU智能屏开发指南.rar

    8. **调试技巧**：在开发过程中，使用如串口终端工具进行调试是必不可少的。了解如何通过日志输出、断点调试、性能分析等手段定位和解决问题至关重要。 9. **固件更新**：当程序开发完成后，开发者需要学会如何将...

    T5L DGUSII 应用开发指南202007101

    本章详细讲解如何使用图形界面设计工具创建和编辑屏幕显示效果，包括按钮、文本框、图像等元素的布局和交互设计。 ### 第五章（假设存在）应用实例与调试 #### 5.x 实例分析及问题解决 通过实际应用案例，展示如何...

    官方驱动-索尼 T5数码相机说明书使用手册（中文版）-索尼相机,摄像机驱动.rar

    《索尼T5数码相机官方驱动及使用手册》 在摄影领域，索尼T5数码相机以其卓越的性能和便携性赢得了众多消费者的喜爱。为了确保用户能够充分利用这款设备，官方提供了驱动程序和使用手册，帮助用户更好地理解和操作...

    DGUS_V7624_T5L屏开发软件DWIN_

    【标题】"DGUS_V7624_T5L屏开发软件DWIN_"涉及的核心知识点是基于迪文科技（DWIN）的T5L液晶显示屏的开发，利用DWIN提供的专用开发工具进行屏幕设计和程序编写。这个软件适用于将T5L屏作为DGUS2系统的一部分来使用的...

    基于T5-small的问答模型 它实际上是QuestEval指标的一个组成部分，但可以按原样独立使用，仅用于 QA

    **如何使用T5-Small问答模型** 使用这个模型通常涉及以下步骤： 1. **预处理**：将输入问题和上下文文本转化为模型可理解的格式。 2. **编码**：将预处理后的输入馈送给T5-Small模型，模型将其转换为内部表示。 3....

    T5贴片二极管规格书.pdf

    【T5贴片二极管】是电子元器件中的一种，属于快速开关二极管，其型号为1N4448W。该二极管采用塑封塑料体设计，端子为可焊镀铅，符合MIL-STD-750标准的2026方法，便于自动插入和表面安装。二极管的极性在壳体上有明确...

    T5UIC2 开发指南_V20.pdf

    T5UIC2还支持通过SD或SDHC接口进行下载和配置，增加了数据交互的便捷性。 在用户界面表现方面，T5UIC2支持基本的绘图操作，如置点、连线、区域填充等。此外，它还支持丰富的UI元素显示，包括文本、图标、图片、...

    T5荧光灯管的详细参数

    T5荧光灯管是一种高效节能的照明设备，广泛应用于商业和工业照明中。以下是关于T5荧光灯管的一些详细参数和相关知识点： 1. **功率与电压**： - T5灯管的功率范围从14W到35W不等，这决定了其在不同场合下的应用。...

    东风风行T5 EVO汽车使用手册用户说明书pdf电子版下载.pdf

    东风风行T5 EVO是一款汽车产品，本部分的知识点将围绕这款汽车的使用手册展开，手册中涉及了汽车的安全驾驶、操作指南、保养维护等详细信息，旨在帮助车主更好地了解和使用车辆，确保行车安全。 首先，手册开头部分...

    T5Transformer_text_gen:使用Google T5文本生成功能生成的镜头很少

    本文将深入探讨Google的T5 Transformer模型在文本生成中的应用，以及如何在Jupyter Notebook环境下进行操作。 T5（Text-to-Text Transfer Transformer）是由Google在2019年提出的一种预训练语言模型，它旨在统一...

    Turbo T5产品介绍及使用说明

    在硬件配置方面，Turbo T5搭载了Samsung 667MHz CPU，内存为128MB，内置存储为256MB，并支持最大16GB的T卡扩展。其无线网络功能支持802.11b/g标准，可以轻松接入Wi-Fi网络。此外，设备还配备了SIRFIII代GPS芯片，...

    迪文T5L ASIC开发20191122.zip

    3. **驱动程序**：可能包含驱动库文件，例如C语言编写的API函数，这些函数可以方便地与T5L芯片进行通信，实现屏幕显示和触摸功能。 4. **示例代码**：为开发者提供已实现的功能示例，如初始化配置、触摸事件处理等...

Magicbox
Global site tag (gtag.js) - Google Analytics