原文:http://www.theserverside.com/tt/articles/article.tss?l=GWTandJSF
翻譯:icess http://blog.matrix.org.cn/page/icess?討論
?
使用更多的動態文本
在我們應用程序的第一個版本中,我們硬編碼標簽字符到程序中.在下一個版本中,我們將保持該文本與java代碼分離.
GWT Parameters in Hosted Mode
一種方式是使用GWT來定義label 和message.
13. 打開demo.gwt.client.HelloWidgetEntryPoint.java 文件用下面的代碼替換createWidget 方法.
protected Widget createWidget(final String id) {
Map m = getWidgetParams(id);
final String buttonLabel = (String) m.get("buttonLabel");
final String greeting = (String) m.get("greeting");
Button btn = new Button(buttonLabel, new ClickListener() {
public void onClick(Widget sender) {
????? Window.alert(greeting);
????? }
});
return btn;
}
?
14. 保存文件.
15.?打開 JavaSource\demo\gwt\public\index.html 文件.
該文件已經包含了一個如何定義參數的示例,我們只需要修改一下就可以了. :
16. 修改為如下的代碼:
<html>
<head>
<meta name="gwt:module" content="demo.gwt.HelloWidget">
<meta name="gwt:property" content="viewid=hello">
<meta name="gwt:property" content="action=/gwtFacesServlet">
<title>gwt-jsf integration</title>
</head>
<body bgcolor="white">
<script language="javascript" src="gwt.js"></script>
<iframe id="__gwt_historyFrame"
style="width:0;height:0;border:0"></iframe>
<span id="_id1" class="demo.gwt.HelloWidget">
<span id="_id1:_data" style="display:none;">
<span? title="buttonLabel">Say Hello</span>
<span? title="greeting">Hello GWT!</span>
</span>
<input type="hidden" id="javax.faces.ViewState"
name="javax.faces.ViewState" value="_id0:_id0" />
</span>
</body>
</html>
17.?在 Hosted Mode 中啟動ant:
ant shell
你現在可以看到文本定義在?public/index.html 文件中:
然而,如果你想創建一個war文件,然后部署它.你將看不到相同的結果.這是因為 public/index.html僅僅在Hosted Mode中其作用.在 Run-Time Mode,我們需要使用 JSF page.
Using JSF Expression Language (EL) in Run-Time Mode
看一下WebContent\pages\Base.xhtml文件.它包含如下代碼:?
<widget:component id="main"? />
這實際上是一個GWT widget 的?JSF 包裝.
18. 定義組件的"buttonLabel" 和"greeting" 參數 :
<widget:component id="main"? buttonLabel ="Click Me!"
greeting="Hello, GWT and JSF"/>
19. 在Run-Time Mode中運行該項目.
看看結果. 然而這是不是太簡單了, 下面來看看如何使用 ?JSF EL來使它更動態一些.
20.現在關閉XHTML?文件.
?
Adding a Resource File
21. 在JavaSource? 文件夾下創建demo/gwt/app/bundle/Labels.properties文件,包含下面的內容:
#
buttonLabel=Say Hello!
?
Adding a Managed Bean
22. 在JavaSource中創建一個類demo.gwt.app.GreetingBean? .使用下面的代碼:
package demo.gwt.app;
public class GreetingBean {
String name;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
23. 在WEB-INF/faces-context.xml 中注冊該bean.
The faces-context.xml should contain
:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE faces-config PUBLIC "-//Sun Microsystems, Inc.
//DTD JavaServer Faces Config 1.1//EN"
????????????????????????????? "http://java.sun.com/dtd/web-facesconfig_1_1.dtd">
<faces-config>
<managed-bean>
? <managed-bean-name>greetingBean</managed-bean-name>
? <managed-bean-class>demo.gwt.app.GreetingBean</managed-bean-class>
? <managed-bean-scope>session</managed-bean-scope>
? <managed-property>
?? <property-name>name</property-name>
?? <property-class>java.lang.String</property-class>
?? <value>GWT and JSF</value>
? </managed-property>
</managed-bean>
? <application>
? <view-handler>com.sun.facelets.FaceletViewHandler</view-handler>
</application>
</faces-config>
?
Finishing Up
要讓EL工作.我們要在組件類中添加屬性到屬性map中.
24. 打開demo.gwt.jsf.UIHelloWidget,?找到 getWidgetParameters() 方法,使用下面的代碼替換.
public Map getWidgetParameters() {
HashMap params = new HashMap();
params.put("greeting",getAttributes().get("greeting"));
params.put("buttonLabel",getAttributes().get("buttonLabel"));
return params;
}
25. 添加下面的import語句:
import java.util.HashMap;
現在回到?pages/Base.xhtml文件中.
26. 把資源聲明放到該文件的頂部:
<f:loadBundle basename="demo.gwt.app.bundle.Labels" var="bundle"/>
27. 修改widget:component的屬性: ?
<widget:component id="main" buttonLabel ="#{bundle.buttonLabel}"
greeting="Hello #{greetingBean.name}!" />
???
?
現在兩個屬性都通過el來產生了,一個來自于 bundle resource file, 一個來自于 backing bean.
如果你創建,部署,啟動該程序,你可以看到該程序現在使用的按鈕標簽了:
OK,我們已經在JSF環境中參數化了GWT widget的數據. 因此你可以使用同樣的方法用數據初始化該 ?widget? .然而目前這一切看起來想一張單程車票( one-way ticket).我們還沒有提到一個非常重要的方面 .