Tapestry4应用指南-安装及实例

1.安装

1.1.ApplicationServlet配置
在应用配置文件web.xml中增加

<? xml version="1.0" encoding="UTF-8" ?>
<! DOCTYPE web-app
      PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
      "http://java.sun.com/dtd/web-app_2_3.dtd" >

< web-app >
   < display-name > Tapestry Tutorial: Hello </ display-name >
   < servlet >
     < servlet-name > tapestryGuide1 </ servlet-name >
     < servlet-class > org.apache.tapestry.ApplicationServlet </ servlet-class >
     < load-on-startup > 0 </ load-on-startup >
   </ servlet >
   < servlet-mapping >
     < servlet-name > tapestryGuide1 </ servlet-name >
     < url-pattern > /app </ url-pattern >
   </ servlet-mapping >
</ web-app >

1.2增加tapestry所需Jar包

backport-util-concurrent-3.1.jar
commons-beanutils-1.7.0.jar
commons-codec-1.3.jar
commons-fileupload-1.2.jar
commons-io-1.4.jar
commons-lang-2.3.jar
commons-logging-1.0.3.jar
commons-pool-1.4.jar
hivemind-1.1.1.jar
hivemind-lib-1.1.1.jar
javassist-3.6.ga.jar
ognl-2.7.2.jar
oro-2.0.8.jar
tapestry-contrib-4.1.5.jar
tapestry-framework-4.1.5.jar

1.3新建Home页面

< html >
   < head >
     < title > Tutorial: HelloWorld </ title >
   </ head >
   < body >
     < h1 > HelloWorld Tutorial </ h1 >
    
< p >
  The current data and time is: 
   < strong >< span  jwcid ="@Insert"  value ="ognl:new java.util.Date()" > June 26 2005 </ span ></ strong >
</ p >     

< p >
   < a  href ="#"  jwcid ="@PageLink"  page ="Home" > refresh </ a >
</ p >
    
   </ body >
</ html >

1.4页面规范Home.page

<? xml version="1.0" encoding="UTF-8"  ?>
<! DOCTYPE page-specification PUBLIC
  "-//Apache Software Foundation//Tapestry Specification 4.1//EN"
  "http://jakarta.apache.org/tapestry/dtd/Tapestry_4_1.dtd" >
< page-specification >
</ page-specification >

1.5小结

以上的页面模板,页面规范,页面类及后面例子中的应用配置文件 位于应用WEB-INF目录下

Tapestry页面模板就是在普通的HTML文件中给对应DOM元素增加jwcid属性,可以利用HTML设计
工具打开,真正做到"所见即所得".
jwc是java web component的简写
jwcid值有三种情况
假设要展现一表示用户名(username)的输入域,有如下三种方式
a.<input type="text" jwcid="username" size="20"/>
jwcid="username" 指定名称为username的组件,其定义在页面规范中定义
中如
<component id="username" type="TextField">
  <binding name="value" value="username"/>
</component>
b.<input type="text" jwcid="@TextField" value="ognl:username" size="20"/>
c.<input type="text" jwcid="username@TextField" size="20"/>
以上三种页面输出
<input type="text" name="username" id="username" value="" size="20"/>

第一种为显示调用输入组件,生成组件id="username"
第二种为隐式调用输入组件,组件id由系统自动生成
第三种即显示又隐式调用,生成组件id="username"
以上三种方式组件值都绑定到页面类的username属性

2.实例登陆

2.1应用规范配置tapestryGuide1.application

<? xml version="1.0" ?>
<! DOCTYPE application PUBLIC
  "-//Apache Software Foundation//Tapestry Specification 4.1//EN"
  "http://jakarta.apache.org/tapestry/dtd/Tapestry_4_1.dtd" >
< application  name ="Tapestry Guide" >
     < meta  key ="org.apache.tapestry.template-encoding"  value ="GB2312" />
     < meta  key ="org.apache.tapestry.messages-encoding"  value ="GB2312" />
     < meta  key ="org.apache.tapestry.output-encoding"  value ="GB2312" />
     < meta  key ="org.apache.tapestry.page-class-packages"  value ="org.jceun.example" />    
</ application >

2.2页面模板Home.html

< html  jwcid ="@Shell"  title ="Login" >  
   < body  jwcid ="@Body" >
   < style > ...
.fieldMissing {...}{
    background: #bedef4;
}

.fieldInvalid {...}{
    background: #ffaf7e;
    font-weight: bold;
}
.alertButton {...}{
        width: auto;
        border: none;
        background-color: #699ED9;
        color: #fff;
        padding: 0.1em;
        border-bottom: 1px solid #5885b6 !important;
        border-right: 1px solid #5885b6 !important;
        border-top: 1px solid #92b8e2 !important;
        border-left: 1px solid #92b8e2 !important;
        cursor: hand;
        cursor: pointer;
}

.alertDialog {...}{
    width: 30em;
    border: 2px solid #ff660a;
    padding: 1em;
    background: #ffffff;
    -moz-border-radius: 10px;
}

.alertContent .alertButton {...}{
    float:right;
    position:relative;
    bottom:1em;
}

.missingList, .invalidList {...}{
    padding-bottom: 0.6em;
    padding-top: 0.2em;
    padding-left:0.1em;
    padding-right:0.2em;
    margin: 0;
}

.missingList {...}{
    border-top: 4px solid #bedef4;
}

.invalidList {...}{
    border-top: 4px solid #ffaf7e;
}

.missingList li, .invalidList li {...}{
    list-style:none;
    font-style:italic;
}
   </ style >
   < br >< br >< br >
   < center >
   < font  color ="red" >< span  jwcid ="@Insert"  value ="ognl:errorMsg" /></ font >
   < form  jwcid ="loginForm@Form"  clientValidationEnabled ="true" >    
     < table  border ="1"  cellpadding ="0"  cellspacing ="0"  bordercolor ="#87cefa"  bordercolorlight ="#bedef4" >
     < tr >
     < td  align ="right" >< span  jwcid ="@FieldLabel"  field ="component:username" > 用户名: </ span ></ td >
     < td >< input  type ="text"  jwcid ="username@TextField"  value ="ognl:username"  displayName ="literal:用户名"  
    validators ="validators:required[用户名不能为空]"  size ="20" /></ td >
     </ tr >
     < tr >
     < td  align ="right" >< span  jwcid ="@FieldLabel"  field ="component:password" > 密码: </ span ></ td >
     < td >< input  type ="password"  jwcid ="password@TextField"  hidden ="true"  value ="ognl:password"  
    validators ="validators:required[密码不能为空]"  displayName ="literal:密码"  size ="20" /></ td >
     </ tr >
     < tr >
     < td  colspan ="2" >< input  type ="submit"  jwcid ="logicBtn@Submit"  value ="登陆"  listener ="listener:login" /></ td >
     </ tr >
     </ table >
   </ form >
   </ center >
   </ body >
</ html >

2.3页面规范Home.page

<? xml version="1.0" encoding="UTF-8"  ?>
<! DOCTYPE page-specification PUBLIC
  "-//Apache Software Foundation//Tapestry Specification 4.1//EN"
  "http://jakarta.apache.org/tapestry/dtd/Tapestry_4_1.dtd" >
< page-specification  class ="org.jceun.example.Home" >
</ page-specification >

2.4页面类Home.java

package  org.jceun.example;

import  org.apache.tapestry.html.BasePage;

public   abstract   class  Home  extends  BasePage  ... {
    public abstract String getUsername();

    public abstract String getPassword();

    public abstract void setErrorMsg(String msg);

    public String login() ...{        
        System.out.println("username=" + getUsername());
        System.out.println("password=" + getPassword());
        if (getUsername().equals("ceun") && getPassword().equals("123456"))
            return "Welcome";
        else ...{        
            setErrorMsg("用户名或密码错误!");
            return this.getPageName();
        }
    }
}

2.5服务端校验

Home.html使用的是客户端校验,下面介绍服务端校验

Home.html改成

< html >
   < head >
     < title > Login.html </ title >     
   </ head >
  
   < body >
    < br >< br >< br >
   < center >
   < font  color ="red" >< span  jwcid ="@Insert"  value ="ognl:errorMsg" /></ font >
   < span  jwcid ="error" />
   < form  jwcid ="loginForm" >    
     < table  border ="1"  cellpadding ="0"  cellspacing ="0"  bordercolor ="#87cefa"  bordercolorlight ="#bedef4" >
     < tr >
     < td  align ="right" >< span  jwcid ="@FieldLabel"  field ="component:username" > 用户名: </ span ></ td >
     < td >< input  type ="text"  jwcid ="username"  size ="20" /></ td >
     </ tr >
     < tr >
     < td  align ="right" >< span  jwcid ="@FieldLabel"  field ="component:password" > 密码: </ span ></ td >
     < td >< input  type ="password"  jwcid ="password"  size ="20" /></ td >
     </ tr >
     < tr >
     < td  colspan ="2" >< input  type ="submit"  jwcid ="logicBtn"  value ="登陆" /></ td >
     </ tr >
     </ table >
   </ form >
   </ center >
   </ body >
</ html >

Home.page改成

<? xml version="1.0" encoding="GB2312"  ?>
<! DOCTYPE page-specification PUBLIC
  "-//Apache Software Foundation//Tapestry Specification 4.1//EN" 
  "http://jakarta.apache.org/tapestry/dtd/Tapestry_4_1.dtd" >
< page-specification  class ="org.jceun.example.Home" >
     < bean  name ="delegate"  class ="org.apache.tapestry.valid.ValidationDelegate" />
     < component  id ="loginForm"  type ="Form" >
         < binding  name ="delegate"  value ="beans.delegate" />
     </ component >
     < component  id ="error"  type ="Delegator" >
         < binding  name ="delegate"  value ="beans.delegate.firstError" />
     </ component >
     < component  id ="username"  type ="TextField" >
         < binding  name ="value"  value ="username" />
         < binding  name ="displayName"  value ="literal:用户名" />
         < binding  name ="validators"  value ="validators:required[用户名不能为空]" />
     </ component >
     < component  id ="password"  type ="TextField" >
         < binding  name ="value"  value ="password" />
         < binding  name ="displayName"  value ="literal:密码" />
         < binding  name ="hidden"  value ="true" />
         < binding  name ="validators"  value ="validators:required[密码不能为空],minLength=6" />
     </ component >   
     < component  id ="logicBtn"  type ="Submit" >       
         < binding  name ="listener"  value ="listener:login" />
     </ component >
</ page-specification >

Home.java改成

package  org.jceun.example;

import  org.apache.tapestry.html.BasePage;
import  org.apache.tapestry.valid.ValidationDelegate;

public   abstract   class  Home  extends  BasePage  ... {
    public abstract String getUsername();

    public abstract String getPassword();

    public abstract void setErrorMsg(String msg);

    public String login() ...{
        ValidationDelegate delegate = (ValidationDelegate) this.getBeans()
                .getBean("delegate");
        if (delegate.getHasErrors()) ...{
            return this.getPageName();
        }
        System.out.println("username=" + getUsername());
        System.out.println("password=" + getPassword());
        if (getUsername().equals("ceun") && getPassword().equals("123456"))
            return "Home";
        else ...{        
            setErrorMsg("用户名或密码错误!");
            return this.getPageName();
        }
    }
}