Unity 4.3 2D Tutorial: Animation Controllers

Learn how to use animation controllers to move between a state machine of animations in this Unity 4.3 2D tutorial! By Chris LaPollo.

Leave a rating/review
Save for later
Share
You are currently viewing page 3 of 4 of this article. Click here to view the first page.

CatDisappear Clip

The goal of Zombie Conga will be to get a certain number of cats into the zombie’s conga line. When the zombie collides with an old lady, you’ll remove a couple cats from the line and have them spin off and shrink until they disappear, as shown in the following animation:

cat_anim_disappear

This is the last Animation Clip you’ll need to make for Zombie Conga, so it’s your last chance to try out this animation business on your own!

Try configuring the CatDisappear Animation Clip as described below:

  • Make it last for two seconds.
  • It should rotate the cat four full times. That’s 1440 degrees!
  • The X and Y Scale values should go from 1 to 0 over the course of the clip.
  • The cat should remain green.
  • This clip should not loop.
  • Create a transition between CatConga and CatDisappear that triggers when InConga is false.

If you get stuck on any of that, the following has you covered.

[spoiler title=”Need help making a cat disappear?”]Select cat in the Hierarchy, and then select CatDisappear from the clip drop-down menu in the Animation view’s control bar.

Rotate the cat

  1. In the Animation view, move the scrubber to frame 120.
  2. With cat still selected in the Hierarchy, set its Z Rotation value to 1440 in the Transform component in the Inspector. Unity will automatically add a curve for rotation and place the appropriate keyframes at frames 0 and 120.

Shrink the cat

  1. In the Animation view, move the scrubber to frame 120.
  2. With cat still selected in the Hierarchy, set its X and Y Scale values to 0 in the Transform component in the Inspector. Unity will automatically add a curve for scale and place the appropriate keyframes at frames 0 and 120.

Color the cat green

  1. In the Animation view, click Add Curve, expand Sprite Renderer and click the + to the right of Color.
    Note: You could also create this curve from the Inspector the same way you created the other curves if you’d prefer.
  2. Move the scrubber to frame 0 and set Color.r and Color.b to 0.
  3. Move the scrubber to frame 120 and delete the keyframe for cat : Sprite Renderer.Color by clicking the diamond next to cat : Sprite Renderer.color in the curves list and selecting Delete Key from the menu that appears.
Note: You could also create this curve from the Inspector the same way you created the other curves if you’d prefer.

Disable looping

  1. Select CatDisappear in the Project browser and uncheck Loop Time in the Inspector.

Transition to CatDisappear

  1. Right-click on CatConga in the Animator window, choose Make Transition, and click CatDisappear.
  2. Select the transition in the Animator window, choose InConga from the combo box under Conditions, and choose false in the combo box that appears next to it.

[/spoiler]

Now test the cat’s full suite of animations. Play the scene and watch your cat appear and start wiggling. Next, click the InConga check box in the Animator view to turn your cat green and make it start hopping. Finally, uncheck the InConga check box in the Animator view to make the cat spin away into nothingness. Bear witness to the sad, beautiful lifecycle of a cat:

full_cat_sequence

Wait, didn’t that say “nothingness”? The cat disappeared from the Game view, sure, but take a look at the Hierarchy and you’ll see the cat is still hiding out in your scene:

cat_invisible_in_scene

You don’t want zombie cats sticking around in your scene after they disappear. That would make them zombie-zombie cats! Of course, you don’t want to remove a cat until you’re sure it’s done its animation, either. It’s a good thing Unity supports Animation Events!

Animation Events

Synchronizing game logic with animations can be tricky. Fortunately, Unity provides you with a built-in events system tied to your Animation Clips!

Animation Clips can trigger events by calling methods on the scripts attached to the animation’s associated GameObject. For example, you can add a script to cat and then call methods on it at specific times from within an Animation Clip.

Select cat in the Hierarchy and add a new C# script to it named CatController. This should be familiar to you from Part 1 of this series, but the following spoiler includes a refresher.

[spoiler title=”Can’t remember how to add a script?”]With cat selected in the Hierarchy, click Add Component in the Inspector. From the menu that appears, choose New Script and enter CatController as the name. Be sure CSharp is selected as the Language and click Create and Add.

Unity will put the new script in the top level Assets folder, but to keep things organized, switch to the Project browser and drag CatController from the Assets folder into the Scripts folder.
[/spoiler]

Open CatController.cs in MonoDevelop. If you aren’t sure how, just double-click CatController in the Project browser.

Inside MonoDevelop, remove the two empty methods in CatController.cs: Start and Update.

Now add the following method to CatController.cs:

void GrantCatTheSweetReleaseOfDeath()
{
  DestroyObject( gameObject );
}

You are going to configure CatDisappear to call this method when the clip finishes. As its name implies, this method simply destroys the script’s gameObject to release the zombie cat to wherever zombie cats go when they die. Florida?

Note: Calm down, Florida.

Save the file (File\Save) and go back to Unity.

Select cat in the Hierarchy and select CatDisappear from the clips drop-down menu in the Animation view.

Move the scrubber to frame 120, and then click the Add Event button in the Animation view’s control bar, as shown below:

add_event_button

This will bring up a dialog that lets you choose a function from a combo box. As you can see in the following screenshot, the default value in the combo box says (No Function Selected) and if you leave it like this, then the event will have no effect.

event_dialog_none

The combo box lists all of the methods you’ve added in any scripts you’ve attached to the GameObject. That is, it won’t list methods your scripts inherit from MonoBehaviour, such as Start and Update.

In this case, you’ve only added GrantCatTheSweetReleaseOfDeath(), so select it in the combo box and then close the dialog.

event_dialog_selected

The timeline includes a marker for your new event, as shown below:

event_in_timeline

Hovering the cursor over an event in the timeline shows a tooltip that displays the method it this event will call, as you can see in the following image:

event_tooltip

Right-clicking on an event brings up a menu that allows you to edit or delete the event, as well as add a new event.

For example, the following image shows a function that takes an int:

event_int_example

Your event can be of one of the following types:
float, string, int, an object reference or an AnimationEvent object.

An AnimationEvent can be used to hold one each of the other types. The following image shows the dialog when editing a method that takes an AnimationEvent parameter:

event_event_example

Note: You can define methods for animation events that take either zero or one parameters. If the method you want to call has a parameter, the dialog in which you choose the event function will display a field that lets you specify a value to pass to the function.

Run your scene. Once again, click the InConga check box in the Animator view to zombify the cat, and then click the InConga check box again to uncheck it and watch as the cat disappears into a sandy after-afterlife.

More importantly, notice that cat no longer appears in the Hierarchy, as shown below:

cat_removed_from_scene

In a real game you would probably want to recycle your cat objects rather than continuously create and destroy them, but this will be fine for Zombie Conga. Besides, do you really want to live in a world that recycles cats?

Contributors

Over 300 content creators. Join our team.