Author Topic: Elegant way for auto-adjusting box collider on button  (Read 4932 times)

10FingerArmy

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 8
    • View Profile
Elegant way for auto-adjusting box collider on button
« on: February 20, 2014, 01:01:48 PM »
Typically a button for me consists of a root gameobject with a UIButton in it, the collider and and event handler. As child objects there are sprites, animations etc.

How can I achieve that the collider on the root object resizes to fit around child images that make up the actual button? I often end up moving the collider and event logic down to the biggest child object which is totally counter intuitive and not easy to maintain. Or am I using it incorrectly?

rain

  • Jr. Member
  • **
  • Thank You
  • -Given: 2
  • -Receive: 4
  • Posts: 79
    • View Profile
Re: Elegant way for auto-adjusting box collider on button
« Reply #1 on: February 20, 2014, 01:25:31 PM »
I usually place a UIWidget script on the root gameobject where the collider is, then make its size cover the clickable area. After that, you can just tick the checkbox in the UIWidget script where it says "Box Collider [ ] auto-adjust to match".

10FingerArmy

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 8
    • View Profile
Re: Elegant way for auto-adjusting box collider on button
« Reply #2 on: February 20, 2014, 04:32:30 PM »
How do you make that work if the UIWidget does not know the real dimensions? If I add a UIWidget to my root gameobject and activate auto-adjust the dimensions of the widget are taken (100*100 by default) and not the ones of the images lower in the hierarchy.

rain

  • Jr. Member
  • **
  • Thank You
  • -Given: 2
  • -Receive: 4
  • Posts: 79
    • View Profile
Re: Elegant way for auto-adjusting box collider on button
« Reply #3 on: February 20, 2014, 05:09:56 PM »
You know your button's dimensions right? You can set it on the parent UIWidget and then have its children positioned and scaled (or anchored) so that the UIWidget rect always covers your button elements.

ryan

  • Jr. Member
  • **
  • Thank You
  • -Given: 0
  • -Receive: 1
  • Posts: 90
    • View Profile
Re: Elegant way for auto-adjusting box collider on button
« Reply #4 on: February 20, 2014, 08:01:02 PM »
With recent versions of NGUI, I've been putting my background sprite on the same object as the UIButton (and often a UIImageButton on there as well).  The label text or any other contents are still children like they used to be.  The background sprite then adjusts the collider to fit.  This should work pretty well for most cases, unless you have an oddly shaped button or contents that extend outside of the background.

10FingerArmy

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 8
    • View Profile
Re: Elegant way for auto-adjusting box collider on button
« Reply #5 on: February 21, 2014, 02:59:54 AM »
@Ryan: that is actually the workaround I also sometimes do and it is kind of ok but still weird I think.

@ArenMook: wouldn't it be a nice option to drop the UIWidget on the root and then be able to specify that auto-adjust collider should also/only consider the size of child objects?

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Elegant way for auto-adjusting box collider on button
« Reply #6 on: February 21, 2014, 03:05:53 PM »
Collider adjustments consider only the widget itself. It would be very expensive to iterate through children, taking their bounds into consideration as well.

You can do what you want by not having a widget, forcing it to do a child check:

GameObject (box collider, button script, anything else you want)
- UISprite (background)
- UILabel (text)

This won't make the box collider auto-adjust, however (as it's too expensive). But you can do it when you desire by using NGUITools.AddWidgetCollider(buttonGameObject); -- it will update the collider that's already there, or add one if there isn't.