JSF中facelets的使用以及JSF国际化问题

一》facelet简介:facelet是为 JSF 组件模型度身定制的模板化语言,说白了就是页面的模板,我们可以先把页面的整个框架的样式搭建起来,动态的部分我们可以直接去引用。这样就可以减少很多重复代码的编写。虽然是这样的一个意思,但是facelet本身与JSF的生命周期都有很高的结合度,使用 Facelets,生成的模板会构建组件树,而不是 servlet。这就允许更好的重用,因为可以把组件组合成另一个组件。

二》facelet用法:首先是标签库的插入

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html">
模板页面:在模板页面我们主用是用到<ui:insert/>标签,我们可以在标签中直接用<ui:include/>引用页面,也可以空置。请看下面的例子:

     <f:view locale="zh_CN">
        <f:loadBundle basename="messages" var="msgs"/>
        <h:head>
            <title><ui:insert name="title"/></title>
        </h:head>
        <h:body styleClass="template_body" onload="nowtime()">
            <div id="top_status">
                <ui:insert name="status">
                    <ui:include src="status.xhtml"/>
                </ui:insert>
            </div>
            <div id="top_navigation">
                <ui:insert name="navigation">
                    <ui:include src="menu.xhtml"/>
                </ui:insert>
            </div>
            <div id="content">
                <ui:insert name="content"></ui:insert>
            </div>
            <div id="bottom">
                <ui:insert name="bottom">
                    <ui:include src="footer.xhtml"/>
                </ui:insert>
            </div>
        </h:body>
    </f:view>
动态页面:当模板页面生成出来后,我们可以动态生成各页面。首先我们需要用<ui:composition template="template.xhtml"/>标签引入上面的模板页。然后在用<ui:define/>标签动态定义页面的内容。例子如下:

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
    <body>
        <ui:composition template="template.xhtml">
            <ui:define name="title">
                动态页面
            </ui:define>
            <ui:define name="content">
                <h:form>
                    <h:panel header="动态页面">
                </h:form>
            </ui:define>
        </ui:composition>
    </body>
</html>
页面样式以及脚本:对于样式以及脚本的引入一般都是放在模板页面的<head>标签内,这样只要引用了模板的页面都可以引用到。

三》JSF国际化的问题

首先必须定义国家化配置文件,名称格式为xxx_language.properties,例如message_en.properties,message_zh_CN.properties,然后我们之需要在模板页面引入就可以了,可以参考最上面的template.xhtml页面

<f:loadBundle basename="messages" var="msgs"/>
当我们需要初始化本地local时,只需要在加上下面这句话
<f:view locale="zh_CN">
在具体使用时,只需要调用定义的语言就可以了,下面给个完整的例子

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.prime.com.tr/ui">
    <f:view>
        <f:loadBundle basename="messages" var="msgs"/>
        <h:head>
            <title>#{msgs['login.logo']}</title>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <link rel="stylesheet" href="../resources/css/login.css" type="text/css"/>
        </h:head>
        <h:body>
            <h:form>
                <p:panel header="#{msgs['login.logo']}" styleClass="loginPanel">
                    <h:panelGrid columns="2" styleClass="panelGrid" footerClass="footerCss" id="logingrid">
                        <h:outputLabel value="#{msgs['login.username']}:"/>
                        <h:inputText value="#{userLogin.name}" required="true"/>
                        <h:outputLabel value="#{msgs['login.userpasswd']}:"/>
                        <h:inputSecret value="#{userLogin.passwd}" required="true" maxlength="12"/>
                        <h:outputLabel value="" rendered="#{userLogin.loginreeorstrrender}"/>
                        <h:outputText value="#{userLogin.loginreeorstr}" rendered="#{userLogin.loginreeorstrrender}"  styleClass="message"/>
                        <f:facet name="footer">
                            <h:commandButton styleClass="button" value="#{msgs['login.submit']}" action="#{userLogin.loginCheck}"/>
                            <h:commandButton styleClass="button" value="#{msgs['login.cancel']}"/>
                        </f:facet>
                    </h:panelGrid>
                </p:panel>
            </h:form>
        </h:body>
    </f:view>
</html>
而国际化的文件定义很简单,比如首先是一个en语言的

login.logo = Login
login.username = User Name
login.userpasswd = Password
login.userpermiss = Permission
login.administrator = Administrator
login.operator = Operator
login.viewer = Viewer
login.submit = Submit
login.cancel = Cancel
然后是zh_CN语言的

login.logo = 登录
login.username = 用户
login.userpasswd = 密码
login.userpermiss = 权限
login.administrator = 管理员
login.operator = 操作员
login.viewer = 监视员
login.submit = 确定
login.cancel = 取消

这是一点JSF的使用经验!

你可能感兴趣的:(UI,JSF,insert,include,facet,stylesheet)