开发学院软件开发 Java ICEfaces 和 Google Translate 阅读

ICEfaces 和 Google Translate

　2009-11-05 00:00:00　来源：WEB开发网　　　

核心提示： 本教程中的三个步骤可以归纳为图 3 所示的目标结构，在阅读本教程时，ICEfaces 和 Google Translate(4)，我们假定您熟悉如何为 ICEfaces 配置环境，以确保您的环境经过适当配置，另一个用于显示经过翻译的文本）两个 commandButton UI 控件，一个用于重置

本教程中的三个步骤可以归纳为图 3 所示的目标结构。在阅读本教程时，我们假定您熟悉如何为 ICEfaces 配置环境，以确保您的环境经过适当配置，可以在 J2EE 应用服务器上部署和执行 ICEfaces 应用程序。有关详细信息，请参见与您环境相关的文件，并参阅 ICEfaces 文档。

图 3. 项目浏览器中的 ICEFacesAndGoogleTranslate 应用程序
ICEfaces 和 Google Translate

步骤 1. 创建 JSF 应用程序

第一步是使用 stock JSF 组件创建一个常规 JavaServer Faces (JSF) 版本的 Google Translate Web 应用程序。所有相关文件都存储在 WebContent 目录中。

首先，Google Translate 应用程序的顶部需要一个 panelGroup 组件，用于提供 panelDivider，它将页面分为两个部分。第一个部分包括：

一个 outputText 组件，作用类似于标签

一个 inputTextArea 组件，用于供用户输入文本

两个 selectOneMenu UI 控件，用于选择原始和目标语言

一个 graphicImage 组件，用于设置一个箭头

第二部分包括：

两个 outputText 组件（一个类似于标签，另一个用于显示经过翻译的文本）

两个 commandButton UI 控件。一个用于重置，另一个用于翻译

清单 1 显示了 main.jspx page 的代码。

清单 1. main.jspx 页面
<?xml　version="1.0"　encoding="UTF-8"　?>　 <jsp:root　version="1.2"　xmlns:jsp="http://java.sun.com/JSP/Page"　　xmlns:f="http://java.sun.com/jsf/core"　　xmlns:h="http://java.sun.com/jsf/html"　　xmlns:ice="http://www.icesoft.com/icefaces/component">　　<jsp:directive.page　contentType="text/html;charset=UTF-8"　　pageEncoding="UTF-8"　/>　 <f:view>　　<ice:outputDeclaration　doctypeRoot="HTML"　　doctypePublic="-//W3C//DTD　HTML　4.01　Transitional//EN"　　doctypeSystem="http://www.w3.org/TR/html4/loose.dtd"　/>　　<html>　　<head>　　<title><ice:outputText　value="Translate　Tutorial"　/></title>　　<ice:outputStyle　href="./xmlhttp/css/xp/xp.css"　/>　　</head>　　<body>　　<ice:outputText　value="Welcome　to　Translate　Tutorial"　/>　　<ice:form　partialSubmit="true">　　<ice:messages　/>　　<ice:panelGroup　id="pnlGrp"　>　　<ice:panelDivider　id="pnlDiv"　orientation="vertical"　　style="width:100%;">　　<f:facet　name="first">　　　<ice:panelGrid　id="firstPartTrsltPnlGrp"　columns="1"　　　　style="padding:　10px;width:　100%"　>　　　<ice:outputText　id="outTxtTrnslt"　value="Text　to　translate:"　　　　style="line-height:2em;"　/>　　　<ice:inputTextarea　id="inputTextTrnslt"　style="width:100%"　　　　cols="20"　rows="5"　partialSubmit="true"　　　　value="#{translate.text}"　>　　　</ice:inputTextarea>　　　<ice:panelGroup　id="menues"　style="width:100%"　>　　　<ice:selectOneMenu　id="slcOnMenuOrigLang"　　　　　value="#{translate.selectedOriginalLanguage}"　　　　　　　　　　　　　　　　valueChangeListener="#{translate.originalLangChanged}">　　　　<f:selectItems　　　　　　　　　　　　　　　　　　　　value="#{translate.ORIGINAL_LANGUAGES}"　/>　　　</ice:selectOneMenu>　　　<ice:graphicImage　id="imgArrowRight"　　　　url="/images/arr_ani_01e.gif">　　　</ice:graphicImage>　　　<ice:selectOneMenu　id="slcOnMenuTrasltLang"　　　　　　　　　　　　　　value="#{translate.selectedTranslatedLanguage}"　　　　　　　　　　　　　　valueChangeListener="#{translate.translateLangChanged}">　　　　<f:selectItems　value="#{translate.TRANSLATION_LANGUAGES}"　/>　　　</ice:selectOneMenu>　　　</ice:panelGroup>　　　</ice:panelGrid>　　</f:facet>　　　　　<f:facet　name="second">　　　<ice:panelGroup　id="secPartPblGrp"　style="padding:　10px;">　　　<ice:outputText　id="trnsltTxt"　value="Translated　text"　　　　　style="line-height:2em"　/>　　　<ice:panelGrid　id="scndPartTrnsltTxtPnlGrd"　columns="1">　　　　<ice:outputText　id="outPtTxtScndPrt"　　　　　　　value="#{translate.outputText}"　　　　　　　　　　　　　　　　　　　　　　　effect="#{translate.textEffect}">　　　　</ice:outputText>　　　<ice:panelGrid　id="pnlGrdButtonsSecondPart"　columns="2">　　　　<ice:commandButton　id="btnResetScndPart"　　　　　　　　　　　　　　　　　　　　　value="reset"　　　　　　　　　　actionListener="#{translate.resetAll}"　/>　　　　<ice:commandButton　id="btnTranslitScndPart"　　　　　　　　　　　　　　　　　　　　value="translate"　　　　　　　　　　　　　　　　　actionListener="#{translate.updateText}"　/>　　　</ice:panelGrid>　　　</ice:panelGrid>　　　</ice:panelGroup>　　</f:facet>　　</ice:panelDivider>　　</ice:panelGroup>　　</ice:form>　　</body>　　</html>　 </f:view>　 </jsp:root>　