Search code examples
actionscript-3apache-flexflex4

Dynamically Selecting Embedded Image For A List Based on data result from SQLite


I have a Spark list which needs different images loaded into it based on data coming through from an SQlite query.

In SQLite I have a column called "IconId" which for example might contain the value "1", "2", "3" etc representing an icon image.

My Icon images are Embedded in a class called "ImageResources" as follows:

[Bindable]
public class ImageResources
{

[Embed(source="../assets/caticons/icon1.jpg")]
    public static var Ic1Cla:Class;

[Embed(source="../assets/caticons/icon2.jpg")]
    public static var Ic2Cla:Class;
}

Then I have the itemrenderer for my Spark List which has a Bitmap which I use to set the icon I want to use for the list item like this.. This is a static example which works:

<s:BitmapImage source="{ImageResources.Ic1Cla}"   
         x="5" y="2">

</s:BitmapImage>

My question is..Can I dynamically concatenate the BitmapImage source somehow to something that will take the number coming from my SQLite data e.g "1" into something like this:

<s:BitmapImage source="{ImageResources.Ic[data.IconId]Cla}"   
         x="5" y="2">

</s:BitmapImage>

Obviously this doesn't work but I'm not sure if it's a simple syntax issue or whether it could even be done in this manner.

Any help would be much appreciated.


Solution

  • You can dynamically access a variable such as:

    <s:BitmapImage source="{ImageResources['Ic' + data.IconId + 'Cla']}" />
    

    There are other approaches, such as using a state system. By setting the current state as in currentState = "image" + data.IconId; this could be implemented as:

    <s:states>
        <s:State name="image1" />
        <s:State name="image2" />
    </s:states>
    
    <s:BitmapImage source.image1="{ImageResources.Ic1Cla}"
                   source.image2="{ImageResources.Ic2Cla}" />