Detecting the current state on a Spark List control item renderer in Flex 4

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2010/05/15/detecting-the-current-state-on-a-spark-list-control-item-renderer-in-flex-4/ -->
<s:Application name="Spark_List_itemRenderer_currentState_test"
        xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx">
 
    <s:List id="lst"
            itemRenderer="skins.CustomItemRen"
            width="200"
            horizontalCenter="0" verticalCenter="0">
        <s:layout>
            <s:VerticalLayout gap="0"
                    horizontalAlign="contentJustify"
                    requestedRowCount="6" />
        </s:layout>
        <s:dataProvider>
            <s:ArrayList source="[one,two,three,four,five,six,seven,eight,nine]" />
        </s:dataProvider>
    </s:List>
 
</s:Application>

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2010/05/15/detecting-the-current-state-on-a-spark-list-control-item-renderer-in-flex-4/ -->
<s:ItemRenderer name="CustomItemRen"
        xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        autoDrawBackground="true">
    <s:states>
        <s:State name="normal" />
        <s:State name="hovered" />
        <s:State name="selected" />
        <s:State name="normalAndShowsCaret" />
        <s:State name="hoveredAndShowsCaret" />
        <s:State name="selectedAndShowsCaret" />
    </s:states>
 
    <s:Label text="{itemIndex}) {currentState}"
            left="3" right="3" top="5" bottom="5" />
 
</s:ItemRenderer>