注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

阿弥陀佛

街树飘影未见尘 潭月潜水了无声 般若观照心空静...

 
 
 

日志

 
 
关于我

一直从事气象预报、服务建模实践应用。 注重气象物理场、实况场、地理信息、本体知识库、分布式气象内容管理系统建立。 对Barnes客观分析, 小波,计算神经网络、信任传播、贝叶斯推理、专家系统、网络本体语言有一定体会。 一直使用Java、Delphi、Prolog、SQL编程。

网易考拉推荐

JSF中使用模板  

2012-02-12 10:51:49|  分类: JavaServer Faces |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

JavaServer Faces 2.0, the Complete Reference (Book)  Burns Ed
一. 模板功能
JSF(JavaServer Faces)使用视图声明语言(View Declaration Language)管理页面。其主要内容是:
1. 用JSF替代JSP;
2. 用XHTML语法管理页面;
3. 提供服务器端模板化支持,实现页面设计的层次化,即通过若干小的物理页面,组合实际视图,最大限度地实现标记代码的重用,消除视图之间的冗余;
4. 提供可扩展的标签库功能;
5. 通过不允许页面中使用Java代码,强制实现MVC(Model-Viewer-Controller)的分离。

二. 模板举例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//zh_CN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xthml"
         xmlns:ui="http://java.sun.com/jsf/facelets"
         xmlns:h="http://java.sun.com/jsf/html">
<!-- 主页面 -->
<ui:include src="http://hxfcalf.blog.163.com/blog/menubar.xml">
     <ui:param name="user" value="#{currentUser}"/> </ui:include>
<ui:include src="http://hxfcalf.blog.163.com/blog/sidebar.xml">
     <ui:param name="user" value="#{currentUser}"/> </ui:include>
<ui:include src="http://hxfcalf.blog.163.com/blog/summary.xml">
     <ui:param name="summary" value="#{currentUser}"/> </ui:include>
</html>
三. 模板化设计分为两个部分:
JSF中使用模板 - 险峰 - 阿弥陀佛
1. 模板(temp1.xhtml)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//zh_CN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xthml"
         xmlns:ui="http://java.sun.com/jsf/facelets"
         xmlns:h="http://java.sun.com/jsf/html">
<head>
     <meta http-equiv="Content-Type" content="text/html"; charset="utf-8" />
     <title> <ui:insert name="title"> 标题占位 </ui:insert> </title>
     <link href="http://hxfcalf.blog.163.com/blog/css/vt.css" rel="stylesheet" media="screen" />
</head>
<body>
     <table width="100%" boder="0">
            <tr>
                 <td>
                       <h1 align="center">
                             <img src="http://hxfcalf.blog.163.com/blog/image/logo.jpg" width="92" hight="110" />
                             本页来自四川农村信息网新闻模板文件
                       </h1>
                 </td>
            </tr>
            <tr>
                  <ui:insert name="title"> 正文占位 </ui:insert>
            </tr>
     </table>
</body>
</html>
2. 客户端代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//zh_CN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xthml"
         xmlns:ui="http://java.sun.com/jsf/facelets"
         xmlns:h="http://java.sun.com/jsf/html"
         xmlns:f="http://java.sun.com/jsf/core">
<body>
<ui:composition template="temp1.xhtml">
     <ui:define name="title"> 今日要闻 </ui:define >
     <ui:define name="body">
            <table width="70%">
                <tr>
                      <td width="40%"> 姓:</td>
                      <td
width="60%">
                             <input type"text" jsfc="h:inputText" required="true" id="fname" value="#{UserBean.firstname}" />
                             <h:message for="fname"/>
                      </td>
                </tr>
                <tr>
                      <td width="40%">名:</td>
                      <td
width="60%">
                             <input type"text" jsfc="h:inputText" required="true" id="lname" value="#{UserBean.lastname}" />
                             <h:message for="lname"/>
                             <span jsfc="h:message" for="fname"> 消息</span>
                      </td>
                </tr>
            </table>
     </ui:
define >
</ui:composition>
</body>
</html>
四. 模板标签(6个。分别是ui:composition , ui:decorate,ui:define,ui:insert,ui:include,ui:param)
1. <ui:composition template="文件名">
可以用于客户端。
_template.xhtml
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//zh_CN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xthml"
         xmlns:ui="http://java.sun.com/jsf/facelets"
         xmlns:h="http://java.sun.com/jsf/html"
         xmlns:f="http://java.sun.com/jsf/core">
<ui:composition template="_template.xhtml">
    <ui:define name="body">
          <h:panelGrid columns="2">
              <h:outputFormat value="#{bundle.greetingMessage}">
                     <f:param  value="#{bundle.salutation}"/>
                     <f:param  value="#{bundle.firstname}"/>
              </h:outputFormat>   
              <h:outputText value="#{user.status}">
          </h:panelGrid>
    <ui:define>
</ui:composition>
</html>
1.2 模板与客户端混用
greeting.xhtml
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//zh_CN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xthml"
         xmlns:ui="http://java.sun.com/jsf/facelets"
         xmlns:h="http://java.sun.com/jsf/html"
         xmlns:f="http://java.sun.com/jsf/core">
<f:view locale=“zh_CN”>
<body>
<ui:composition template="_header.xhtml">
    <ui:define name="header">
          <f:param  name="companyName" "#{company.name}"/>
   </ui:define>
</ui:composition>
<ui:insert name="body"> _template.xhtml 正文占位
</ui:insert>

<ui:decorate template="_sidebar_topstory.xhtml"/>
<ui:decorate template="_sidebar_seconstory.xhtml"/>
<ui:include src="http://hxfcalf.blog.163.com/blog/_privacy.xhtml">
    <ui:param name="user" value= "#{user.name}"/>
</ui:include>
</body>
</f:view>
</html>

五. 非模板标签
ui:compoment,
ui:fragement,
ui.remove  开发阶段用于“注释” 掉一段标记。
ui:debug    开发阶段弹出调试代码
  评论这张
 
阅读(1671)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017