This is a screenshot of the canvas.
I have a visual objet - circle table. It has circles around it - circle chairs. On those chairs a user guestIcon object by dragging it onto the chair. guestIcon has a label child visually near the chair itself. I explicitly assign a hitArea for each chair (and a guestIcon object has a hitArea too, which doesn't include it's label):
var hitAreaSprite:UIComponent = new UIComponent();
hitAreaSprite.visible = false;
hitAreaSprite.mouseEnabled = false;
hitAreaSprite.graphics.beginFill(0xFFFF00, 1.0);
hitAreaSprite.graphics.drawCircle(0, 0, this.radius);
hitAreaSprite.graphics.endFill();
this.addChild(hitAreaSprite);
this.hitArea = hitAreaSprite;
I assign an EventListener for chair only (for drag events):
this.addEventListener(DragEvent.DRAG_ENTER, onDragEnter);
this.addEventListener(DragEvent.DRAG_EXIT, onDragExit);
this.addEventListener(DragEvent.DRAG_DROP, onDragDrop);
private function onDragEnter(event:DragEvent):void
{ ... }
private function onDragExit(event:DragEvent):void
{ ... }
private function onDragDrop(event:DragEvent):void
{ ... }
Everything works fine except one case: when I try to drag a guest, for example, "Suzanna Smith" on a chair which is covered by other chair's guestIcon label ("SomeName Some" label) onDragEnter() reacts from "SomeName Some" but not chair no.2!
How do I make objects to ignore the labels of guestIcon?