创建 JSF Web 项目和页面模板（4）

2019-11-18 12:52:39

字体：大中小

来源：转载

供稿：网友

　　把 Panel - Group Box 拖到页面的底部。此时，选择 Grid，如图31 所示。Grid 以叠放的方式组织组件。
　　
　　图 31.选择 Grid
　　　创建 JSF Web 项目和页面模板（4）（图一）

　　从选项板选择 Faces Components 下的 Image 组件（图 32），然后把它拖到页面的底部。
　　　
　　图32. Image 组件
　　　创建 JSF Web 项目和页面模板（4）（图二）

　　图 33. 面板中的图像
　　　创建 JSF Web 项目和页面模板（4）（图三）

　　高亮显示图像框，然后转到 Attribute 视图（图34）。像前面一样选择 File 文本框后的 Browse。
　　图 34. 浏览图像
　　　创建 JSF Web 项目和页面模板（4）（图四）

　　选择 WEBSPHERE_22P.GIF，如图35 所示。（记得更改文件名以使用相对路径。）
　　图 35.选择 WEBSPHERE_22P.GIF
　　　创建 JSF Web 项目和页面模板（4）（图五）

　　模板应该看起来如图36 所示。
　　图 36. 带有全部组件的 Template页面
　　　创建 JSF Web 项目和页面模板（4）（图六）

　　最后，我们需要更新最后一个属性。页面中的所有组件都嵌入到一个 Body 标签中。转到属性视图并从下拉菜单中选择 Body（图 37）。
　　图 37. 从 Attribute 视图中选择 BODY
　　　创建 JSF Web 项目和页面模板（4）（图七）

　　单击 Image 字段后面的下拉框，然后选择 Browse（图 38）。
　　图 38. 浏览图像
　　　创建 JSF Web 项目和页面模板（4）（图八）

　　选择 theme 文件夹中的 grid.gif （图 39）。
　　图 39. 选择 grid.gif
　　　创建 JSF Web 项目和页面模板（4）（图九）

　　最后得到的页面应该看起来如图 40 所示。
　　图 40. 最后得到的页面
　　　创建 JSF Web 项目和页面模板（4）（图十）

　　选择 PReview 标签查看最后的结果，如图 41 所示。
　　图 41. 预览标签
　　创建 JSF Web 项目和页面模板（4）（图十）

　　保存并关闭模板文件。
　　
　　结束语
　　在本文中，我们介绍了 WebSphere Studio Version 5.1.1 提供的新 java Server Faces 工具，构建了一个 Web 项目，然后利用 Faces 组件创建了一个页面模板。在本系列的下一部分，我们将创建 JSF 提交表单并利用 WebSphere Universal 测试环境来测试它们。

上一篇：创建 JSF Web 项目和页面模板（2）

下一篇：创建 JSF Web 项目和页面模板（3）

学习交流

索泰发布一款GTX 1070 Mini迷你版本:小机

索泰发布一款GTX 1070 Mini迷你版本:小机箱大爱...

热门图片

猜你喜欢的新闻

猜你喜欢的关注