Java-Android-jwebee
Java-Android-jwebee
对IT人来说,要成为一个优秀的技术型管理者,除了需要具备扎实的技术基础之外,还应该培养良好的人际关系能力、谈判与沟通技能、客户关系与咨询技能、商业头脑和财务技能以及创新意识,此外还要有巧妙的激励技巧和化解冲突与解决突发问题的能力.
現在可以開發一個簡單的程式了,我們將設計一個簡單的登入程式,使用者送出名稱,之後由程式顯示使用者名稱及歡迎訊息。

 

程式開發人員

先看看應用程式開發人員要作些什麼事,我們撰寫一個簡單的JavaBean:
  • UserBean.java
 
package onlyfun.caterpillar;

public class UserBean {
private String name;

public void setName(String name) {
this.name = name;
}

public String getName() {
return name;
}
}

 

這個Bean將儲存使用者的名稱,編譯好之後放置在/WEB-INF/classes下。

 

接下來設計頁面流程,我們將先顯示一個登入網頁/pages/index.jsp,使用者填入名稱並送出表單,之後在 /pages/welcome.jsp中顯示Bean中的使用者名稱與歡迎訊息。

 

為了讓JSF知道我們所設計的Bean以及頁面流程,我們定義一個/WEB-INF/faces-config.xml:
  • faces-config.xml
 
<?xml version="1.0"?>
<!DOCTYPE faces-config PUBLIC
"-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.0//EN"
"http://java.sun.com/dtd/web-facesconfig_1_0.dtd">

<faces-config>
<navigation-rule>
<from-view-id>/pages/index.jsp</from-view-id>
<navigation-case>
<from-outcome>login</from-outcome>
<to-view-id>/pages/welcome.jsp</to-view-id>
</navigation-case>
</navigation-rule>

<managed-bean>
<managed-bean-name>user</managed-bean-name>
<managed-bean-class>
onlyfun.caterpillar.UserBean
</managed-bean-class>
<managed-bean-scope>session</managed-bean-scope>
</managed-bean>
</faces-config>

 

在<navigation-rule>中,我們定義了頁面流程,當請求來自<from-view- id>中指定的頁面,並且指定了<navigation-case>中的<from-outcome>為login時,則會將請求導向至<to-view-id>所指定的頁面。

 

在<managed-bean>中我們可以統一管理我們的Bean,我們設定Bean物件的存活範圍是session,也就是使用者開啟瀏覽器與程式互動過程中都存活。

 

接下來要告訴網頁設計人員的資訊是,他們可以使用的Bean名稱,即<managed-bean-name>中設定的名稱,以及上面所定義的頁面流程。

 

網頁設計人員

 

首先網頁設計人員撰寫index.jsp網頁:
  • index.jsp
 
<%@taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@page contentType="text/html;charset=Big5"%>
<html>
<head>
<title>第一個JSF程式</title>
</head>
<body>
<f:view>
<h:form>
<h3>請輸入您的名稱</h3>
名稱: <h:inputText value="#{user.name}"/><p>
<h:commandButton value="送出" action="login"/>
</h:form>
</f:view>
</body>
</html>

 

我們使用了JSF的core與html標籤庫,core是有關於UI元件的處理,而html則是有關於HTML的進階標籤。

 

<f:view>與<html>有類似的作用,當您要開始使用JSF元件時,這些元件一定要在<f: view>與</f:view>之間,就如同使用HTML時,所有的標籤一定要在<html>與< /html>之間。

 

html標籤庫中幾乎都是與HTML標籤相關的進階標籤,<h:form>會產生一個表單,我們使用<h: inputText>來顯示user這個Bean物件的name屬性,而<h:commandButton>會產生一個提交按鈕,我們在action屬性中指定將根據之前定義的login頁面流程中前往welcome.jsp頁面。

 

網頁設計人員不必理會表單傳送之後要作些什麼,他只要設計好歡迎頁面就好了:
  • welcome.jsp
 
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@page contentType="text/html;charset=Big5"%>
<html>
<head>
<title>第一個JSF程式</title>
</head>
<body>
<f:view>
<h:outputText value="#{user.name}"/> 您好!
<h3>歡迎使用 JavaServer Faces!</h3>
</f:view>
</body>
</html>

 

這個頁面沒什麼需要解釋的了,如您所看到的,在網頁上沒有程式邏輯,網頁設計人員所作的就是遵照頁面流程,使用相關名稱取出資料,而不用擔心實際上程式是如何運作的。

 

接下來啟動Container,連接上您的應用程式網址,例如:http://localhost: 8080/jsfDemo/pages/index.faces,填入名稱並送出表單,您的歡迎頁面就會顯示了。


jwebee

我的个人网站
posted on 2008-05-22 12:34 周行 阅读(533) 评论(0)  编辑  收藏 所属分类: JSF

只有注册用户登录后才能发表评论。


网站导航:
 
Java-Android-jwebee