UI Sprite Animation


This video will show you how to animated UI just like 2d Animation.

1:  You need 2d sprite animation, i will take from "Pixel Adventure 2" on itch.io

2: this code will loop the sprite animation you referentce.

public Image m_Image;
public Sprite[] m_SpriteArray;
public float m_Speed = .02f;
private int m_IndexSprite;
Coroutine m_CorotineAnim;    
bool IsDone;   
public void Func_PlayUIAnim()
{ 
   IsDone = false;
   m_CorotineAnim = StartCoroutine(Func_PlayAnimUI());
}      
public void Func_StopUIAnim()
{      
   IsDone = true;  
   StopCoroutine(m_CorotineAnim); 
}
IEnumerator Func_PlayAnimUI()
{
        yield return new WaitForSeconds(m_Speed);
        if (m_IndexSprite >= m_SpriteArray.Length)
        {
            m_IndexSprite = 0;
        }
        m_Image.sprite = m_SpriteArray[m_IndexSprite];
        m_IndexSprite += 1;
        if (IsDone == false)
            m_CorotineAnim = StartCoroutine(Func_PlayAnimUI());
}


3: Create a UI image to run animation and 2 button to play and stop animation on the image.

4: Pull the script to UI image, then reference the image and the sprite to "inspector script"

5: Now you can click play and you can play or stop the animation. You also can control speech of animation.

Hope this can help you.

Leave a comment

Log in with itch.io to leave a comment.