用 JavaServer Faces 2 实现可扩展 UI （6）
|
- UID
- 1066743
|
用 JavaServer Faces 2 实现可扩展 UI （6）
icon 组件：一个简单的复合组件places 应用程序使用了图 6 所示的这两个图标：
图 6. places 应用程序的图标每个图标都是一个链接。当用户单击 左侧的图标时，JSF 就会显示当前视图的标记，而激活右侧图标则会使用户登出此应用程序。
可以为链接指定一个 CSS 类名和图像，并且还可以向链接附加方法。当用户单击一个被关联的链接时，JSF 就会调用那些方法。
清单 11 给出了 icon 组件是如何被用来在 places 应用程序中显示标记的：
清单 11. 使用 icon 组件显示标记1
2
3
4
5
6
7
| <html xmlns="http://www.w3.org/1999/xhtml"
xmlns:util="http://java.sun.com/jsf/composite/components/util">
<util:icon actionMethod="#{sourceViewer.showSource}"
image="#{resource['images:disk-icon.jpg']}"/>
...
</html>
|
清单 12 给出了如何使用 icon 组件执行登出：
清单 12. 使用 icon 组件执行登出1
2
3
4
5
6
7
| <html xmlns="http://www.w3.org/1999/xhtml"
xmlns:util="http://java.sun.com/jsf/composite/components/util">
<util:icon actionMethod="#{places.logout}"
image="#{resource['images:back-arrow.jpg']}"/>
...
</html>
|
清单 13 给出了 icon 组件的代码：
清单 13. icon 组件1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:composite="http://java.sun.com/jsf/composite">
<!-- INTERFACE -->
<composite:interface>
<composite:attribute name="image"/>
<composite:attribute name="actionMethod"
method-signature="java.lang.String action()"/>
</composite:interface>
<!-- IMPLEMENTATION -->
<composite:implementation>
<h:form>
<h:commandLink action="#{cc.attrs.actionMethod}" immediate="true">
<h:graphicImage value="#{cc.attrs.image}"
styleClass="icon"/>
</h:commandLink>
</h:form>
</composite:implementation>
</html>
|
与其他复合组件类似， 中的 icon 组件包含两节：<composite:interface> 和 <composite:implementation>。<composite:interface> 节定义了一个界面，可用来配置此组件。icon 组件具有两个属性：image 和 actionMethod，前者定义了组件的外观，后者定义了组件的行为。
<composite:implementation> 节包含组件的实现。它使用 #{cc.attrs.ATTRIBUTE_NAME} 表达式来访问组件的界面内定义的属性。（cc 是 JSF 2 表达式语言中的保留关键字，代表的是复合组件。） |
|
|
|
|
|
