Wicket框架基础(一)
2009-04-22 09:32 乱世文章 阅读(1291) 评论(0) 编辑 收藏 举报Wicket框架基础(一)
pizza Application Sample
Wicket是什么
Wicket是一个崭新的web框架,完全不同于struts、jsf或tapestry。目前它已经成为apache最有潜力的一个项目。
Wicket相关的IDE
Wicket有简单、学习曲线低、零配置等优点。我们完全可以不使用IDE来搭建一个wicket工程,但仍然推荐大家使用IDE+wicket插件来开发以提高生产率。
为什么选择NetBeans6.5
Wicket目前支持的IDE插件有:
- Eclipse: Wicket Bench
- Netbeans: NB Wicket Support
- IntelliJ IDEA: Wicket Forge
目前Wicket Bench 在Eclipse中仍然存在一些问题。IntelliJ IdeA据说相当不错,但我没用过。所以只好选择NetBeans及其迄今为止最稳定的版本6.5。
本文档需要的环境
- NetBeans IDE 6.5
- Java Standard Development Kit (JDK™) 5.0 版或 6.0 版
- NetBeans IDE 的 Wicket Support 插件
一、在netbeans6.5中建立wickt应用程序
IDE的作用是提供友好界面以及减少工作量。在netbeans6.5中建立wickt项目的步骤如下:
1、 建立一个“web应用程序”。在选择服务器(如tomcat6.0)和javaEE版本(如5.0规范)之后,选择框架“wicket1.4”。
其中wicket1.4配置中各项配置的含义等同于web.xml中的filter和filter-mapping中的相应配置。以上图为例:
Wicket URL Pattern指明了当我们访问web应用的/wicket/*上下文时将由Wicket Servlet Name这个filter来处理请求。这个filter是wicket框架中的一个重要的类WicketFilter。这个类主要作用是初始化context上下文(这个工作是自动的,程序员不需要管),加载init-param参数Wicket Application Class(即applicationClassName)指明的类(如Application,这个类名你可以任意改), 并调用该类的getHomePage方法。该方法仅仅是返回一个class对象,该class对象的类名由Wicket Home page参数指定(如:HomePage,如你想修改这个名字,需要修改这个方法)。
不用改变wicket1.4配置,点击“完成”。
2、 展开项目窗格中“源包”,可以看到生成了如下文件:
所有文件都位于一个com.myapp.wicket包下(包名可以在上图Main Package中设置)。其中Application.java的getHomePage()方法是应用的主入口(类似于应用程序中的Main函数),它其中只有一句:
return HomePage.class
也就是HomePage.java这个源文件。
这里只有一个空的构造函数,这样的话页面上只会显示静态的HomePage.html文件中定义的内容:
<link wicket:id='stylesheet'/>
</head>
<body>
<span wicket:id='mainNavigation'/>
</body>
光这样看,显然这个页面没有什么实际的内容去输出。然而需要注意这几个红色的地方,wicket:id这样的属性和标准的id属性相比,显然有些特殊的地方。实际上这只是两个占位符,当wicket项目重新生成后,wicket会用真正的有实际意义的html代码去根据一定规则填充它:
在wicket中,每个页面会包含一个静态的html和一个同名的java文件,如HomePage.html和HomePage.java、HeadPanel.html和HeadPanel.java。
在静态的html中,除了一些静态的html标签外,实际上还会有一些动态的内容。这些动态的内容表面上看是一些传统的html标签,如上面HomePage.html中的<link>标签<span>标签,这些标签的共同特征是:都有一个wicket:id属性。这些动态的内容在wicket程序中并不会形成真正的输出,而仅仅是一种占位符,而占位符的行为和输出,统统由跟html文件同名的java文件来控制。比如,HomePage.html中的动态内容(占位符)是由HomePage.java中的java代码控制的。如果我们要改变这些占位符的输出和行为,只能通过修改HomePage.java中的java代码来改变。
这种机制带来的好处是:在web应用开发过程中,工作一般会由美工人员和jsp程序员分担,美工负责静态内容,jsp程序员负责动态内容;把html代码和java代码分开后,二者的分工更明晰。美工负责修改html文件,而java程序员只需要负责java文件就好。
以上面的HomePage.html为例,有两个动态的内容(或占位符):
(1)占位符stylesheet
(2)占位符mainNavigation
然而在HomePage.java中,并没有任何代码控制这两个占位符(实际上除了一个空的构造函数外,HomePage.java中没有其他的代码)
但是,当我们运行这个程序(直接点工具栏上的运行按钮或按下F6键),发现实际上页面上是有输出内容的:
其实,这部分内容的输出虽然在HomePage.java中没有任何代码在输出,但别忘了,HomePage这个类继承自BasePage类,还可以在BasePage.java中进行输出:
add(new HeaderPanel("mainNavigation", Strings.afterLast(packageName, '.')));
add(new StyleSheetReference("stylesheet", BasePage.class, "style.css"));
这里,BasePage的构造函数中new了两个东西:一个HeaderPanel,一个StyleSheetReference。
前者是一个自定义的复用组件(可以打开HeaderPanel.java和HeaderPanel.html查看这个组件的输出内容),后者则为BasePage的子类添加了一个外部样式表引用。这样作为继承自BasePage的HomePage.java,虽然没有定义任何动态输出的内容,但仍然能够显示出一个HeaderPanel组件在页面上(因为extends 了BasePage)。而BasePage由于只有java文件没有html文件,所以只是用于继承而不能用于呈现。
3、 尽管到此为止,我们没有写任何一个代码就完成了一个能运行的wicket应用,然而我们仍然可以通过前面的的介绍的原理,很容易地进行自己的定制。比如,我们想让页面上的“Wicket Example”改变为:Hello World,而把”Start of wicket”中的”wicket”改成“我的第一个Wicket程序”。
首先,Wicket Example这段文字定义在HeaderPanel.html中,并且它是静态的内容(因为它没有Wicket:id属性):
<h1>Wicket Example</h1>
对于静态的内容,直接修改html文件就可以了。即把上面的html标签修改为:
<h1>Hello World</h1>
其次,”Start of wicket”中的”wicket”在HeaderPanel.html中定义为动态内容(因为它使用了Wicket:id属性):
<span wicket:id="exampleTitle">Example Title Goes Here</span>
对于动态的内容,应该修改java文件,即修改HeaderPanel.java中的构造函数:
add(new Label("exampleTitle", exampleTitle));
改为
add(new Label("exampleTitle", “我的第一个Wicket程序”));
二、开发wicket重用组件
Wicket最大的好处之一就是支持“可重用组件”,而且wicket重用组建的开发可以说是相当的简单(跟Tapestry相比),几乎跟写一个普通的wicket页面没有什么区别。它也由一个 Java 端与一个 HTML 端构成。
在项目的“源包/com.myapp.wicket”上右击(注意,一定要在“源包”上右击,否则会出现“无启用的文件系统”错误),选择“新建àWicket Panel”,弹出如下窗口:
在文件名中填入组件名称:FooterPanel,则下面会提示wicket插件将以该名字自动生成如下两个文件:
FooterPanel.java
FooterPanel.html
点击“完成”。
首先我们来修改FooterPanel组件的html文件(当然我们也可以让专门的网页设计人员来做,这样组件的样式会更加美观),打开FooterPanel.html,把注释“<!-- TODO -->”部分修改为:
<span wicket:id="message">显示内容</span>
然后,打开FooterPanel.java,在构造函数最后面加上内容:
add(new Label("message", "可重用组件"));
这样,我们就在页面id为message的地方插入一个label(当然,如果你愿意也可以插入一个image或者其他的什么 )。
这样,我们的第一个简单的可重用wicket组件就完成了,接下来要在页面上来使用它。
打开HomePage.html,在body中添加一个占位符,id为FooterPanel:
同时,需要修改HomePage.java,在代码中为占位符FooterPanel真正的插入一个FooterPanel可重用组件:
F6,运行主项目,可以看到页面上呈现了我们的可重用组件:
如果想改变组件的样式,可修改组件的html文件:
在<span>两端添加<h2>。重新部署,刷新页面,修改后的效果就可以看到。
<完>
*参考文档《Wicket Web 框架简介》