Tasharen Entertainment Forum

Support => NGUI 3 Support => Topic started by: nah0y on December 17, 2013, 05:22:10 AM

Title: TweenPosition and new Anchors
Post by: nah0y on December 17, 2013, 05:22:10 AM
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?
Title: Re: TweenPosition and new Anchors
Post by: nah0y on December 17, 2013, 05:27:47 AM
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...
Title: Re: TweenPosition and new Anchors
Post by: ArenMook on December 17, 2013, 10:20:28 AM
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.
Title: Re: TweenPosition and new Anchors
Post by: rize on December 23, 2013, 05:26:17 AM
- 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?
Title: Re: TweenPosition and new Anchors
Post by: nah0y on December 23, 2013, 05:28:37 AM
+1 :)

What do you recommend?
Title: Re: TweenPosition and new Anchors
Post by: rize on December 23, 2013, 08:35:16 AM
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 ;)
Title: Re: TweenPosition and new Anchors
Post by: nah0y on December 23, 2013, 08:53:30 AM
Yup, that's what I recommended on my first post ;)
Title: Re: TweenPosition and new Anchors
Post by: ArenMook on December 23, 2013, 01:30:49 PM
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.
Title: Re: TweenPosition and new Anchors
Post by: soulis6 on January 10, 2014, 08:01:15 PM
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.
Title: Re: TweenPosition and new Anchors
Post by: Lotti on January 11, 2014, 04:26:00 AM
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?
Title: Re: TweenPosition and new Anchors
Post by: ArenMook on January 11, 2014, 06:18:55 PM
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.
Title: Re: TweenPosition and new Anchors
Post by: charliehelman on January 13, 2014, 03:59:15 PM
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?
Title: Re: TweenPosition and new Anchors
Post by: ArenMook on January 13, 2014, 05:30:56 PM
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.
Title: Re: TweenPosition and new Anchors
Post by: charliehelman on January 13, 2014, 06:59:02 PM
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?
Title: Re: TweenPosition and new Anchors
Post by: ArenMook on January 14, 2014, 10:01:02 PM
UIRect.SetAnchor(null).
Title: Re: TweenPosition and new Anchors
Post by: charliehelman on January 14, 2014, 10:26:57 PM
UIRect.SetAnchor(null).

Cool! I was getting this error:
Quote
Assets/Scripts/UI/UIDisableAnchorAtRuntime.cs(12,24): error CS0121: The call is ambiguous between the following methods or properties: `UIRect.SetAnchor(UnityEngine.Transform)' and `UIRect.SetAnchor(UnityEngine.GameObject)'

I don't know how to feed null to a method any other way, so I just added an entirely new method to your UIRect script instead.

  1.     public void SetAnchorToNull ()
  2.         {
  3.                 leftAnchor.target = null;
  4.                 rightAnchor.target = null;
  5.                 topAnchor.target = null;
  6.                 bottomAnchor.target = null;
  7.                
  8.                 ResetAnchors();
  9.                 UpdateAnchors();
  10.         }

Works perfectly so far!
Title: Re: TweenPosition and new Anchors
Post by: Lotti on January 21, 2014, 04:03:04 AM
I haven't noticed your answer until now! :)

I'll try using a gameobject container between panel and widgets. Anyway i find that disabling anchors on all the children after they are positioned (eg: first update loop) let me move the panel without problem.
Title: Re: TweenPosition and new Anchors
Post by: nah0y on January 21, 2014, 04:51:25 AM
It seems in the release notes, that the latest version allows you to use TweenPosition with the new anchor system (but didn't try it yet).
Title: Re: TweenPosition and new Anchors
Post by: Lotti on January 21, 2014, 04:57:10 AM
i tried placing a gameobject container between panel and widgets... nothing changed (with latest ngui version).

So i'll stay with the old configuration, disabling anchors after widgets are placed (actually we use anchor just for interface and for 4:3 <-> 16:9/10 support).