rich

richfaces标签学习笔记2008年11月18日 星期二 上午 08:46rich:componentControl 标签和rich:ModolPanel标签
示例：
<rich:modalPanel id="panel" width="350" height="100">
        <f:facet name="header">
            <h:panelGroup>
                <h:outputText value="Modal Panel"></h:outputText>
            </h:panelGroup>
        </f:facet>
        <f:facet name="controls">
            <h:panelGroup>
                <h:graphicImage value="/images/modal/close.png" style="cursor:pointer" id="hidelink"/>
                <rich:componentControl for="panel" attachTo="hidelink" operation="hide" event="onclick"/>
</h:panelGroup>
        </f:facet>
        <h:outputText value="This panel is called using Component Control Component"></h:outputText>
        <br/>
        <h:outputText value="Closure link (X) works also through Component Control"></h:outputText>
    </rich:modalPanel>
    <h:outputLink value="#" id="link">
        Show Modal Panel
        <rich:componentControl for="panel" attachTo="link" operation="show" event="onclick"/>
</h:outputLink>
ModolPanel效果：当点击页面中的某元素时，弹出一个类似关机效果的面板。

inputNumberSlider 输入数字滑竿
Panel:
带标题栏的panel
它可以通过h:fecter标签指定标题和底部。

PanelBar:
效果说明：该控件可以实现多个面板的折叠效果，在每个面板的数据区域可以放入任何JSF标签。并且面板的标题可以设定。

<rich:panelBar height="400" width="500">
        <rich:panelBarItem
            label="Write your own custom rich components with built-in AJAX support">
            Component Development Kit (CDK) is a design-time extension for Ajax4jsf. The CDK includes
        </rich:panelBarItem>
        <rich:panelBarItem
            label="Package resources with the application's Java classes ">
            In addition to its core, Ajax functionality of Ajax4jsf provides an advanced
            support for the diff
        </rich:panelBarItem>
        <rich:panelBarItem label="Easily generate images on-the-fly">
            Resource framework can generate images on-the-fly so that it becomes possible
            to create images using the familiar approach of the Java graphic2D library.
        </rich:panelBarItem>
          </rich:panelBar>

PanelMenu标签:

<h:panelGrid columns="2" columnClasses="cols" width="100%">
    <rich:panelMenu style="width:200px" mode="ajax"
        iconExpandedGroup="disc" iconCollapsedGroup="disc"
        iconExpandedTopGroup="chevronUp" iconGroupTopPosition="right"
        iconCollapsedTopGroup="chevronDown" iconCollapsedTopPosition="right" >
        <rich:panelMenuGroup label="Group 1">
            <rich:panelMenuItem label="Item 1.1" action="#{panelMenu.updateCurrent}">
                <f:param name="current" value="Item 1.1"/>
            </rich:panelMenuItem>
            <rich:panelMenuItem label="Item 1.2" action="#{panelMenu.updateCurrent}">
                <f:param name="current" value="Item 1.2"/>
            </rich:panelMenuItem>
            <rich:panelMenuItem label="Item 1.3" action="#{panelMenu.updateCurrent}">
                <f:param name="current" value="Item 1.3"/>
            </rich:panelMenuItem>
        </rich:panelMenuGroup>
        <rich:panelMenuGroup label="Group 2">
            <rich:panelMenuItem label="Item 2.1" action="#{panelMenu.updateCurrent}">
                <f:param name="current" value="Item 2.1"/>
            </rich:panelMenuItem>
            <rich:panelMenuItem   label="Item 2.2" action="#{panelMenu.updateCurrent}">
                <f:param name="current" value="Item 2.2"/>
            </rich:panelMenuItem>
            <rich:panelMenuItem label="Item 2.3" action="#{panelMenu.updateCurrent}">
                <f:param name="current" value="Item 2.3"/>
            </rich:panelMenuItem>
            <rich:panelMenuGroup label="Group 2.4">
                <rich:panelMenuItem label="Item 2.4.1" action="#{panelMenu.updateCurrent}">
                    <f:param name="current" value="Item 2.4.1"/>
                </rich:panelMenuItem>
                <rich:panelMenuItem label="Item 2.4.2" action="#{panelMenu.updateCurrent}">
                    <f:param name="current" value="Item 2.4.2"/>
                </rich:panelMenuItem>
                <rich:panelMenuItem label="Item 2.4.3" action="#{panelMenu.updateCurrent}">
                    <f:param name="current" value="Item 2.4.3"/>
                </rich:panelMenuItem>
            </rich:panelMenuGroup>
            <rich:panelMenuItem label="Item 2.5" action="#{panelMenu.updateCurrent}">
                    <f:param name="current" value="Item 2.5"/>
            </rich:panelMenuItem>
        </rich:panelMenuGroup>
        <rich:panelMenuGroup label="Group 3">
            <rich:panelMenuItem label="Item 3.1" action="#{panelMenu.updateCurrent}">
                    <f:param name="current" value="Item 3.1"/>
            </rich:panelMenuItem>
            <rich:panelMenuItem label="Item 3.2" action="#{panelMenu.updateCurrent}">
                    <f:param name="current" value="Item 3.2"/>
            </rich:panelMenuItem>
            <rich:panelMenuItem label="Item 3.3" action="#{panelMenu.updateCurrent}">
                    <f:param name="current" value="Item 3.3"/>
            </rich:panelMenuItem>
        </rich:panelMenuGroup>
    </rich:panelMenu>
    <rich:panel bodyClass="rich-laguna-panel-no-header">
        <a4j:outputPanel ajaxRendered="true">
            <h:outputText value="#{panelMenu.current} selected" id="current"/>
        </a4j:outputPanel>
    </rich:panel>
    </h:panelGrid>


progressBar标签 :

    <h:form>
        <a4j:outputPanel id="progressPanel">
            <rich:progressBar value="#{progressBarBean.currentValue}"
                interval="2000" label="#{progressBarBean.currentValue} %"
                enabled="#{progressBarBean.enabled}" minValue="-1" maxValue="100"
                reRenderAfterComplete="progressPanel">
                <f:facet name="initial">
                    <br />
                    <h:outputText value="Process doesn't started yet" />
                    <a4j:commandButton action="#{progressBarBean.startProcess}"
                        value="Start Process" reRender="progressPanel"
                        rendered="#{progressBarBean.buttonRendered}"
                        style="margin: 9px 0px 5px;" />
                </f:facet>
                <f:facet name="complete">
                    <br />
                    <h:outputText value="Process Done" />
                    <a4j:commandButton action="#{progressBarBean.startProcess}"
                        value="Restart Process" reRender="progressPanel"
                        rendered="#{progressBarBean.buttonRendered}"
                        style="margin: 9px 0px 5px;" />
                </f:facet>
            </rich:progressBar>
        </a4j:outputPanel>
    </h:form>