Search Unity

Make VisualElement receive events even when out of bounds of parent container

Discussion in 'UIElements' started by Cence99, May 25, 2019.

  1. Cence99


    Apr 14, 2013
    Hello there,

    I am currently working on a Behaviour Tree Editor. So far I was able to implement panning & zooming by scaling and translating a VisualElement container which is the parent of all nodes.

    However, when the nodes leave the container's rectangle, they do not receive default-action events anymore and thus cannot be dragged by the user. I have discovered a method called `panel.Pick()` that I might use to check if the user clicks on a node, but if this uses the same logic then it won't solve my problem.

    My question is: How do I make the children of a VisualElement-container receive events even when they are out of bounds of their parent's rectangle?

    My current solution is simply setting the container's size to a high arbitrary value in CSS like 5000. This introduces noticable jiggle of UI elements at positions with big numbers (5000 already introduces weird behaviour). On top of that, if the user still ends up dragging the nodes out of the container, they are not interactable anymore.

    I wonder how Unity's Animator window handles this. There seems to be no jiggle no matter how far away the elements are from the center / origin. I have asked in various Discord communities, but UIElements seems to be too new for anyone to know how to solve my problem.

    Thanks a lot in advance, I am looking forward to hearing your suggestions!
  2. uDamian


    Unity Technologies

    Dec 11, 2017
    This seems like a bug. Elements should still receive events outside their parent's rectangle. I'll dig a little and get back to you.
  3. patrickf


    Unity Technologies

    Oct 24, 2016
    Hi, large values cause problems because of the limited precision of floats. You would have to get around this problem by mapping the world position of your node to the viewable pixel position.

    As for node not receiving events: events are propagated in the element hierarchy. For mouse events, an event target is selected using Pick() and the event is sent to all elements in the path from the hierarchy root to the target, and then back up from the target to the root (see So if your nodes are parented to the container and you click on a node, both the container and the node will receive the event, even if the node is visually outside the container.