Chain UI animations with Events?

Question

Hey! so i want to do this ui animation where every slot pops up with a small delay. something like this: https://media.giphy.com/media/xT1XGB4HHqRP8aNtlu/giphy.gif (Iam talking about the the appearance of the building slots (Landing Craft, Radar, Armory...))

what i did so far is, creating the pop up animation called "slot_open" with a event that calls the function StartNextTabAnimation() from the ActivateNextAnimation.cs at frame 60of100,and having this script to gather all the slots inside a canvas:

 using UnityEngine;
 using System.Collections;
 using System.Linq;
 
 public class AnimateSlots : MonoBehaviour {
 
     public GameObject[] m_Slots;
 
     private void Update ()
     {
 
         GameObject[] m_TargetsGO = GameObject.FindGameObjectsWithTag("Slots").OrderBy( go => go.name ).ToArray();
 
         m_Slots = new GameObject[m_TargetsGO.Length];
 
         for(int i = 0; i < m_TargetsGO.Length; ++i)
         {
             m_Slots[i] = m_TargetsGO[i];
         }
 
 
 
     }
 }

so my hierarchy is this:

 -Canvas
 --BuidMenu (where the AnimateSlots.cs is on)
 ---Slot1 (Button with Animator&ActivateNextAnimation.cs)
 ---Slot2 (Button with Animator&ActivateNextAnimation.cs)
 ---Slot3 (Button with Animator&ActivateNextAnimation.cs)
 ---Slot4 (Button with Animator&ActivateNextAnimation.cs)

so with the script above, i get a list with all slots inside the BuildMenu (cause you dont know how many slots will be in there). and on the Slots1-4 there is a Animator and this Script:

 using UnityEngine;
 using System.Collections;
 
 public class ActivateNextAnimation : MonoBehaviour
 {
     public Animator nextTab;
 
     public void StartNextTabAnimation()
     {
         if (nextTab != null) nextTab.Play("slot_open");
     }
 }

so my problem now is, that i have to place all the nextTabs by hand in the Slots1-4 So at slot1 i have to drag in the animator of slot2 and so on which isnt pretty much dynamic.

by the way: the very fist animation for Slot1 gets triggered by a Button which is not inside the BuildMenu using the Button component OnClickEvent (Animator.Play).

Answer 1

I am assuming the order in which you take the slots is also the order in which you want to make them appear. Following what you are trying to do I could suggest to add something like this in the AnimateSlots class and calling when creating the list.

 private void SetAnimationLinks()
 {
     for(int i =  0; i < m_Slots.Length - 1; i++)
     {
          //Linking 0 -> 1; 1->2 and so on...
          m_Slots[i].GetComponent<ActivateNextTabAnimation>().nextTab = m_Slots[i + 1].GetComponent<Animator>();
     }
 }

Other suggestions: pay attention of using Update since it is called by the engine at every frame even when using private (I guess they use Reflection to do that). Therefore you should move the list creation in a different method called when needed. There is no need to create an additional array to populate the public one. You can directly populate that.

A completely different implementation (but more clear from my point of view) could be writing a coroutine to activate the animator. So when the Button is pressed (activating the first animation) you can do something like

 public void OnButtonClickedEvent()
 {
    StartCoroutine(ActivateAnimation(0.2f);//200 ms
 }
 
 IEnumerator ActivateAnimation(float delay)
 {
     for(int i = 0; i < m_Slots.Length; i++)
     {
           m_Slots.GetComponent<Animator>.Play("slot_open");
           //You can adjust the dealy whn calling the coroutine
           yield return new WaitForSeconds(delay);
     }
 }

I hope this can give some help.

Cheers.

Chain UI animations with Events?

1 Reply

Your answer

Follow this Question

Related Questions