Using Mecanim states for animating UI button states

Unity has a very powerful built in UI system. An important part of it is buttons. Buttons have four states: Normal, Highlighted, Pressed, and Disabled. You can use the default Color Tint option to visualize those states, but there is a more interesting option: the animation transition. This recipe covers it.

Getting ready

You don't need to prepare anything before hand as we will create animated buttons from scratch in Unity. You can also use the provided example Unity project and go to the Chapter 03 2D and user interface animation\Recipe 08 Using Mecanim states for animating UI button states directory. You will find an Example.unity scene there. Open it, play the game, and click on the buttons to see the effect.

How to do it...

To create an animated button, follow these steps:

1. (Optional) Import the Button graphic to Unity.
2. Open a scene and create a new Button by using the Game Object | UI | Button command. Canvas and Button game objects will...