Facelets介绍,第三部分

最新推荐文章于 2024-11-02 11:32:21 发布
最新推荐文章于 2024-11-02 11:32:21 发布
阅读量423 收藏
点赞数
分类专栏： JSF 文章标签： ui components tree jsf xhtml include

原文：http://blog.csdn.net/leeshaoqun/article/details/1126490

译：JSF-OPENDOC team的巨土无比

这是Facelets系列文章中的第三部分，是用另外一种视图技术来创建JSF应用。Facelets是一个强大的模板化系统，它能让你用HTML风格的模板来定义JSF视图，并能够减少那些适合于集成在视图中的组件的代码数量，而且不需要web容器。这篇文章解释了你如何能够用Facelets在你的JSF工程里面创建模板。

对任何一种想要成功的视图技术来说，它必须拥有一些创建模板和重用的功能，而且必须好用又易懂。对于JSF来说，Facelets技术完美的解决了这个问题，并且延续了传统的、基于标签的UI风格。这篇文章包括了一些增加重用和简化维护JSF工程的方法。

当人们第一次开始创建网页的时候，他们经常发现自己在多个文件中重复相同的内容。作为一个开发人员来说，当你开始用面向对象的思想来开发的时候，这样的重复劳动会让人很灰心丧气。难道把这些内容简单地维护在一个地方不是更漂亮吗？

开始

模板化和重用的第一步是创建一个模板。一个网页通常由一些基本的部分组成：header, body,和footer。用Facelets，你能把这些通用的元素放在一个单独的页面里，并创建一个带有可编辑区的模板，如下面的模板所示：

<!-- template.xhtml -->     
	<!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"      
                         xmlns:ui="http://java.sun.com/jsf/facelets">  
<head>     
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />     
	<title>Sample Template</title>  
</head>  
<body>     
	<h1>#{title}</h1>     
	<div><ui:insert name="menu"/></div>     
	<p><ui:insert name="body"/></p>    
</body>  
</html>

对于menu和body来说，<ui:insert/> 标签用来标记这块地方的内容会根据每一页变化。你可以用这个模板来创建其他的页面，并给menu和body区域提供不同的内容。

<!-- template-client.xhtml -->     
	<!-- content above will be trimmed -->     
	<ui:composition template="template.xhtml">       
		<ui:param name="title" value="Here's my Title"/>       
		<ui:define name="menu">Here's My Menu</ui:define>       
		<ui:define name="body">Here's My Body</ui:define>       
	</ui:composition>     
<!-- content below will be trimmed -->

这个例子介绍了另外一个标签<ui:composition/>。该标签提供了一对特征。它删掉了它外面的任何内容，就是说，你可以写一些普通的HTML页面，而Facelets将只是用或者 显示出现在<ui:composition/>标签里面的内容。使用这个标签，你同样可以选择提供一个模板的属性，该属性将定义内容如何或在哪里显示。

为了把内容和模板配对，<ui:define/>标签的name属性和模板中的<ui:insert/>标签的name属性一致的就可以替换。为了简便地传递变量或者文字，你可以使用<ui:param/>标签，该标签把其value属性作为模板中的一个变量来替代。

当Facelets使用指定的模板呈现该页面时候，你将会得到以下的输出：

<!-- template.xhtml -->     
	<!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"     
                                    xmlns:ui="http://java.sun.com/jsf/facelets">  
<head>    
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />    
	<title>Sample Template</title>  
</head>
<body>     
	<h1>Here's my Title</h1>     
	<div>Here's My Menu</div>  
   <p>Here's My Body</p>    
</body>  
</html>

前面的这个例子能够被更加简化，如果在模板中只有一个地方是可变的:

<!-- simple-template.xhtml -->     
	... 
<body>     
	<h1>Title</h1>     
	<!-- editable body -->     
	<p><ui:insert/></p>  
</body>     
	...

想要用上面模板的页面就可以简化成下面：

<!-- simple-template-client.xhtml -->     
	<ui:composition template="simple-template.xhtml">     
	Here's My Simple Body    
</ui:composition>

使用Includes

页面中的位置这个概念在页面中定义可重用的内容是相当强大的。上面几个例子展示了如何使用模板中的位置来显示内容。但是如果你想从另一个页面中包含进来一些东西该如何做呢？可能这里有一系列的表单控件或者一个复杂的菜单，以至于你宁愿把它们分离到一个不同的文件中，以便重用或者单独管理而不用散乱在页面布局的各个角落。

总的来说，Facelets提供了两种包含位置或者其他页面的方法。第一种是用<ui:include/>标签，对于web开发人员来说，该标签应该是相当熟悉的：

<!-- include.xhtml -->     
	...     
	<span id="leftNav">     
		<ui:include src="/WEB-INF/siteNav.xhtml"/>    
 </span>     
	...
<!-- siteNav.xhtml -->     
	..     
	<ui:composition>    
 <!-- myfaces tomahawk components -->     
		<t:tree2 value="#{backingBean.options}" var="opt">    
		 ...     
			</t:tree2>    
 </ui:composition>    
	 ...

当Facelets处理include.xhtml时，siteNav.xhtml的所有<ui:composition/>中的内容将被包含进include.xhtml：

<!-- include.xhtml -->     
	...   
	<span id="leftNav">    
	 <!-- myfaces tomahawk components -->  
	   <t:tree2 value="#{backingBean.options}" var="opt">     
		...     
		</t:tree2>   
	</span>   
	...

如果你愿意给siteNav.xhtml传递变量，这些变量供tree组件使用，那么你可以使用<ui:param/>标签：

<!-- include.xhtml -->    
	 ...   
	<span id="leftNav">     
		<ui:include src="/WEB-INF/siteNav.xhtml">    
		 <ui:param name="menuBean" value="#{backingBean.options}"/>     
		</ui:include>   
	</span> 
  ...
<!-- siteNav.xhtml -->     
	...    
	 <ui:composition>    
		 <!-- myfaces tomahawk components -->    
	 	<t:tree2 value="#{menuBean}" var="opt">    
		 ...     
		</t:tree2>     
	</ui:composition>     
	...

你能够看到现在siteNav.xhtml可以使用变量menuBean并且menuBean是通过<ui:include/>标签来传递的。这样使一些灵活的可重用的通用组件和内容成为了可能。

对于<ui:include/>和<ui:param/>，Facelets提供了一个更加简洁的解决方案，通过支持自定义标签。别急，你不需要自己写任何一点java代码。为了给siteNav.xhtml定制一个可重用的标签，你必须创建一个简单的XML标签库文件。

<facelet-taglib>     
	<namespace>">http://www.mycompany.com/jsf</namespace>    
 <tag>     
		<tag-name>siteNav.xhtml</tag-name>     
		<source>/WEB-INF/tags/siteNav.xhtml</source>    
 </tag>  
</facelet-taglib>

除了在你的新标签库XML文件中制定Facelets外，你可能需要添加尽可能多的标签到新的标签库中。通过指定http://www.mycompany.com/jsf作为命名空间，你可以这样写：

<!-- include-tag.xhtml -->  
	...    
	<span id="leftNav">     
		<my:siteNav menuBean="#{backingBean.options}"/> 
 </span>  
	...

这个include-tag.xhtml例子和前面的include.xhtml例子效果一样。MenuBean的属性作为siteNav.xhtml的一个属性将生效，就像<ui:param/>传递的那样。

你的工程可能包括了一个jar文件，其中包括了所有的自定义标签库，或者只是简单的把自定义标签库放到了一个文件加里。更多的标签在Facelets Developer Documentation中详细描述.


EmmaGood
关注
专栏目录
Facelets介绍,第一部分
EmmaGood的专栏
08-21 686
原文：http://blog.csdn.net/leeshaoqun/article/details/1126474 这是关于Facelets文章系列的第一部分，Facelets是用来建立JSF应用程序时的一个可供选择的表现层技术。Facelets提供了一个强有力的模板化系统，让你使用HTML样式的模板来定义JSF的表现层，减少了组件整合进表现层时候冗余的代码，而不需要一个web容器
Facelets介绍,第二部分
EmmaGood的专栏
08-21 1214
原文：http://blog.csdn.net/leeshaoqun/article/details/1126484 Facelets文章系列的第二篇，Facelets是用来建立JSF应用程序时的一个可供选择的表现层技术。第一篇文章提供了Facelets的介绍。在这篇文章中，Jacob将会告诉你如何在JSF应用中开始使用Facelets。 准备开始 Facelets是作为JS
深入Facelets-第三部分：创建模板和重用
wyh6635
06-11 87
Inside Facelets - Part 3: Templating and Re-Use 深入Facelets-第三部分：创建模板和重用 by JavaFeng 这是Facelets系列文章中的第三部分，是用另外一种视图技术来创建JSF应用。Facelets是一个强大的模板化系统，它能让你用HTML风格的模板来定义JSF视图，并能够减少那些适合于集成在视图中的组...
Facelets介绍
im056的专栏
07-02 1913
这是关于Facelets文章系列的第一部分，Facelets是用来建立JSF应用程序时的一个可供选择的表现层技术。Facelets提供了一个强有力的模板化系统，让你使用HTML样式的模板来定义JSF的表现层，减少了组件整合进表现层时候冗余的代码，而不需要一个web容器。在这篇文中，Jacob将会介绍Facelets，解释一些Facelets的特性，还有他创建这个project的缘由。这个系列文章的
facelets_Facelets像手套一样适合JSF
cusi77914的博客
07-02 294
最近，在从事Java™Server Faces（JSF）项目时，我很高兴第一次使用Facelets。 我最喜欢Facelets的地方是它使我可以创建可重复使用的合成组件。 从那以后，能够接受一个页面（如JSP）并将其转换为组件一直是我的JSF开发的一大福音。 我的结论呢？ 如果您不使用Facelets，那么您将无法充分利用JSF。 JSF和JavaServer Pages技术之间的不匹配是...
Facelets 非常适合 JSF(第一部分)
MyJSF的专栏
11-17 1600
Facelets 非常适合 JSF(第一部分)以下内容转自互联网!试图把 JSF 和 JSP 结合起来就像试图要把脚硬塞进手套一样：可能做得到，但是只是更好的解决办法出现之前的一个权宜之计。在这篇文章中，JSF 的热心支持者 Rick Hightower 介绍了关于 Facelets 他最喜欢的内容：容易的 HTML 样式的模板化和可重用的复合组件。由于最近在 Java™ 服务器外观（JSF）项目
Facelets非常适合JSF(第二部分)
MyJSF的专栏
11-17 1181
Facelets 非常适合 JSF(第二部分) 　　以下内容转载自互联网！！ 　　现在通过 column.xhtml 示例已经快速查看了复合组件。下面一步一步地介绍创建复合组件的过程。以下是创建复合组件的步骤： 　　创建 Facelets 标记库。 　　在 web.xml 中声明标记库。 　　用命名空间导入标记文件。 　　标记文件 是符合 facelet_taglib_1_0.dtd 的文件。在概
《Java EE 7精粹》—— 第3章 JSF 3.1 Facelets
weixin_34379433的博客
05-02 81
本节书摘来异步社区《Java EE 7精粹》一书中的第2章，第2.1节，作者：【美】Arun Gupta，更多章节内容可以访问云栖社区“异步社区”公众号查看。 第3章 JSF JSF是基于Java的Web应用程序开发的服务器端用户界面（UI）框架。使用JSF可以实现： 使用遵循模型-视图-控制器（MVC）设计模式的可重用的UI组件集合来创建网页。 绑定...
JSF —— Facelets 标签
tuxq5721
11-13 2738
最初是作为对JSF 1.x中基于JSP的视图处理程序的替代而开发的。在JSF2.0中，Facelets作为JSF的默认视图技术来替换JSP。除了是一种更好的视图处理程序外，Facelets还支持大量用于模板化和其他目的的标签。   命名空间： xmlns:ui="http://java.sun.com/jsf/facelets"   Facelet
netbeans_Facelets_Seam_Ejb3编程入门
04-11
- **EJB3**：即Enterprise JavaBeans的第三版，是Java平台企业版（Java EE）的一部分，用于构建可移植的企业级应用组件。EJB3简化了EJB模型，引入了轻量级POJO（Plain Old Java Object）风格的组件，使得开发更加...
jsf 1.2 myfaces1.2.7 richfaces3.3.1 facelets1.2 所有的最新包
07-23
3. **facelets-1.2.jar**：Facelets的实现，用于构建JSF视图。 4. **jsf-api-1.2.jar** 和 **jsf-impl-1.2.jar**：JSF 1.2的API和实现库，分别定义了JSF的接口和提供了实现。 5. 可能还有其他的依赖库，如`javax....
Core JSF第三版：深入探索Facelets与组件应用
在Core JSF第三版中，Facelets作为JSF的默认视图描述语言，被用来创建和组织UI页面。例如，`page.xhtml`文件展示了如何通过Facelets定义页面布局。 书中详细讨论了TEXTFIELD组件，它是用于输入文本的基本元素。在`...
NetBeans下Facelets、Seam和EJB3集成开发入门指南
NetBeans 是一个功能强大且流行的集成开发环境（IDE）， Facelets 是一个基于 JavaServer Faces（JSF）规范的模板引擎，Seam 是一个基于 EJB3 和 JSF 的应用程序框架，而 Ejb3 是 Enterprise JavaBean 的第三个版本...
PyQt5实战——多脚本集合包，UI以及工程布局（二）
LyricalRover的博客
11-01 793
本文主要讲述了作者的UI页面以及工程文件的布局，提前规划好UI页面的布局有利于后续各组件的摆放以及是否要限制组件的大小，设计好工程文件的布局有利于后期维护工程以及减少开发工作量，一些重复性的代码可封装起来，作者介绍了自己工程布局的思想
WPF 行为转命令
qq_44967213的博客
10-30 933
通过将行为转换为命令，可以在WPF应用程序中更加灵活地处理交互行为与业务逻辑之间的关系，充分利用命令的结构化特点和行为的灵活性，提高代码的可维护性和可扩展性。
Flutter 简述(1)
最新发布
起司锅仔的博客
11-02 343
Flutter是Google开源的应用框架，只要一套代码兼顾Android、iOS、Web、Windows、macOS和Linux六个平台，它的设计思路可以说更加先进，不像ReactNative每个组件都需要有对应的原生组件实现，而是通过skia或者其他的渲染引擎来直接渲染画面，Flutter使用dart虚拟机来实现跨平台管理UI。
「Qt Widget中文示例指南」如何实现窗口嵌入？
需要界面开发、IDE工具研发中文教程资料的小伙伴，记得私信我~
11-01 965
本文中的示例主要演示如何将非Qt UI元素嵌入到Qt应用程序中，欢迎下载最新版组件体验~
「Mac畅玩鸿蒙与硬件15」鸿蒙UI组件篇5 - Slider 和 Progress 组件
weixin_44217688的博客
10-30 826
Slider 和 Progress 是鸿蒙系统中的常用 UI 组件。Slider 控制数值输入，如音量调节；Progress 显示任务的完成状态，如下载进度。本文通过代码示例展示如何使用这些组件，并涵盖 进度条类型介绍、节流优化、状态同步 和 定时器动态更新。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值