Question

I have one list, which the item render it`s like this:link.
But now I need to enable or disable the button delete depends the view state which my List is inside.

This is my view(which contains the list):

<s:states>
    <s:State name="main" />             <!-- Navigation.CART_MAIN  -->
    <s:State name="cash" />             <!-- Navigation.CART_CASH  -->
    <s:State name="credit" />           <!-- Navigation.CART_CREDIT  -->
</s:states>
    <s:List id="theList"
            width="480" height="240"
            x="69" y="82"
            dataProvider="{model.products}"
            useVirtualLayout="false"
            itemRenderer="com.png.vm.ui.components.ProductCartThumbnail" >

    </s:List>

The thing is that I just want to enable the delete buttons inside the itemRender when the screen is using the state “main”

Answer 1

Another option would be to create separate itemRenderers and use the itemRendererFunction.

I’ve taken this example from similar question that was asked earlier and modified it a bit to suit your needs:

flex 4 list ItemRenderer: how can i have different itemrenderers for different rows?

<fx:Script>
    <![CDATA[
        import renderers.*;

        import mx.core.ClassFactory;
        import spark.skins.default.DefaultItemRenderer;

        private function list_itemRendererFunc(item:Object):ClassFactory {
            var cla:Class = MainItemRenderer;
            switch (currentState) {
                case "main":
                    cla = MainItemRenderer;
                    break;
                default:
                    cla = CashCreditItemRenderer;
                    break;
            }
            return new ClassFactory(cla);
        }
    ]]>
</fx:Script>

<s:List id="theList"
        x="69" y="82"
        itemRendererFunction="list_itemRendererFunc"
        dataProvider="{model.products}"
        useVirtualLayout="false">

EDIT:
Here’s the other solution that was used. You can designate different itemRenderers by declaring different property values for each state.

<s:List id="theList" 
        width="393" height="223" 
        x="42" y="69" 
        dataProvider="{model.products}" 
        useVirtualLayout="false" 
        itemRenderer.main="com.png.vm.ui.components.ProductCartThumbnail" 
        itemRenderer="com.png.vm.ui.components.ProductCartThumbnailReadOnly">