Tasharen Entertainment Forum

Support => NGUI 3 Support => Topic started by: Augur on May 29, 2012, 05:45:16 PM

Title: Problem with UIAnchor to Top Left
Post by: Augur on May 29, 2012, 05:45:16 PM: I only started using NGUI yesterday and I tried to add a SlicedSprite and a Label to a panel and anchor that panel to the top left of the screen. I can get it to look fine in a specific window size, but if I resize the window the panel does not stay the right distance from the edge, and can easily go off the screen.

I've tried this a few different ways, but settled on having the Anchor set to TopLeft, the RelativeOffset set to x=0.14 and y=-0.05; The panel, SlicedSprite, and Label have 0,0,0 position/rotation with only scale set. I've tried with the UIRoot set Automatic on and off, with different results but the same bug.

Is there something I'm doing wrong?

What I want is to always have the UI a set distance from the edge, regardless of the size of device it is used on.

I took some screen shots to explain myself a bit better
Title: Re: Problem with UIAnchor to Top Left
Post by: ArenMook on May 29, 2012, 05:56:31 PM: Relative offset scales with the size of the screen.

You want to add a child object underneath the anchor and simply offset it by a fixed amount, then your widget will be a child of that.
Title: Re: Problem with UIAnchor to Top Left
Post by: Augur on May 29, 2012, 06:22:02 PM: And then set the relative offset back to 0.

Thanks that worked perfectly.
Title: Re: Problem with UIAnchor to Top Left
Post by: stevej on October 07, 2012, 10:17:07 PM: Sorry to rehash an old thread, but I'm having this same issue and I'm not clear on the solution given.

Any chance of a little more detail?
Title: Re: Problem with UIAnchor to Top Left
Post by: dlewis on October 08, 2012, 12:40:36 AM: Quote from: geppetto on October 07, 2012, 10:17:07 PM
Sorry to rehash an old thread, but I'm having this same issue and I'm not clear on the solution given.

Any chance of a little more detail?

The way I understand it is that you create a gameobject, anchor that one, put the widget (ie. score) under the anchor and then move that object.

AnchorObj (UIAnchor with TopLeft set, (0, 0) offset
- Widget (ie. score, with the transform set to (X, Y).

The Widget will always be offset (X, Y) from the anchor and since the anchor will always be top left then the widget will always be offset (X, Y) from the top left corner, regardless of the resolution. The offset in the UIAnchor is a percentage value (0 -1) so the offset will be different depending on the resolution (0.1 of 1280 is 12.80 but 0.1 of 640 is 6.4).
Title: Re: Problem with UIAnchor to Top Left
Post by: stevej on October 08, 2012, 01:19:45 AM: I'll experiment a bit tonight.

I guess one thing I don't get is that default UI that NGUI creates (if you follow the tutorial/wizard) has a UIAnchor just below the top level, and THEN a Panel. Anchors beneath Anchors (in the tree) seem to have issues, so does that mean that you're supposed to create a new Panel for anything that will be anchored in a particular spot?

I think I've raised this stuff (or similar stuff) previously. Really hope we'll get a tutorial video some day specifically on anchoring particular elements to specific screen locations and having them maintain it across various aspect ratios... hint, hint, hint...
Title: Re: Problem with UIAnchor to Top Left
Post by: stevej on October 08, 2012, 01:25:11 AM: To make things more specific, here's a screenshot from my project. I'm setting things up at 4:3 aspect ratio (for iPad). All I want to happen is for each of the four UI groups of controls (top-left, top-right, bottom-left, bottom-right) to stay in their corner when the aspect ratio changes. The message box (top-middle) should just stick to the top of the screen. I've tried a bunch of approaches though and they never behave properly - sometimes they end up moving right off screen, other times they don't move at all, etc.

Can anyone give me a couple of bullet points on the correct approach to take in this situation?

(http://www.coldfirekeep.com/wp-content/uploads/2012/09/cfk5.jpg)
Title: Re: Problem with UIAnchor to Top Left
Post by: ArenMook on October 08, 2012, 04:04:29 AM: It's up to you where you want the panel to be. You can have it below or above the anchor, either is fine. Whatever makes sense.
Title: Re: Problem with UIAnchor to Top Left
Post by: stevej on October 09, 2012, 08:54:12 PM: So in the example given, would the "best-practice" be a single panel with five anchored GOs beneath it, or five panels, or... etc? Is there such a thing as a best-practice in this case?
Title: Re: Problem with UIAnchor to Top Left
Post by: dlewis on October 09, 2012, 11:43:58 PM: The 'best practice' would be to put each corner section into it's own panel if they regularly change sprite or move.

Whenever a widget moves then the buffer for the panel has to be rebuilt. The more that is in the panel the more that has to be rebuilt so if you split them into smaller chunks (ie. things that change and things that don't) then the buffer being built will be smaller and thus result in better performance.