css - Adobe Flex 在矩形内显示内容 (itemRenderer)

Question

我有一个简单的问题，但首先我描述了场景:

刚刚编写了我的第一个 ItemRenderer 用于测试假设。我在我的应用程序中获得了一个用户 ListView ，并在其上的数据提供者中声明了一些对象。在 itemRenderer 上，我想在 TileGroup 的矩形内显示每个对象(具有名称和图标的用户)。我现在的问题是，矩形显示在(用户)对象旁边而不是它周围，并且不允许在矩形内声明组件。

这是我的 itemRenderer 的代码:

<s:TileGroup requestedColumnCount="4" requestedRowCount="1">
    <s:Rect id="infoRect" width="100%" height="100%" left="0" right="0">
        <s:stroke>
            <s:SolidColorStroke color="0xFFFFFF" weight="1" />
        </s:stroke>
        <s:fill>
            <s:SolidColor color="white" />              
        </s:fill>
    </s:Rect>

    <s:VGroup width="100%" height="100%">
        <s:Label id="labelName" text="Name: {data.Name}"
                 color="red" />
        <s:Label id="labelVerbindung" text="Verbindung: {data.Verbindung}"
                 color="red" />
        <s:BitmapImage id="labelIcon" source="{data.Icon}" />
    </s:VGroup> 
</s:TileGroup>

作为解决方法，我尝试使用简单的 CSS 并为 VGroup 赋予以下属性 styleName=".borderClass"，但也没有显示效果:

<fx:Style>
    @namespace s "library://ns.adobe.com/flex/spark";
    @namespace mx "library://ns.adobe.com/flex/mx";
    .borderClass {
        border-style: solid;
        border-width: 3px;
        border-color: red;
    }
</fx:Style>

关于如何解决这个问题有什么建议吗？

Answer 1

好吧，我只是愚蠢...只是使用 BorderContainer 而不是 Rectangle，它工作得很好。