TweenPosition and new Anchors

[nah0y]

Hello !

Is there a way we can tween the position of a panel or group of widgets that are using anchors?

What I've done, is create at the root of the window I want to move, an empty GameObject with a TweenPosition and a UIWidget.
And everything beneath the UIWidget will use anchors on this empty gameobject (so everything is based on the dimension of this UIWidget).

It's working fine like this, but !
I can't specify the size of this UIWidget to always be the size of the screen for example.



I think the solution is to have a script on this UIWidget that will set the dimension of it to the screen size at startup and then do nothing else.
What do you think?

If it's a solution that works, why not add a bool on the new anchor types with "run only at startup" as you did with last anchors?

[nah0y]

Hum... sorry it seems to be working having the TweenPosition and Widget...

The Tween is correctly played, but there is a few issues :
- I can't set the starting position to be anything else than the anchor.
So imagine the anchor is set to the center of the screen (this is my TO position), and the FROM position is at the top of the screen.
I can't set the position to the FROM.

- If I play the tween back (from center of the screen to the top), it works, but as soon as it's over, the position resets to the position defined by the anchor...

[ArenMook]

You can't tween any anchored object. Anchors reset its position, both in the old system and in the new one. That's kind of the point.

Tween something that's not anchored.

[rize]

- If I play the tween back (from center of the screen to the top), it works, but as soon as it's over, the position resets to the position defined by the anchor...

I have similar problem...

You can't tween any anchored object. Anchors reset its position, both in the old system and in the new one. That's kind of the point.
Tween something that's not anchored.

...and now I'm even more confused,  I need anchors to position and scale properly my sidebar at the bottom on different screens (with different aspect ratios) and also need Tween to hide/unhide it, what's the appropriate way of doing this?

[nah0y]

+1

What do you recommend?

[rize]

Anchoring (stretching) needs to be disabled before Tween start (if we assume no change of view size after scene load). There was an option to "Run only once" in previous ngui versions, so it looks like it has to be done via own scrypt now or ArenMook will bring this option back

[nah0y]

Yup, that's what I recommended on my first post

[ArenMook]

Use container objects. If you want something anchored to the right, anchor an invisible widget, then make your tweened objects children of that object. Don't actually anchor them in turn.

[soulis6]

Use container objects. If you want something anchored to the right, anchor an invisible widget, then make your tweened objects children of that object. Don't actually anchor them in turn.

The only problem I've found is this doesn't work if you're trying to do something like stretch a panel's background horizontally to fit the screen, but then tween it vertically offscreen (which is what I ran into). Other than that the new anchor system has been awesome.

A 'run only once' option would allow for this, but i'm open to other ideas too.

[Lotti]

i've got a similar problem with tweening position and anchored object. that's my structure:
GO Root 2D
--GO Camera
----GO container
------GO Panel
--------GO Sprite anchored to the panel

Then i'm tweening the position of the panel to move it outside the camera (example: from 0,0,0 to -panel.width,0,0) the movement of the panel lags three / four times near the 0,0,0 until it "warp" to final coordinates.

There is something i can do to fix this or i'm doing it wrong?

[ArenMook]

The only problem I've found is this doesn't work if you're trying to do something like stretch a panel's background horizontally to fit the screen, but then tween it vertically offscreen (which is what I ran into). Other than that the new anchor system has been awesome.

A 'run only once' option would allow for this, but i'm open to other ideas too.

You certainly can. Anchor left and right, but leave top and bottom free to move as you see fit.

@Lotti: Why are you moving the panel? A panel is just an abstract component that's capable of drawing widgets. Its position doesn't matter. Unless you turn it into a scroll view by setting a clipping rect, it has no rectangle of its own, and so its position doesn't matter. It simply inherits the camera's rectangle instead.

Remove the panel object and try again, anchoring your sprite to your container.

[charliehelman]

I am building a iOS-app style UI where the layout needs to be responsive and stretch to fill the entire screen. It consists of a static top bar and then a series of pages below, which users swipe between. Only one page can fill the screen at a time.

The solution I'm considering is to have a horizontal scroll view that contain the pages. Currently I only have one page, but when I add more then each page will need to be contained inside and arranged by a UIGrid.

The scroll view is constantly anchored to the camera size; that's great and works perfectly.

The child object of the scroll view is an invisible widget (Page Container), which I stretch to fill the space underneath the top bar using anchors. The page elements for each page are child objects to each container, and are either anchored to each other or to the container edges.

So, the hierarchy is:

UI Root
--Camera
----TopBar (Panel)                              [Left and Right edges anchored to Camera Left & Right edges]
----ScrollView (Panel)                         [All edges anchored to corresponding Camera edges]
------PageContainer (Invisible Widget) [Left, Right, and Bottom edges anchored to Camera edges, Top edge anchored to Bottom edge of a TopBar sprite]
--------PageElement (Sprite)               [Anchors for page elements are dependent on the PageContainer dimensions]
--------PageElement (Sprite)
--------etc.

This makes the UI properly scale to fit my target screen sizes. However, if the Page Container's anchor is active at runtime, it obviously conflicts with the scroll view. This is the same problem described above when they were trying to tween objects that are anchored.

Setting the Anchor on the PageContainer to None after Start () will probably work. I'll see about doing that now and report back.

What do you think of this use case, Aren? Perhaps there's a better solution for this type of system?

[ArenMook]

I think it's terribly complicated to figure out while lying on the beach under the sun. Ask me again when I return from vacation and I might have a better idea! It's hard to concentrate here.

[charliehelman]

Haha!

Well, you're already going the extra mile by responding at all while on vacation. Thank you for that, good sir.

I'll survive until you are back. Meanwhile I'll see what I can figure out. Enjoy your time in Jamaica with the wife

EDIT: Okay, I've spent the whole evening digging around and I can't seem to find a way to disable a widget's anchoring (or set it to none) once the game is in play mode.

I looked in UIWidget and UIRect, but the solution didn't jump out at me. Anyone know?

[ArenMook]

UIRect.SetAnchor(null).