演示组件RichFaces 看上去非常强大；平均每个组件有超过 20 个特定的属性，并且还有非常多的通用属性。但是，大多数属性都有合理的默认值，在一般使用过程中，这些组件的设置并不困难。有些花哨的组件可以处理各种不同的效果，例如 Google Maps 和 Virtual Earth。您可能想使用它们来让用户感到兴奋，但是在这里我还是着重关注那些在很多应用程序中都有用的组件。这足以让我兴奋。
本文主要演示的组件有：
- Calendar—一个弹出式组件，允许选择日期。 显示了一个示例。<和 >滚动月份；<<和 >>滚动年份。单击底部的 Today可以选择今天的日期。单击 Clean可以清除日期选择。左边的数字列显示一年中的星期。图 1. RichFaces Calendar 组件
 - List Shuttle—一个选择和排序组件，可以在可用区与选定区之间移动项目，还可以在选定区中上下移动项目。 显示了一个示例： 图 2. RichFaces List Shuttle 组件
 - Suggestion Box—一个输入组件，提供可点击的建议，以完成输入。显示了一个示例：图 3. RichFaces Suggestion Box 组件
 - Tab Panel—一个输出组件，创建带标记的页面。 显示了一个示例： 图 4. RichFaces Tab Panel 组件
我们还将使用一个 Panel Bar 进行说明。显示了一个示例：
图 5. RichFaces Panel Bar 组件 我们将使用 Simple Toggle Panels 显示结果。 显示了一个示例：
图 6. RichFaces Simple Toggle Panel 组件 如前所述，RichFaces 构建在 Ajax4jsf 之上。以此为基础，任何组件都可以以几种不同的方式支持 Ajax。本文中的示例应用程序为 Suggestion Box 和 Simple Toggle Panel 组件使用 Ajax 功能。
华丽的界面dWRFDemo1示例应用程序很小。它的真正目的是演示所选择组件的设置和使用。因此，它只是收集和显示输入数据。至于如何在生产应用程序中使用数据和组件，我留给您自己去想象。除了必要的 JAR、图像、用作资源包的属性文件以及级联样式表（Cascading Style Sheets，CSS）文件外，该应用程序包括两个 XHTML 页面和两个 Java 类。这种简洁性允许代码具有 IDE 不可知性。实际上，我故意使用一个 Java 编辑器、文件的 Wordpad、javac和 jar命令进行创建。
显示了输入页面的 URL，这里假设 Tomcat 或 Glassfish 采用默认设置，这个 URL 为 http://localhost:8080/dWRichFacesDemo1。 这个输入页面允许使用 Calendar组件选择一个日期。Order ByList Shuttle 组件让您可以移动和重新排列可用项目。 CitySuggestion Box 让您可以输入一个城市名称。City启用了 Ajax 支持； 如果按下空格键，将显示所有可用的城市。如果键入首字母为 A 或 J 的城市名称，那么将列出相应的城市。随着输入的字符数逐渐增多，列表中可用的城市范围逐渐缩小。可以单击左侧的 Panel Bar 条目，查看基本的组件说明。
图 7. dWRFDemo1输入页面 输入完毕后，单击 Submit按钮。 这个应用程序很小，不会执行任何编辑。由于 Calendar 组件禁止手动输入，所以不可能输入无效的日期。 通过 Submit 按钮可以显示结果页面，如 所示：
图 8. dWRFDemo1结果页面 在结果页面上，单击 Result选项卡，然后单击适当的 Simple Toggle Panel 条目，以查看输入值。单击 Edit按钮返回到输入页面。 |
