Reputation: 97
I have a canvas then on top of this I have put a textarea. Then I have added listeners:
returnInfoCanvas.addEventListener(MouseEvent.MOUSE_DOWN, startdrag); returnInfoCanvas.addEventListener(MouseEvent.MOUSE_UP, stopdrag); returnInfoCanvas.getChildByName('textareaName').addEventListener(MouseEvent.MOUSE_DOWN, stopdrag);
and then I inserted a startdrag and stopdrag handlers with startdrag() and stopdrag() functions.
What's wrong with this code? When I click and try to select text in the textarea whole canvas is dragged and I can't select text.
Chris
Upvotes: 0
Views: 64
Reputation: 4147
Here is what I think is happening. The Flex event MouseEvent class bubbles. What that means is that when you mouse down anywhere in the Canvas or its children, the Canvas will hear and process the MouseDown event (assuming all the children allow the event to continue bubbling). That is why the Canvas shows the dragging behavior.
To prevent this, you have to add a MouseEvent.MOUSE_DOWN handler to your TextArea. In this handler, you are going to invoke event.stopPropagation(). What this does, is it keeps the MouseEvent from bubbling up to its parent container and being processed there. Your fix might look something like this...
<TextArea>
...
protected function initializeHandler( event:FlexEvent ):void
{
this.addEventListener( MouseEvent.MOUSE_DOWN , mouseDownHandler );
}
protected function mouseDownHandler( event:MouseEvent ):void
{
event.stopPropagation();
}
...
</TextArea>
Make sure you use stopPropagation and not stopImmediatePropagation as that will stop any other handlers on your textarea from working. One caveat is that I haven't done this myself, so you might end up having to add it to the RichTextEditor of the TextArea component, just something to keep in mind.
Upvotes: 1