Wicket 教程4:如何使用 Include,Panel,Fragment,Link
前面我没看到了如何使用一些基本的markup,和几个示例
( http://www.hexiao.cn/blog/index.php?job=art&articleid=a_20060807_153301 ), 这次再来看看几个复杂一点的markup.
下次来看看 Form 及其相关的markup的使用.
[b]Include [/b]是一个和JSP中的include指令功能差不多的markup,用来导入一个文件.
可以使用绝对和相对路径来导入文件, 该类的使用是很简单的.
Java code:
...
add(new Include("header", "header.html"));
add(new Include("footer", "footer.html"));
...
and Html Code:
...
<div>
<div wicket:id="header">header comes here</div>
<div>I am the body!</div>
<div wicket:id="footer">footer comes here</div>
</div>
...
上面就可以实现一个简单的布局框架.
[b]Panel: [/b]panel有点类似于swing中的panel,用来放置其他markup, panel的使用也
是很简单的, 如下:
创建一个mypanel类:
class MyPanel extends Panel {
public MyPanel(String id) {
super(id);
add(new Label("label", "yep, this is from a component
proper"));
add(new AnotherPanel("otherPanel"));
}
}
该类继承与Panel,里面添加了两个markup,一个Label,另外一个Panel(Panel可以
无限嵌套). 然后编写对应的html文件. MyPanel.html
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Wicket Examples - sample panel</title>
</head>
<body>
<wicket:panel>
<p style="border: 2px dotted #fc0; padding: 5px;">
Here are some panel contents for ya.<br />
Put arbitrairy Wicket components in your Panels,
like this label: <span wicket:id="label" style="background-
color: aqua" >to be replaced</span>, or<br />
even another panel: <span wicket:id="otherPanel"
style="background-color: aqua">also to be replaced</span>.<br />
You can nest panels any deep you want.
</p>
</wicket:panel>
</body>
</html>
下面是使用上面的panel的代码,
Java code:
...
add(new MyPanel("panel"));
...
Html code:
<span wicket:id="panel">panel contents come here</span>
[b]Fragment:[/b] 当有很多小段信息要组织的时候,使用很多panel可能是不雅观的,这时
就可以使用Fragment了.
示例如下:
Java code:
...
add(new Fragment("myPanel1", "frag2"));
...
Html code:
...
<span wicket:id="myPanel">Example input (will be removed)</span>
<wicket:fragment wicket:id="frag1">panel
1</wicket:fragment>
<wicket:fragment wicket:id="frag2">panel
2</wicket:fragment>
...
[b]Link:[/b] link就是web页面中的连接了, 这里的link可以是一切连接,如 常用的<a/>
, button... 这里的link 和JSF中的link所拥有的功能一样强大.
下面来看几个示例:
普通的link:
Java code:
...
add(new Link("link1"));
...
Html code:
...
<a href="#" wicket:id="link1">this link is clicked <span
wicket:id="linkLabel1">n</span> times</a>
...
使用不同的html 可以显示为不同的样式,如:
button样式的按钮:
Html code:
<button wicket:id="link2">this button is clicked <span
wicket:id="linkLabel2">n</span> times</button>
or:
<input type="button" wicket:id="link3" value="this button is clicked n
times" />
[b]ExternalLink:[/b] 是link的一种, 特别用来连接到该站点以外的资源, 示例:
Java code:
...
// add a link that goes to javalobby
add(new ExternalLink("externalLink1", "http://www.javalobby.org", "To
JavaLobby"));
...
Html code:
...
<a href="#" target="_new" wicket:id="externalLink1">this body
will be replaced</a>
...
[b]PageLink:[/b] 也是link的一种,实现页面之间的跳转: 示例:
Java code:
...
// 可以有多种方法使用该类,下面是一种推荐的方法
add(new PageLink("pageLink", new IPageLink(){
public Page getPage(){
return new NonBookmarkablePage
(QuickStart4.this);
}
public Class getPageIdentity(){
return NonBookmarkablePage.class;
}
}));
...
Html code:
...
<a wicket:id="pageLink">go to our private/ non bookmarkable
page</a>
....
[b]BookmarkablePageLink:[/b] 也是link的一种,实现一种可以作为书签收藏的连接,也
就是无状态的连接. 可以带参数也可以不带参数: 示例:
Java code :
...
add(new BookmarkablePageLink("pageLinkNoArgs",
BookmarkablePage.class));
PageParameters parameters = new PageParameters();
parameters.put("message", "This message was passed as a
page parameter argument");
add(new BookmarkablePageLink("pageLinkWithArgs",
BookmarkablePage.class, parameters));
....
Html code:
...
<p>
<a wicket:id="pageLinkNoArgs">go to our bookmarkable page
without passing any arguments</a>
</p>
<p>
<a wicket:id="pageLinkWithArgs">go to our bookmarkable page
passing a message argument</a>
</p>
...
讨论: http://bbs.hexiao.cn/thread.php?fid=9
代码下载: http://bbs.hexiao.cn/read.php?fid=9&tid=15&fpage=1
允许所需要的类库,到这里下载: http://bbs.hexiao.cn/read.php?fid=9&tid=12&fpage=1