3

在 JSF 2.0 中，我想将多个小部件放入一个小部件容器（即带有标题文本的 div）中。

我将小部件容器创建为复合材料：

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:rich="http://richfaces.org/rich"
    xmlns:composite="http://java.sun.com/jsf/composite">

<composite:interface name="tileContainer" displayName="Tile container respectively category."
    shortDescription="This tile container may be used to gather multiple different tiles. Caution. Let CSS take care of the layout, the composite the logic.">
    <composite:attribute name="title" default="" required="false"
        type="java.lang.String" />
</composite:interface>

<composite:implementation>
    <div class="tileContainer">
        <div class="title">#{cc.attrs.title}</div>
    </div>
</composite:implementation>
</html>

这是需要嵌入到 tileContainer 中的小部件：

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:rich="http://richfaces.org/rich"
    xmlns:composite="http://java.sun.com/jsf/composite">

<!-- INTERFACE -->
<composite:interface name="pictureTextTile" shortDescription="Provides a top-aligned imaged followed by text.">
    <composite:attribute name="title" default="" required="false"
        type="java.lang.String" />      
    <composite:attribute name="isVerticalStacked" default="true" type="java.lang.Boolean"/>
    <composite:attribute name="picture" required="false"/>
    <composite:attribute name="teaser" required="false" type="java.lang.String"/>
    <composite:attribute name="article" required="true" type="java.lang.String"/>
</composite:interface>

<!-- IMPLEMENTATION: REUSABLE FOR CREATE AND UPDATE ACTIONS-->
<composite:implementation>
    <div class="tile">
        <div class="image">#{cc.attrs.image}</div>
        <div class="title">#{cc.attrs.title}</div>
        <div class="teaser">#{cc.attrs.teaser}</div>
        <div class="article">#{cc.attrs.article}</div>
    </div>
</composite:implementation>
</html>

我试图像这样调用它：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:c="http://java.sun.com/jsp/jstl/core"
    xmlns:rich="http://richfaces.org/rich"
    xmlns:mywidgets="http://java.sun.com/jsf/composite/widgets">

<ui:composition template="/templates/overview.xhtml">

    <ui:define name="title">Overview</ui:define>

    <ui:define name="body">

        <mywidgets:tileContainer title="Profession">
            <mywidgets:pictureTextTile title="Websockets" article="Lorem Ipsum"></mywidgets:pictureTextTile>        
        </mywidgets:tileContainer>              

        <mywidgets:tileContainer title="Sports"/>
    </ui:define>
</ui:composition>
</html>

我如何能够将其他不同类型的小部件（组合）插入到divtileContainer下方？title

提前感谢任何有经验的知识分享。

4

1 回答 1

2

您可以使用<cc:insertChildren>来指定应插入复合组件的子项的位置。

<div class="title">#{cc.attrs.title}</div>
<cc:insertChildren />
于 2013-07-30T17:16:05.193 回答