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

最新推荐文章于 2021-04-18 23:21:50 发布
最新推荐文章于 2021-04-18 23:21:50 发布
阅读量209 收藏
点赞数
分类专栏： tapestry 文章标签： Tapestry IE XHTML HTML XML
[color=red]现在正在使用T5开发一个小项目。 因为现在T5还正处于发展中。 而且没有像T4一样有许多的文档。 和例子(Workbench, Vlib)。 所以我会把在这个开发中遇到的一些问题记录下来。[/color]

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

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

[code]<?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 & 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>[/code]


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

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

Layout.java

[code]package com.javaeye.dengyin2000.gtts.components;

public class Layout {

}
[/code]

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

AddOrEditDriver.html

[code]<?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>[/code]

所有的页面都是t:layout包括。 当然这部分页面会被layout组件render出来。
[b][color=red]
注意： 你最好是在你的所有的page template开头加上<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 这个部分。 要不然会遇到页面中如果有 之类的tag。 页面解析会报错。[/color][/b]
iteye_10104
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Bart_T5-summarization:使用Bart和T5模型的汇总任务
04-14
Bart_T5-摘要使用来自Bart和T5模型的汇总任务可以直接比较文本摘要Bart和T5的最佳模型。安装需求pip install -U transformerspip install -U torchpip install flask跑步python app.py巴特总结T5总结
徐庆辉：3分钟搞懂照明“效率”
01-20
如引用下面一段：“如果是T5格栅灯具，按70%的灯具效率，T5光源效率按104 LPW计算的话，就算不计算电器损耗，T5格栅灯具的整灯效率也就72.8 LPW,相对于130…这意味着…如果是二次反射灯盘，灯具效率也就50%,光源效率...
左右布局，左侧固定右侧自适应，全屏
u013285483的专栏
07-26 605
当元素出现在显示区域时元素向上滑动出现 .containter{ overflow: hidden; min-width:960px; min-height: 680px; } .aside{ width:300px; padding-bottom: 9000
BOS项目练习(流程定义/实例管理,bos用户角色同步activiti用户表组表)
逸轩
06-20 1606
内容： 1、提供新的json文件，修改系统菜单（加入工作流的菜单） 2、流程定义管理（查询、部署流程、查看png流程图片） 3、流程实例管理（查询、查看运行状态） 4、将bos系统中的用户数据和角色数据同步到activiti的用户表和组表   1.    提供新的json文件，修改系统菜单（加入工作流的菜单） 2.    流程定义管理 第一步：创建一
HTML参考 ：TBODY元素 详解
weixin_30414155的博客
08-08 335
TBODY 元素内包含的有效标签有： TD TH TR TBODY 元素会为全部表格自动定义，就算表格没有显式定义 TBODY 元素。 table 对象及其相关的元素有独立的表格对象模型，这与常规对象模型所采用的方法有很大不同。 此元素在 Microsoft? Internet Explorer 3.0 的 HTML 中可用，在 Internet Explorer 4.0 的脚本中可...
python银行管理系统
热门推荐
mzy1711231996的博客
04-18 1万+
题目 python  阶段案例-银行管理系统 P118 分析部分 代码部分 import random class bankUser: # 卡号，用户姓名，身份证号，手机，预存，密码 Count_id = "" Count_Name = "" Count_IDCard = "" Count_phone = "" Count_Money = 0.00 Count_password = "" Count_Root
页面布局实现局部的tbody部分竖向滚动条实现
Seeyoucm
01-02 1017
实际业务需求:实现表格内容的部分内容的滚动 具体实现如图,时间以上部分不会滚动,具体记录实现超过5条进行滚动 代码 页面布局 &amp;lt;table&amp;gt; &amp;lt;tr class=&quot;hasTh&quot;&amp;gt; &amp;lt;td&amp;gt;时间&amp;lt;/td&amp;gt;&amp;lt;td&amp;gt;奖
搜索引擎优化入门：前端性能优化
黑麦(Ryee) - 搜索引擎营销SEO 3.0
11-21 431
[b]一、为什么要做前端页面的优化？[/b] 搜索引擎优化总体来说会涉及两个层面的问题，1、爬虫效率 2、引擎爬虫带回去的索引页面内容。这两个方面相关联的恰恰都与前端页面有关。 首先要明确一点：网站是给人用的，用户体验第一位。前端开发工程师是将产品和后端开发的技术做衔接，做到人机交互的视觉表达（浏览器中）。 在兼容用户体验的前提下…… …… …… 才可进一步提升前端页面对搜索引擎...
t5-pegasus：中文生成式预训练模型
03-03
中文生成式预训练模型，以mT5为基础架构和初始权重，通过类似PEGASUS的方式进行预训练。 详情可见： ://kexue.fm/archives/8209 分词器 我们将T5 PEGASUS的令牌生成器转换成BERT的令牌生成器，它对中文更友好。同时...
T5:使用提取而不是拉入引擎
04-06
T5 使用提取而不是拉入引擎
T5-Model:使用T5（文本到文本的传输转换器）模型在笔记本上进行收集
03-11
T5-Model:使用T5（文本到文本的传输转换器）模型在笔记本上进行收集
用thead、tbody、tfoot实现漂亮的table布局
leng0920的博客
09-09 1967
//本文纯属复制，如有侵权，请告知删除，谢谢。。。 css案例学习之用thead、tbody、tfoot实现漂亮的table布局 首先说说thead、tbody、tfoot 无论前后顺序如何改变， 内的元素总是在表的最上面， 总在表的最下面 效果 代码如下 "-//W3C//DTD XHTML 1.0 Transitio
C++queue介绍及详细使用示例（源代码）
最新发布
05-23
deque（双端队列）是C++标准模板库（STL）中的一个容器，它支持在序列的两端（前端和后端）快速插入和删除元素。deque 通常在需要快速地在两端添加或移除元素，但又不想承受像 list 那样的额外开销时使用。 deque的主要特性： 双端操作：deque 允许在序列的前端和后端快速插入和删除元素。 内部引用：deque 通常不会将所有元素都存储在连续的内存块中，而是将元素存储在多个较小的、独立的内存块中，并通过内部引用机制来管理这些内存块。这使得 deque 在进行前端插入和删除操作时比 vector 更高效，因为 vector 在这些操作时需要移动所有元素。 迭代器：deque 支持双向迭代器，可以向前或向后遍历元素。 随机访问：尽管 deque 的元素不是连续存储的，但它仍然支持通过索引直接访问元素（类似于 vector）。
实验报告3.doc
05-23
实验报告3.doc
（基于Golang 1.18简单封装的Gorm分页插件）.zip
05-23
Go语言（也称为Golang）是由Google开发的一种静态强类型、编译型的编程语言。它旨在成为一门简单、高效、安全和并发的编程语言，特别适用于构建高性能的服务器和分布式系统。以下是Go语言的一些主要特点和优势： 简洁性：Go语言的语法简单直观，易于学习和使用。它避免了复杂的语法特性，如继承、重载等，转而采用组合和接口来实现代码的复用和扩展。 高性能：Go语言具有出色的性能，可以媲美C和C++。它使用静态类型系统和编译型语言的优势，能够生成高效的机器码。 并发性：Go语言内置了对并发的支持，通过轻量级的goroutine和channel机制，可以轻松实现并发编程。这使得Go语言在构建高性能的服务器和分布式系统时具有天然的优势。 安全性：Go语言具有强大的类型系统和内存管理机制，能够减少运行时错误和内存泄漏等问题。它还支持编译时检查，可以在编译阶段就发现潜在的问题。 标准库：Go语言的标准库非常丰富，包含了大量的实用功能和工具，如网络编程、文件操作、加密解密等。这使得开发者可以更加专注于业务逻辑的实现，而无需花费太多时间在底层功能的实现上。 跨平台：Go语言支持多种操作系统和平台，包括Windows、Linux、macOS等。它使用统一的构建系统（如Go Modules），可以轻松地跨平台编译和运行代码。 开源和社区支持：Go语言是开源的，具有庞大的社区支持和丰富的资源。开发者可以通过社区获取帮助、分享经验和学习资料。 总之，Go语言是一种简单、高效、安全、并发的编程语言，特别适用于构建高性能的服务器和分布式系统。如果你正在寻找一种易于学习和使用的编程语言，并且需要处理大量的并发请求和数据，那么Go语言可能是一个不错的选择。
请说一下：T5模型与Transformer的异同点
05-15
3. T5使用了更大规模的数据集和更多的训练步骤，以达到更好的性能。T5包含11亿个参数，而最初的Transformer只包含6层和6个自注意力头。 总之，T5是基于Transformer架构的文本到文本转换模型，相比于最初的...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值