Flex嵌入图像，其中路径基于绑定变量

Question

我试图在我的Flex项目中使用项目渲染器嵌入图像。

但是，图像路径是作为绑定变量传入的String。

我知道

<s:BitmapImage source="@Embed('/../assets/image.png')" />

有效，因为图像是在运行时嵌入的？ （有人可以澄清一下）

我将如何嵌入绑定的字符串，有点像这样：

<s:BitmapImage source="@Embed('/../assets/{data.image}')" />

非常感谢

Answer 1

我认为，如果您想嵌入图像但在运行时动态找到它，一个更好的选择是：嵌入所有可能的图像，然后动态获取对其的引用。 我们通常使用这样的模式：

public class Icons {
    [Embed(source="icons/icon1.png")]
    public var icon1:Class;
    [Embed(source="icons/icon2.png")]
    public var icon2:Class;
}

然后，您可以在运行时从Icons实例动态获取嵌入式图像。

编辑-包含示例 -我将使用项目渲染器，因为我认为这就是您正在做的事情。 假设data.image可以是“飞机”，“火车”或“汽车”

<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
            xmlns:s="library://ns.adobe.com/flex/spark" 
            xmlns:mx="library://ns.adobe.com/flex/mx">

    <fx:Script>
        <![CDATA[

            [Embed(source="/assets/icons/plane.png")]
            public var plane : Class;
            [Embed(source="/assets/icons/train.png")]
            public var train : Class;
            [Embed(source="/assets/icons/automobile.png")]
            public var automobile : Class;
        ]]>
    </fx:Script>

    <s:Image source="{this[data.image]}"/>

</s:ItemRenderer>

这是一个非常简单的示例，而不是最佳实现方式，但是您可以理解。

Answer 2

我喜欢在CSS文件中嵌入图标。 然后，在ItemRenderer中，您可以设置CSS类并获取所需的图像。

css文件或mxml css块：

.icons 
{
    bender: Embed(source="/assets/bender.png");
    /* other icons */
}

在渲染器中，当您覆盖设置数据方法时：

override public function set data(value:Object):void
{
    super.data = value;

    var iconName:String = data.image;

    if ( iconName )
    {
        var cssDecl2:CSSStyleDeclaration = styleManager.getStyleDeclaration(".icons");
        var IconClass:Class = cssDecl2.getStyle( iconName );
        bmImage.source = new IconClass();
    }
}

和bmImage作为id s：BitmapImage：

<s:BitmapImage id="bmImage" />