本文用一个非常简单的例子“helloDuke"，介绍如何在 Apusic OperaMasks 下进行应用的开发。"helloDuke" 应用中只有两个页面，分别是：greeting.jsp 和 sameName.jsp。

当你在 greeting.jsp 页面中输入你的名字时，会在同一个页面中显示 "Hello your name" 的字样，如果你输入的名字也叫 "Duke" ，则会导航到 sameName.jsp 页面中，如下图所示。

整个程序的目录结构如下：

helloDuke
  --duke.gif
  --greeting.jsp
  --sameName.jsp
  --WEB-INF
      --web.xml
      --faces-config.xml
      --classes
        --helloduke
          --UserBean.class

下面就让我们来完成此应用。

package helloduke;

public class UserBean {

private String name;

  public String getName() {
    return name;
  }

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

  public String getResult() {
    if(this.name == null || "".equals(name.trim())) return "Please input your name."; 
    else return "Hello " + name;
  }

  public Object sayHello() {
    if("duke".equalsIgnoreCase(name)) return "duke";
    return null;
  }
}

在greeting.jsp中，outputText 绑定 userBean 的 result 属性；inputText 绑定 name 属性；commandButton 的 action 绑定 sayHello 方法。在sayHello方法中，当返回 "duke" 字符串时，意味着要导航到其它页面，否则，继续使用此页面。

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<f:view>
  <h2>Hi, we have the same name "Duke"!</h2>
  <h:graphicImage url="duke.gif"></h:graphicImage>
  <a href="/articles/helloDuke/html_single/greeting.jsp">return</a>
</f:view>

sameName.jsp非常简单，仅仅显示一些文本。

faces-config.xml 是 JSF 核心配置文件，以下是其详细内容。

<?xml version="1.0" encoding="UTF-8"?>
<faces-config xmlns="http://java.sun.com/xml/ns/javaee"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd"
 version="1.2">
  <managed-bean>
    <managed-bean-name>userBean</managed-bean-name>
    <managed-bean-class>helloduke.UserBean</managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
  </managed-bean>
  <navigation-rule>
    <display-name>greeting</display-name>
    <from-view-id>/greeting.jsp</from-view-id>
    <navigation-case>
      <from-outcome>duke</from-outcome>
      <to-view-id>/sameName.jsp</to-view-id>
    </navigation-case>
  </navigation-rule>
</faces-config>

在上述文件中，我们声明了 Managed Bean: "userBean"，它的生命周期是session级别，并且定义了导航条件：即当从 greeting.jsp 中返回 "duke" 时，则导航到 sameName.jsp。

由于 JSF 是建立在 JSP/Servlet 基础之上的，因此，我们还需要在 web.xml 中增加为运行 JSF 而必需的一些配置：

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" version="2.5">
  <description>helloDuke</description>
  <display-name>helloDuke</display-name>  
  <servlet>
    <servlet-name>Faces Servlet</servlet-name>
    <servlet-class>javax.faces.webapp.FacesServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>Faces Servlet</servlet-name>
    <url-pattern>*.faces</url-pattern>
  </servlet-mapping>
</web-app>

至此，整个应用已经开发完毕，我们需要将此应用部署在 Apusic应用服务器 5.0 上或者 Tomcat 6.x上。

在 Apusic 5.0 上部署应用请参考 这里 。

在Tomcat上部署应用需要确保已经将 Apusic OperaMasks 部署到 Tomcat 上，可以参考 这里 。

然后通过浏览器打开url： http://localhost:6888/helloDuke/greeting.faces ，即可正常访问应用。

上文中，我们用的全部是 JSF 标准的、常规的做法，但 Apusic OperaMasks 并不仅仅提供了这些功能，我们还能够做得更多、更好。

<application>
  <default-render-kit-id>AJAX</default-render-kit-id>
</application>

8.2. Rich Form

目前，整个应用风格是中规中矩的，我们希望改变一下应用的外观，在 web.xml 中增加如下配置：

<context-param>
  <param-name>org.operamasks.faces.FORM_RICH</param-name>
  <param-value>true</param-value>
</context-param>

重新启动应用，界面风格变成这样：

不是很明显？好吧，让我们将它变成 MaxOS 风格：在 web.xml 中再增加以下参数：

<context-param>
  <param-name>org.operamasks.faces.SKIN</param-name>
  <param-value>aqua</param-value>
</context-param>

重新启动应用，界面风格变成这样：

import org.operamasks.faces.annotation.ManagedBean;
import org.operamasks.faces.annotation.ManagedBeanScope;

@ManagedBean(name="userBean", scope=ManagedBeanScope.SESSION)
public class UserBean {

  private String name;
  ......
}

import org.operamasks.faces.annotation.ManagedBean;
import org.operamasks.faces.annotation.ManagedBeanScope;

@ManagedBean(name="userBean", scope=ManagedBeanScope.SESSION)
public class UserBean {

private String name;

  ......

  public Object sayHello() {
    if("duke".equalsIgnoreCase(name)) return "/sameName.jsp";
    return null;
  }
}

<context-param>
  <param-name>org.operamasks.faces.IMPLICIT_NAVIGATION</param-name>
  <param-value>true</param-value>
</context-param>