Olá, criei este tópico com o objetivo de auxiliar membros menos experientes na utilização de componentes do richfaces. Segue o código de exemplo logo abaixo:
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@taglib prefix="rich" uri="http://richfaces.org/rich"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%--
This file is an entry point for JavaServer Faces application.
--%>
<f:view>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>JSP Page</title>
</head>
<body>
<h:form>
<f:verbatim><div align="center"></f:verbatim>
<!--aqui começa o panel-->
<rich:panel style="width:236px;">
<f:facet name="header">
<h:outputText value="Tela de Login"/>
</f:facet>
<h:panelGrid columns="2">
<h:panelGroup>
<h:outputLabel id="lblLogin" for="txtLogin" value="Usuário:"/>
</h:panelGroup>
<h:panelGroup>
<h:inputText id="txtLogin" required="true">
<f:validateLength minimum="8"/>
</h:inputText>
</h:panelGroup>
<h:panelGroup>
<h:outputLabel id="lblSenha" for="txtSenha" value="Senha:"/>
</h:panelGroup>
<h:panelGroup>
<h:inputSecret id="txtSenha" required="true">
<f:validateLength minimum="8"/>
</h:inputSecret>
</h:panelGroup>
</h:panelGrid>
<h:panelGrid columns="1">
<f:facet name="footer">
<h:commandButton id="cmdLogin" value="Efetuar Login">
<rich:componentControl for="panel" attachTo="cmdLogin" operation="show" event="onclick"/>
</h:commandButton>
</f:facet>
</h:panelGrid>
</rich:panel>
<!--aqui termina o panel-->
<f:verbatim></div></f:verbatim>
<!--aqui começa o modal panel-->
<f:subview id="modal">
<rich:modalPanel id="panel" width="360">
<f:facet name="header">
<h:panelGroup>
<h:outputText value="Alerta"/>
</h:panelGroup>
</f:facet>
<f:facet name="controls">
<h:panelGroup>
<h:graphicImage value="/img/close.png" styleClass="hidelink" id="hidelink"/>
<rich:componentControl for="panel" attachTo="hidelink" operation="hide" event="onclick"/>
</h:panelGroup>
</f:facet>
<!--aqui começa o message-->
<rich:message for="txtLogin">
<f:facet name="ok">
<h:graphicImage value="/img/passed.gif"/>
</f:facet>
<f:facet name="erro">
<h:graphicImage value="/img/error.gif"/>
</f:facet>
</rich:message>
<f:verbatim><br></f:verbatim>
<rich:message for="txtSenha">
<f:facet name="ok">
<h:graphicImage value="/img/passed.gif"/>
</f:facet>
<f:facet name="erro">
<h:graphicImage value="/img/error.gif"/>
</f:facet>
</rich:message>
<!--aqui termina o message-->
</rich:modalPanel>
</f:subview>
<!--aqui termina o modal panel-->
</h:form>
</body>
</html>
</f:view>