Author Topic: Prevent panels from overlapping.  (Read 327 times)

JesseSloan

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 3
    • View Profile
Prevent panels from overlapping.
« on: May 13, 2017, 10:01:34 AM »
I am new to NGUI so understand that I am just trying to figure things out.

My game has a bunch of separate UI panels that contain images.  They are draggable.  I would like to be able to drag the panels around freely but set it up so that if any panel is dragged and released above any other panel they move positions so they are never overlapping each other.

JesseSloan

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 3
    • View Profile
Re: Prevent panels from overlapping.
« Reply #1 on: May 13, 2017, 10:09:50 AM »
I should add to my original post by saying that what I tried to do was set up box colliders with non-kinematic rigid bodies so that when they are dragged they bump into the other UIs and bounce off of each other.  I did this prior to purchasing NGUI by setting up my world space UI and then parenting it to a 3D object with the box collider and rigid body.  Worked like a charm but I would prefer to eliminate the 3D object.

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 330
  • -Receive: 1157
  • Posts: 22,084
  • Toronto, Canada
    • View Profile
Re: Prevent panels from overlapping.
« Reply #2 on: May 13, 2017, 12:22:52 PM »
Using physics collider is certainly one way of doing it, but generally UI doesn't work like that. UI uses flat colliders, and doesn't do collision checking of any kind. To answer your question, I would suggest simply having custom code run while dragging your widget. Inside get all widgets underneath your panel and manually check rectangle intersection between the rectangle of the widget you're dragging and all the others. You can then offset your widget accordingly.

Although if I was doing it, I wouldn't do intersection checking while dragging -- I'd do it only after you release, and do it for all widgets smoothly -- this way the widget would "push" others out of the way. To do that, on DragDropEnd get the positions of your widgets, and calculate positions that would make them be distanced far enough from each other without overlapping, then SpringPosition each widget to their target position.

All this involves writing custom code for calculating positions/offsetting the widgets. Just remember, each widget is a simple rectangle -- so the math is very simple.