Flex 4：构建具有背景的组

Posted 2021-03-31

我正在尝试构建一个简单的组件，将spark.components.Group扩展为具有背景颜色，更具体地说是一个spark.primitives.Rect组件，它被拉伸以填充背景。

这就是我到目前为止所提出的：

<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/halo"
    <fx:Metadata>
        [DefaultProperty(name="content")]
    </fx:Metadata>

    <s:Rect id="background" width="100%" height="100%">
        <s:fill>
            <s:SolidColor color="#990000"/>
        </s:fill>
    </s:Rect>

    <s:Group id="container"/>

    <s:filters>
        <!-- For good measure ;) -->
        <s:DropShadowFilter color="#000000" strength="0.4" blurX="5" blurY="5" distance="2" angle="90"/>
    </s:filters>

    <fx:Script>
        <![CDATA[
            public function set content(value:Array):void {
                this.container.mxmlContent = value;
            }
        ]]>
    </fx:Script>
</s:Group>

好的，所以这里的逻辑基本上是有道理的，对吧？在MXML中声明的所有子项都转到名为“container”的组中。这工作得很好。但是，当我运行下面的示例时，布局完全是fubar。

<s:VGroup>
    <!-- This is the component described above -->
    <components:MessageContainer id="component" width="100" height="100"/>
    <mx:Slider/>
    <mx:Slider/>
    <mx:ColorPicker/>
</s:VGroup>

这就是它的样子：

这里有什么我想念的吗？也许我需要覆盖一种方法？

答案

奇怪的。我只是使用Skin实现并将其应用于SkinnableContainer。我也正在使用Flex 4的Beta 2版本进行编译。确实非常奇怪。

另一答案

你使用什么版本的flex 4？我只是准确地复制了你的代码，输出看起来像你期望的那样。

我正在运行在过去几周内发布的beta 2版本。 Build 4.0.0.253292。如果您没有运行最新版本，则可以升级构建，但也可以尝试清理项目。可能只是感到困惑。还要确保您的浏览器没有缓存swf，这有时会在文件大小没有显着变化时发生。