Tapestry5自定义组件

一、普通组件
1.java文件
package com.logcd.tapestry5.myapp.components;

import java.util.ArrayList;
import java.util.List;

import org.apache.tapestry5.ComponentResources;
import org.apache.tapestry5.annotations.Parameter;
import org.apache.tapestry5.annotations.Property;
import org.apache.tapestry5.ioc.annotations.Inject;

public class NavBar {
	@Parameter(defaultPrefix = "literal", required = true)
	private String pages;

	@Inject
	private ComponentResources resources;

	@Property
	private Page _pageAttr;

	public List<Page> getPageNames() {
		List<Page> pageList = new ArrayList<Page>();
		String[] pageArr = pages.split(",");
		for(int i=0;i<pageArr.length;i++){
			Page page=new Page();
			page.setName(pageArr[i].split("=")[0]);
			page.setUrl(pageArr[i].split("=")[1]);
			pageList.add(page);
			page=null;
		}
		return pageList;
	}

	public String getTabClass() {
		if (_pageAttr.name.equalsIgnoreCase(resources.getPageName()))
			return "current";

		return null;
	}
	
	public class Page{
		private String name;
		public String getName() {
			return name;
		}
		public void setName(String name) {
			this.name = name;
		}
		public String getUrl() {
			return url;
		}
		public void setUrl(String url) {
			this.url = url;
		}
		private String url;
	}
}

2.NavBar.tml
<table class="navigation" xmlns:t="http://tapestry.apache.org/schema/tapestry_5_0_0.xsd">

   <tr>
        <t:loop source="pageNames" value="pageAttr">
            <td class="${tabClass}">
                [<t:pagelink page="${pageAttr.url}">${pageAttr.name}</t:pagelink>]
            </td>
        </t:loop>
    </tr>

</table>

3.页面使用
<span t:type='NavBar' pages="首页=Index,用户管理=user/CreateUser"/>

二、布局模板组件
1.java文件
package com.logcd.tapestry5.myapp.components;

import org.apache.tapestry5.annotations.IncludeStylesheet;
//用 "context:"前缀,如果存储在应用程序(webapp)的目录
//用"classpath:"前缀,如果存储在应用程序的classpath路径下
@IncludeStylesheet("context:styles/layout.css")
public class Layout {

}

2.tml文件
<html xmlns:t="http://tapestry.apache.org/schema/tapestry_5_0_0.xsd">
     <head>
          <title>Tapestry 5 Demo Application</title>
		  <style type="text/css">
		  	@import url(${asset:context:styles/myapp.css});
		  </style>
     </head>
     <body>
          <div id="header">
               <h1>Tapestry 5 Demo</h1>
               <div id="navigator" style="float:right;margin-right:10px;">[<t:pagelink t:page="Index">首页</t:pagelink>]</div>
          </div>
          <div id="container">
          	<t:body/>
          </div>
          <div id="footer">
               Design by <a href="#">XXX Design</a>
          </div>
     </body>
</html>

3.layout.css
div{
	text-align:left;
}
#header{
	width : 100%;   
	margin: 2px auto;
	text-align:center;
	background-color: #FFFFEC;
	border:1px solid #f60; 
	height:10%;
}
#container{
	 margin:0 auto;
	 overflow:hidden;
	 background:#eee;
	 border:1px solid #f60; 
	 width: 100%;
	 height:85%;
} 
#footer{
	clear:both;
	width:100%;
	margin:2px auto;
	text-align:center;
	background-color: buttonface;
	border:1px solid #f60; 
	height:5%;
}

4.使用模板
<t:layout xmlns:t="http://tapestry.apache.org/schema/tapestry_5_0_0.xsd">
        <p> 现在是: ${currentTime}. </p>
            [<t:pagelink t:page="Index">refresh</t:pagelink>]
        </p>
</t:layout>

你可能感兴趣的:(java,apache,css,IOC,tapestry)