Home/ Questions/Q 4125520
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-20T23:52:49+00:00

I have a TextInput inside a spark Item Renderer. I need to undo some

  • 0

I have a TextInput inside a spark Item Renderer. I need to undo some behavior in a library I’m using by stopPropagation of the mouseDown and mouseUp event for the TextInput. However, I would like the TextInput itself to handle such events normally – otherwise the caret to cursor transitions don’t seem to be properly handled. I’m ashamed to admit, I’m not sure how to do this – seems simple but I have been stuck on it for some time.

thank you!

Edit: ok, here’s some code to explain what’s going on (although it’s completely unrelated from what I’m doing, so it’s not an exact depiction of my specific situation). As I mentioned above I need to be able to stop the propagation of mouseDown and mouseUp from the TextInput to a component up the food chain – event.stopPropagation() in mouseDown and mouseUp for the TextInput does the trick. However, it messes up the caret / cursor handling for the TextInput itself. Try the code below with or without the event.stopPropagation() and you should see what I mean.

Main

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/03/19/using-a-custom-item-renderer-function-with-the-fxlist-control-in-flex-gumbo/ -->
<s:Application name="Spark_List_itemRendererFunction_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">

    <fx:Script>
        <![CDATA[
            import mx.core.ClassFactory;
            import spark.skins.spark.DefaultItemRenderer;

            private function list_itemRendererFunc(item:Object):ClassFactory {
                var cla:Class = DefaultItemRenderer;
                switch (item.type) {
                    case "employee":
                    case "manager":
                        cla = EmployeeItemRenderer;
                        break;
                    default:
                        break;
                }
                return new ClassFactory(cla);
            }
        ]]>
    </fx:Script>

    <s:List id="list"
            labelField="name"
            itemRendererFunction="list_itemRendererFunc"
            horizontalCenter="0" verticalCenter="0">
        <s:dataProvider>
            <s:ArrayList>
                <fx:Object name="Employee 1" type="employee" />
                <fx:Object name="Employee 2" type="employee" />
                <fx:Object name="Employee 3" type="employee" />
                <fx:Object name="Employee 4" type="employee" />
                <fx:Object name="Manager 1" type="manager" />
                <fx:Object name="Manager 2" type="manager" />
                <fx:Object name="Employee 5" type="employee" />
                <fx:Object name="Manager 3" type="manager" />
                <fx:Object name="Consultant 1" type="consultant" />
            </s:ArrayList>
        </s:dataProvider>
    </s:List>

</s:Application>

and EmployeeItemRenderer.mxml

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2009/03/19/using-a-custom-item-renderer-function-with-the-fxlist-control-in-flex-gumbo/ -->
<s:ItemRenderer name="EmployeeItemRenderer"
                xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                xmlns:mx="library://ns.adobe.com/flex/mx" 
                autoDrawBackground="true">

    <fx:Script>
        <![CDATA[
            protected function TI_mouseDownHandler(event:MouseEvent):void
            {
                event.stopPropagation();
            }

            protected function TI_mouseUpHandler(event:MouseEvent):void
            {
                event.stopPropagation();
            }

        ]]>
    </fx:Script>


    <s:HGroup>
        <s:Label id="labelDisplay" left="4" right="4" top="4" bottom="4" />
        <s:TextInput id="TI" mouseDown="TI_mouseDownHandler(event)" mouseUp="TI_mouseUpHandler(event)"/>
    </s:HGroup>

</s:ItemRenderer>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    OK, Sounds like this is only an issue for Flex 4.01 (thank you JAX). In such case I got what I wanted by stopping propagation on the mousedown event but not on the mouseUp. This is a very specific case that applies to my code, so I’m not sure if it’ll be really useful for anyone else. I guess the interesting lesson for me, here, is that mouseUp is the event that is related to caret / system cursor management.

    • 0