MyEclipse如何开发JSF文档格式.docx
《MyEclipse如何开发JSF文档格式.docx》由会员分享,可在线阅读,更多相关《MyEclipse如何开发JSF文档格式.docx(34页珍藏版)》请在冰豆网上搜索。
8.运行应用程序...32
9.总结...36
10.用户反馈...37
1.前言
这个文档基于下列环境编写:
SunJDK1.5.0,Eclipse3.1和MyEclipse4.0.如果你注意到这个文档和你正在操作的Eclipse/MyEclipse的版本不一致,在使用这个向导时遇到困难或者无法根据向导进行操作,请参考用户反馈部分来了解如何汇报这个问题.
返回页首
2.介绍
在这个教程中我们将使用MyEclipseEnterpriseWorkbench来开发一个小小的JSF示例程序.不需要您对关于JSF和MyEclipse的相关知识有所了解,不过如果有所了解的话会更好.
因为Struts是一个非常流行的web应用框架,所以JSF和Struts之间的相似点我们适当的提示您注意,来帮助哪些有过Struts开发经验的读者.然而,如果你以前对Struts一无所知,你完全可以很自在的忽略这些内容.
3.系统需求
下面是这个指南所使用的软件的列表:
∙JDK1.4+(Sun或者IBM)
∙
∙Eclipse3.1SDK
∙http:
//www.eclipse.org/downloads/index.php
∙MyEclipse4.1
∙Tomcat5.x(首选5.5.9,或者其它符合标准的Servlet/EJB容器)
//jakarta.apache.org/tomcat/index.html
∙对这个简单的例子,用户名是"
myeclipse"
密码也是"
.
注意:
在安装过JDK并且重启你的计算机后,请确保首先安装Eclpse然后是MyEclpse,最后安装Tomca.所有这些软件安装完毕后,请确保在MyEclipse中设置对应的Tomcat5服务器设置;
请使用正确的TomcatHome目录和你刚刚安装好的那个可用的JDK.如果你不知道如何在MyEclipse中设置Tomcat,你可以参考使用应用服务器ApplicationServers快速入门向导.
设置新项目和目录结构
为了组织我们的开发过程,我们需要在MyEclipse中创建一个新的Web模块并向它添加JSF功能(JSFCapabilities)模块.你可以通过向导来创建一个web项目,请通过选择菜单项File>
New>
Other>
Project>
J2EE>
WebProject来打开,如下图4.1所示.
图4.1:
创建一个新的web项目
图4.2:
Web项目向导对话框
这个向导可以让你自定义项目的设置,通过在对话框的输入框里输入一些值来自定义,如图4.2所示.
因为开发JSF程序的时候流行和JSTL类库搭配,所以在项目创建时建议您选择"
JSTLLibraries"
.
然而,您也可以在以后再来添加JSTL类库,通过选择MyEclipse菜单的"
AddJSTLLibraries"
菜单项来完成.
一旦Web项目创建了,我们需要给它添加JSF功能.这个操作可以通过PackageExplorer视图的项目根节点上右键点击,选择弹出菜单中的MyEclipse>
AddJSFCapabilities,如图4.3所示.
图4.3:
向Web项目添加JSFCapabilities
JSF对话框的默认值对这个教程来说不需要修改就可以使用.
高手们也可以通过修改对话框里面的默认值来改变配置,如图4.4所示.
图4.4:
配置JSFCapabilities
这个向导结束后,项目的目录结构将会如下图4.5所示.
图4.5:
配置后的项目布局
现在项目已经创建,我们可以开始修改并创建我们自己的应用相关的代码了.
5.创建消息包
让我们来通过创建一个MessageBundle文件正式开始我们的应用.这是一个简单的属性文件,它将保存所有的消息字符串以及相关的主键.
然后这个消息包可以用在我们的任何JSP文件中来让我们的应用很容易的支持国际化语言.
作为类比,Struts在这个领域提供了相似的支持,通过使用ApplicationResources.properties文件,
以及不同的<
bean/>
标签,以及bean标签所允许的消息包属性来完成这套功能.
在JSF里面,我们可以在JSP页面里加入一行代码来加载消息包:
<
f:
loadBundlebasename="
com.jsfdemo.MessageBundle"
var="
bundle"
/>
这一行代码创建了一个生命周期为页面的消息包,这个包可以稍后在页面中通过变量名'
bundle'
来进行引用,可以用来查找消息主键,然后返回对应的消息值.
在创建消息包文件的时候,先在源代码目录创建包com.jsfdemo,通过右键点击源代码目录,然后选择弹出的菜单中的New>
Package即可完成.
要创建消息包文件,我们使用新建文件向导,右键点击项目的’src’目录,在弹出的菜单中选择New>
File,如下图5.1所示.
图
5.1:
创建消息包文件
当指定新建文件的保存位置时,选择Browse...,选中目录/JSFLoginDemo/src/com/jsfdemo,将文件命名为MessageBundle.properties,然后选择Finish.
新建消息包文件成功后,我们需要为每个在JSP里面需要显示的标签或者字符串以键值对的方式添加到属性文件中.复制图5.2中的内容到你的消息包文件然后保存它:
MessageBundle.properties
user_name_label=UserName:
user_password_label=Password:
login_button_label=Login
5.2:
MessageBundle.properties文件内容
现在我们的MessageBundle创建完毕了,接下来我们要创建受管Bean(ManagedBean),它将处理我们的用户登录操作.
6.创建受管Bean
在这一部分我们将会看到如何创建ManagedBean,这个Bean将会执行登录JSP页面所提示的登录操作,以及保存用户输入的用户名和密码.出于演示的目的,我们的登录操作知识简单的检查用户名和密码是不是都是"
然后将用户重新指引到userLoginSuccess.jsp页面.
否则它会返回到登录页面.
首先使用MyEclipseJSFEditor打开文件faces-config.xml:
图6.1:
打开并准备编辑faces-config.xml文件
在MyEclipse4.0中faces-config.xml编辑器已经比以前的版本有所增强,你不仅可以创建和管理应用程序流程(浏览规则NavigationCases),还可以通过大纲(Outline)视图来创建/修改并管理所有资源.你可以点击大纲视图右上角的下箭头按钮来添加新的bean,如图6.2:
图6.2:
通过大纲视图启动ManagedBean向导
现在你会看到新建ManagedBean向导对话框;
请按照下面的图6.3和6.4所示来输入值:
6.3:
设置新ManagedBean的类和属性
图6.4:
ManagedBean向导完成页面
你现在会注意到新的UserBean被添加到Outline视图,如图6.5所示:
图6.5:
UserBean现在显示在Outline视图
同时新建的UserBean.java源文件也在Java编辑器中打开了:
图6.6:
UserBeanJava源代码在编辑器中打开
注意我们的两个属性(username和password)的getters和setters方法已经自动生成了,所以对这个类唯一需要做的就是添加并实现loginUser方法,这个方法将会在用户登录时调用.
下面的图6.7显示了loginUser方法的代码片断.
请将这个代码复制粘贴到你自己的文件里,并添加必要的新的类的import语句:
UserBean.java
publicStringloginUser(){
if("
.equals(getUserName())&
&
"
.equals(getPassword()))
return"
success"
;
FacesContextfacesContext=FacesContext.getCurrentInstance();
FacesMessagefacesMessage=newFacesMessage(
Youhaveenteredaninvalidusernameand/orpassword"
);
facesContext.addMessage("
loginForm"
facesMessage);
failure"
}
图6.7:
新建的UserBean.java文件中的loginUser代码片断
仔细看看bean的代码,我们可以注意到一些独特之处.例如,UserBean类并没有继承或者实现绑定到JSF的任何类或者接口.它仅仅是一个简单的包含了额外的逻辑来执行有用的操作的JavaBean.
用Struts的术语来说,它包含了StrutsForm和StrutsAction的所有功能,方便的合并在一个类中.
另一个和Struts的不同之处是这些方法没有返回任何特殊的类,例如ActionForward,因为导航信息是在faces-config.xml部署描述符中通过配置完成的.而且,在第
8部分我们将展示如何创建并配置这个描述.
7.创建JSP页面
在这一小节里面将集中精力为我们的示例JSF应用来创建JSP页面,来模拟一个简单的网站常见的登录页面.最后的结果只需要2个JSP页面,一个用来提示用户来登录,另一个用来告诉用户登录成功.我们把这两个页面分别命名为loginUser.jsp和loginUserSuccess.jsp.为了简单起见,如果尝试登录的时候验证身份失败,就将用户重定向回页面loginUser.jsp.
为了避免引起混淆,我们没有在这个例子里使用任何验证机制,不过你可以很容易的为JSF的inputText/Secret组件添加验证器.
我们将使用这些输入框来验证用户输入的值的长度并且可以在登录失败时给用户显示错误信息.
另一个MyEclipse4.0中的新功能是我们可以为JSF应用程序创建JSP页面,通过在MyEclpseJSF编辑器中修改文件faces-config.xml来实现.所以请确保文件依然保持打开然后我们可以开始创建我们的userLogin.jsp页面.
要创建我们的userLogin.jsp页面,首先需要先点击一下JSP按钮
然后点击到画图板上.
当新建JSP向导对话框弹出时,根据图7.1的显示在FileName(文件名)输入框中输入值并选择JSF模版:
图7.1:
使用faces-config.xml编辑器创建userLogin.jsp
现在我们也可以使用同样的方式来创建userLoginSuccess.jsp:
图7.2:
使用faces-config.xml编辑器创建userLoginSuccess.jsp
接着我们可以打开页面userLogin.jsp来给我们的应用加入功能:
图7.3:
开始编辑userLogin.jsp页面
图7.3需要注意是MyEclipse(MyEclipseJSP设计器)编辑器底部的一些面板,你可以自己选择来编辑这个页面在不同的模式:
源代码模式,设计模式,设计/源码模式或者预览.在这个示例中我们切换到设计/源码模式,因为这样可以很容易的在编辑页面时同时看到两个视图.显示结果如下图7.4所示:
图7.4:
切换到设计/源码模式并且展开JSF组件板
现在,我们需要对这个页面进行如下修改:
∙给username添加一个h:
inputText组件
∙给password添加一个h:
inputSecret组件
∙给usernameinputText添加一个h:
outputLabel
∙给password添加一个h:
注意:
在4.0版里面的JSF设计器不支持从MessageBundle中读取值显示在outputLabel,所以为了能够在设计器中看到我们的outputLabels,我们将在代码中手工修改他们来将他们的值绑定为MessageBundle中的值.这个问题将在MyEclipse4.1版本修正(译者注:
现在已经是MyEclipse6.0了,这个问题应该早已被修正了).
要做的第一件事就是删除默认的模版文字,然后手工键入我们的资源包的基础名字然后我们可以使用MessageBundle.
这个JSP最后将会如图7.5这样结束:
图7.5:
删除模版文字并且向JSP页面添加我们的MessageBundle
图7.5a:
创建新表单
在图7.5a我们创建了新的HTML表单元素来包含我们的登录控件.现在我们将会真正的创建输入文本框!
现在我们给username创建h:
inputText组件,参考图7.6和7.7:
图7.6:
添加新的inputText组件
图7.7:
添加新的inputText组件(续)
现在我们添加我们的h:
inputSecret组件(没有标签):
图7.8添加新的inputSecret组件
图7.9添加新的inputSecret组件(续)
现在给我们的输入组件都添加outputLabel,首先是我们的userLabel:
图7.10:
给userName添加outputLabel组件
我们也可以用同样的方式给我们的h:
inputSecret组件添加一个标签.完成之后,像刚刚所提到的那样,让我们手工来更改h:
outputLabel组件来使它绑定到我们的MessageBundle,这样我们可以在设计器里面看到它,最后看起来就像这样:
图7.11:
给我们的标签添加outputText组件
请确保userName和password两个标签都做了这样的修改.
好了,是时候加入我们的登录按钮了,加入这个组件的方式和加入其它组件的方式一摸一样,如图7.12和7.13所示:
图7.12:
添加一个新的commandButton组件
图7.13:
添加一个新的commandButton组件(续)
现在我们将会得到一个大致样子如下所示的页面:
图7.14:
几乎完工的userLogin.jsp页面
你也许已经注意到全部内容都显示在一行看起来很丑,所以让我们来添加一些空格让这些组件分布到多行里面(译者注:
用Shift+Enter输入软换行也许会更合适):
图7.15:
布局完好的userLogin.jsp页面
现在userLogin.jsp页面完事了,让我们快速完成更简单的userLoginSuccess.jsp页面.打开文件然后修改它,只需要简单的添加一行数据来指出已经登录的用户的名字,如图7.16所示:
图7.16:
修改userLoginSuccess.jsp页面来输出用户名
现在我们创建了两个页面,剩下的唯一的事情就是把他们用正确的导航规则(NavigationCase)连接到一块,这个可以通过可视化的修改faces-config.xml文件来完成,所以先要打开这个文件.文件打开后,进行下列操作来创建导航规则:
1.点击NavigationCase工具按钮
2.点击userLogin.jsp文件
3.然后点击到userLoginSuccess.jsp文件
4.这是将会出现一个向导来提示你创建导航规则.
下面的图7.17和图7.18用来创建成功(success)浏览的导航规则.为了创建失败(failure)导航规则,我们简单的重复如上的步骤,只不过点击两次文件userLogin.jsp,来创建一个循环的导航规则(自己导航到自己).
图7.17:
创建success导航规则
图7.18:
创建success导航规则(续)
当这两个导航规则创建完成后,配置文件将会看起来如下所示:
图7.19:
检查应用的导航规则
现在我们已经创建了所有的JSP页面,并且正确的加入了导航规则,剩下唯一要做的事情就是运行了!
8.运行应用程序
在这一小节里将会快速的展示我们的应用运行时候是什么样子.
这里使用MyEclipse来发布我们的程序到Tomat5然后启动服务器,这样就可以运行我们的应用了.
关于如何设置应用服务器以及通过MyEclipse进行发布的完整的信息请参考应用服务器快速入门.
为了仅仅运行这个例子,我们假定Tomcat5已经配置完毕并且只需要发布程序到上面即可.
发布程序可以通过ManageDeployments(管理发布)对话框来进行,这个对话框可以通过下列步骤来打开:
在PackageExplorer视图中右键点击项目文件出现的弹出菜单中,选择MyEclipse>
Add/RemoveDeployments(添加/删除发布)...
ManageDeployments对话框,如图8.2所示,将会启动(译者注:
另一种方式是通过点击工具栏上的发布按钮
).
要添加发布,在NewDeployment(新发布)向导中,点击Add(添加)按钮,然后这时候NewDeployment(新建发布)向导将会打开.
图8.1:
打开管理发布对话框
图8.2:
为我们的项目新建部署
选择服务器Tomcat5,发布类型为散包部署(explodedarchive),然后选择Finish按钮,如图8.2所示.
当向导执行结束后,部署管理器将会显示发布成功.
如图8.3所描述的那样.
现在部署已经完成,你可以选择OK来关闭对话框.
图8.3:
部署成功
这时候Tomcat5服务器可以通过Eclipse主工具栏中的Tomcat5管理菜单中选择Start来启动,如下图8.4所示.
图8.4:
启动Tomcat5
服务器的日志输出将会被重定向到EclipseConsole(控制台)视图.
从图8.5中显示的日志中,很明显的可以看到服务器启动成功了.
图8.5:
Tomcat5启动日志
一旦Tomcat5运行了,我们就可以通过打开MyEclipseBrowser(浏览器)视图来进行测试.
这个步骤可以通过点击如图8.6所示的浏览器按钮来完成.
图8.6:
打开网络浏览器视图
在浏览器的地址栏里,输入http:
//localhost:
8080/JSFLoginDemo/userLogin.faces来激活样例应用,如图8.7所示.
URL以.faces结尾而不是.jsp的原因是因为在上面,我们将FacesServlet映射到了*.faces扩展名,这意味着为了能使我们的JSF获得机会来处理请求并且构造组件树,我们必须使用.faces扩展名来访问真正的页面.如果你不这样做,你将获得一个异常信息,包含下列信息:
FacesContextcannotbefound"
.
图8.7:
访问示例应用
现在在用户名和密码框都输入myeclipse,然后点击Login来看到程序的执行!
图8.8:
正在登录...
图8.9:
登录成功
我们可以看到导航规则起了作用,我们验证后就被定向到了userLoginSuccess.jsp页面,并显示了我们的名字.当然这个应用非常简单,但是它传达了使用MyEclipse开发JSF应用的基本步骤.
9.总结
在这个示例中我们了解了使用MyEclipseEnterp