Hi,
I'm currently making a UI system for my project, but it is the first time I work with more "advanced' UI concepts.
Currently, my system uses two different entities:
- draggable components (objects I can drag around which will return to their original position on release unless they are over an interactiveComponent).
- interactive components (essentially data holders which will detect that a draggable component has been released over them.
The interactive components work flawlessly (and I am proud/surprised!)
The draggable components on the other hand work almost perfectly except:
my onMouseMove() references the mouse coordinates in such a way that the movement works until the draggable component passes over an object that was drawn after on the stage. What this means is that I have say, a grid of 3X3 objects (draggable components) and I try to drag any of the leftmost ones to the right: I can't because they need to move over other objects.
I believe the problem with my implementation is that the onMouseMove will cease to trigger if there is an object between itself and the mouse (anything "above it"). I'm struggling finding a way to make the draggableObject (currently being dragged) always the topmost item to circumvent this issue.
I'm using DartLang API / StageXL framework which is roughly similar to AS3 except it outputs as HTML5.
Can anyone let me know where I've gone wrong?
Thanks.
