I discovered the MouseEvent.ROLL_OVER/ROLL_OUT alternatives to MouseEvent.MOUSE_OVER/MOUSE_OUT and solved the problem, but I'd suggest that Adobe add this to an FAQ because I think others will run into the same confusion.

-Tom

On 4/10/06, Tom Bray <[EMAIL PROTECTED]> wrote:
In other words, if you have a custom itemRenderer that has a state that adds a child, that child will cause a mouseOut event to occur on its parent if you roll over it.

-Tom


On 4/10/06, Tom Bray <[EMAIL PROTECTED]> wrote:
If you run the code below you'll see a list with 4 items.  If you roll over an item, the itemRenderer for that row will add a child Label component with the text "info".  If you roll over the "info" text, the itemRender will flicker between states because the mouseOver and mouseOut events for the HBox container are firing repeatedly.  I tried using stopImmediatePropagation for all the mouse events of the info Label, but it doesn't help.  Is this a bug or am I missing something?

Here's the application code:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml " xmlns="*" layout="absolute" >
    <mx:Canvas width="100%" height="100%">
        <mx:List width="200" dataProvider="{[{label:'a'},{label:'b'},{label:'c'},{label:'d'}]}" itemRenderer="TestRenderer"/>
    </mx:Canvas>
</mx:Application>

And here's the code for TestRenderer.mxml, the custom itemRenderer:

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx=" http://www.adobe.com/2006/mxml" xmlns="*" width="100%" height="100%" mouseOver="handleMouseOver(event)" mouseOut="handleMouseOut(event)">
    <mx:Script>
        <![CDATA[
       
        private function handleMouseOver(e:MouseEvent):void
        {
            trace( "mouse over event for hbox" );
            currentState = 'over';
        }
       
        private function handleMouseOut(e:MouseEvent):void
        {
            trace( "mouse out event for hbox" );
            currentState = '';
        }       

        private function ignoreEvent(e:MouseEvent):void
        {
            e.stopImmediatePropagation();
        }                       
        ]]>
    </mx:Script>
    <mx:Label id="myLabel" text="{ data.label}"/>
    <mx:Spacer width="100%" />
    <mx:states>
        <mx:State name="over">       
            <mx:AddChild>
                <mx:Label id="info" text="info" color="#0000FF" mouseOver="ignoreEvent(event)" mouseOut="ignoreEvent(event)" mouseMove="ignoreEvent(event)" mouseDown="ignoreEvent(event)" />
            </mx:AddChild>
        </mx:State>
    </mx:states>   
</mx:HBox>

Thanks,

-Tom




--
Flexcoders Mailing List
FAQ: http://groups.yahoo.com/group/flexcoders/files/flexcodersFAQ.txt
Search Archives: http://www.mail-archive.com/flexcoders%40yahoogroups.com




YAHOO! GROUPS LINKS




Reply via email to