Question

I want to create a custom list in Flex for an interface prototype. The list is supposed to have an image and 3 text fields. This is what I have done so far, the control displayed is what I want. But, when I click on one of the items, the item does not appear (visually) to be selected. I was not sure how I would implement this.

Here is my code so far:

<s:List width="400" height="220" 
        dataProvider="{arrColl}"
        alternatingItemColors="[#EEEEEE, white]">
    <s:itemRenderer>
        <fx:Component>
            <mx:Canvas height="100">
                <mx:Image height="90" width="120" source="{data.imageSource}"></mx:Image>
                <mx:Label left="125" y="10" text="{data.title}" />
                <mx:Label left="125" y="30" text="{data.type}" />
                <mx:Label left="125" y="50" text="{data.description}" />
            </mx:Canvas>
        </fx:Component>
    </s:itemRenderer>
</s:List>

Answer 1

For anyone else, who is stuck and on the same boat – this is what I did and it works now:

<mx:List width="400" height="220" 
        dataProvider="{arrColl}"
        alternatingItemColors="[#EEEEEE, white]">
    <mx:itemRenderer>
        <fx:Component>
                <mx:Canvas height="100">
                    <mx:Image height="90" width="120" source="{data.imageSource}"></mx:Image>
                    <mx:Label left="125" y="10" text="{data.title}" fontWeight="bold" />
                    <mx:Label left="125" y="30" text="{data.type}" fontStyle="italic" />
                    <mx:Label left="125" y="50" text="{data.description}" />
                </mx:Canvas>
        </fx:Component>
    </mx:itemRenderer>
</mx:List>

Note: The difference is the List and itemRenderer are from the mx namespace rather than the s namespace.