Author Topic: Spacing buttons evenly across screen width  (Read 6087 times)

Zophiel

  • Jr. Member
  • **
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 54
    • View Profile
Spacing buttons evenly across screen width
« on: August 19, 2012, 03:18:58 AM »
I've recently been doing a unity to flash project where I had my UI made in Flash. Sadly, since that is in beta, i'm forced to port back fully to unity for a standalone (exe/app) project and am since converting the UI to NGUI.

In flash i would just space the buttons out evenly across the screen space but that is not so easy in NGUI. How would i go about setting this up correctly?

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Spacing buttons evenly across screen width
« Reply #1 on: August 19, 2012, 12:30:57 PM »
Why isn't it? You can use UIAnchor with a relative position value, for example 0.25 for 25% of the screen's width. If you set UIRoot to be manual instead of automatic, the UI's size will also stay the same proportionally to the screen's height.

kmeboe

  • Guest
Re: Spacing buttons evenly across screen width
« Reply #2 on: August 29, 2012, 05:28:43 PM »
I'm also having some difficulty spacing buttons evenly (and horizontally) across the screen.  I'm struggling with the position of the very first button.  If I use UIAnchor to anchor this button to the left side of the screen, the button is halfway off of the screen -- I'm guessing that this is because the button's "internal anchor point" is in the center.  Since the button is sized with a UIStretch to be a percentage of the screen width, I don't simply want to offset the button by a fixed pixel width (as in the anchors example), because this will complicate changing the button width (if I ever want to do so), and will also mess with resolution independence.  What I really want to do is to either set a new "internal anchor point", or offset the button by half of its width (whatever that may be).  I could copy and modify UIStretch (to create a "UITranslate"), but I'd rather stick with a built-in solution, if one exists. 

Then for each subsequent button, I would use the previous button as an anchor point, but each of these buttons will also need an offset of half their width.  The reasoning behind doing this is that it will ensure that the button positions remain correct if I resize any given button (also providing resolution independence).  If my thinking on this is more complicated than it needs to be, please let me know.

Thanks for your help -- loving NGUI so far.

-Kevin

Edit: Anchoring each button to the previous button doesn't work, as UIButton isn't actually a widget.  Looks like I will need to anchor each button to the "Background" sprite of each previous button.

Another Edit: I'm having more trouble with each individual button.  If I resize the button's background using UIStretch, the button's collider doesn't resize to match.  How can I use UIStretch to modify the button image and the collider at the same time?
« Last Edit: August 31, 2012, 12:46:39 PM by kmeboe »