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" />

Flex将图像嵌入到路径基于绑定变量的位置

2 个答案: