Author Topic: Tween animation with the stetching and anchoring issue.  (Read 3376 times)

dipu5683

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 27
    • View Profile
Tween animation with the stetching and anchoring issue.
« on: April 22, 2014, 08:18:56 AM »
Hi

I am creating the interface. On click of some button next page intantiated & came on the screen with some tween position animation from right to left of the device screen.

My page prefab architecture is like below.

mainmenu (empty gameobject) - contains page script attached.
   childcontainer (empty gameobject)
      UIButton  (Right aligned using anchor)
      BG Sprite ( having Unified anchor script to stretch and anchor to device resolution)

When the mainmenu prefab loaded attached page script executed. In its initialise function() i wrote code for to add tween animation.
i have enable or disable the unified anchor script in order to tween position. But the moment i remove my Unified anchor script  my bg sprite got resized .
Means at the start of tween i disabled the unified anchor , and on end again enabled.

Simply i want my prefab (page) should came from left to right or with any tween animation on the screen without affecting the anchors.

Thanks

« Last Edit: April 22, 2014, 11:52:49 PM by dipu5683 »

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Tween animation with the stetching and anchoring issue.
« Reply #1 on: April 23, 2014, 06:33:19 AM »
Tweens adjust anchoring, but only if you are tweening the object that's actually anchored. In your hierarchy you mention that the button is right aligned using an anchor -- anchored to what? What's actually tweened?

dipu5683

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 27
    • View Profile
Re: Tween animation with the stetching and anchoring issue.
« Reply #2 on: April 23, 2014, 08:28:51 AM »
Hi

My prefab architecture is like below.
MainMenu (Empty Gameobject) having page script(CMainMenu.cs) which will execute when this prefab comes in memory.
  Child Container (empty gameobject)
        Sprite (background image) attached a custom unifiied anchor scrip to stretch & anchor using UIRoot.
        UIButton 1 - anchored (left top) using custom script using UIRoot. 
        UIButton 2 - anchored (center)using custom script using UIRoot.
        UIButton 3 - anchored (right bottom)using custom script using UIRoot.
Now my page is done.
Now i want from this page to come on screen with tween animation say left to right etc. For that what i did ,when MainMenu prefab instantiated CMainMenu.cs executed . its Start() i added a this.gameObject.AddComponent<TweenPosition>(); on runtime.
provided some tween from to "to" position and added some onFinished event , but before that i just disable my anchor script from Sprite (background image) similarly from button also and after the animation i just enabled it. Other wise tween animation wont happen.
Now page animation is done but with some dirty jerk. moment i remove my unified anchor script it resized , got animation because of tween and at the end again comes to original size because i enabled the anchor script. Which is not looking very smooth.
Can't we tween the base container MainMenu without affecting any of the child element having unified anchor or custom anchor?
i am creating a generic tool where we specify the page transition with animation type , it will take care of every thing else.
I have created to custom script for Unified Anchoring & Custom Anchor , which uses the UiRoot (Fixed to 720) reference at runtime , according to that my background got stretched , button got anchored etc.














         

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Tween animation with the stetching and anchoring issue.
« Reply #3 on: April 24, 2014, 01:44:48 AM »
Well first... what is this "custom unified anchor script"? Also make sure you use NGUITools.AddChild(parent, prefab) to instantiate this main menu. If you create it in the middle of nowhere, like by using Instantiate, then you are effectively forcing NGUI to re-parent it at some point -- likely after you've already tried using its content in some way.

To start tweening, use TweenPosition.Begin. Don't use AddComponent.

dipu5683

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 27
    • View Profile
Re: Tween animation with the stetching and anchoring issue.
« Reply #4 on: April 24, 2014, 02:13:28 PM »
Hi
i have created 2 custom script.
1st for the background image to stretch n anchor as per device resolution.
sprite.SetAnchor(uiRoot.transform);
sprite.leftAnchor.absolute = 0;
sprite.rightAnchor.absolute = 0;
sprite.topAnchor.absolute = 0;
sprite.bottomAnchor.absolute = 0;

similarly 2nd script for the componet to anchor & stretch(if required) within the screen i.e. label to topleft , button to right bottom etc .
sprite.SetAnchor(uiRoot.transform);
sprite.leftAnchor.Set(relativeLeftAnchor , leftAnchor); //similarly for right , bottom , top
sprite.ResetAnchors();
sprite.UpdateAnchors();

My mainmenu prefab contains bg sprite with unified custom anchor script(1st script) attached , button 2nd type script attached.

Mainmenu should come on screen with some tween position animation.

for instantiation of mainmenu i am using Nguitool.addchild(parent , object);

what all steps i need to do ?
There can be so many prefab like my mainmenu , which will came inside my game at some point.




ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Tween animation with the stetching and anchoring issue.
« Reply #5 on: April 25, 2014, 07:18:05 AM »
Your first code where change the absolute values needs to call ResetAnchors and UpdateAnchors afterwards as well. It should happen every time you modify the anchors yourself like that instead of using the SetAnchor function. Also, why not simply call SetAnchor(uiRoot.transform, 0, 0, 0, 0)? Then you don't need to set anything manually.

Keep in mind that if each of your windows has its own panel (no reason for it not to), then you don't need any of this. Your anchors would be referencing this panel instead of the UIRoot, and they will work as expected. No need to set them manually after instantiation at all.

dipu5683

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 27
    • View Profile
Re: Tween animation with the stetching and anchoring issue.
« Reply #6 on: April 25, 2014, 01:50:20 PM »
ok got the point , now i changed my menumenu prefab structure like below

MainMenu (Empty game object) Having NGUI PANEL attached also some page script attached.
   BgContainer (empty game object)
       backgound sprite - unified anchored to MainMenu transform panel with all left , right , bottom , top = 0
       Button 1 - center anchored to MainMenu panel etc.

Now i want my entire mainmenu prefab container  should came on screen with left to right tween position animation.
what all i exactly need to do ?
Tweenposition.Begin() not working if the panel contains any kind of anchoring inside it. I also tried to disable & enable my anchor script before & after the tween position animation but .... ended up with dirty jerk of the background image .

There should be some way , through which i can apply tween position animation to PANEL without affecting its child elements anchoring & stretching.

Since every child thing inside the prefab are anchored & strectched based on parent MainMenu Panel  , and if i tweening my mainmenu base panel , then i think everything inside the panel should move with it .

thanks
 


ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 337
  • -Receive: 1171
  • Posts: 22,128
  • Toronto, Canada
    • View Profile
Re: Tween animation with the stetching and anchoring issue.
« Reply #7 on: April 26, 2014, 01:44:04 PM »
If something is anchored, then you must animate this object. You can't animate the panel because you have things that are anchored to the screen (anchoring to a panel that has no clipping = anchoring to the screen). If you want both worlds here -- anchoring AND tweening, then you need to set up your prefab like this:

Main Menu (panel)
- Widget (ALT+SHIFT+W, anchored to the main menu)
-- Other widgets, anchored to the "Widget"

You would then animate the "Widget", not the panel. This way only one object is anchored to the screen, and it's also the only object that you will animate.

Just be aware that animating widgets is far less efficient than animating panels. But that's the price you will have to pay if you don't want to mess with disabling anchoring for the duration of your animations.