Galacean Logo
Documentation
API Reference
Examples
Playground
Animation

AnimatorController

Introduction

The AnimatorController (API) helps you organize a set of animations for a character or other animated object. It visualizes the animation playback logic of animated objects like a flowchart through the AnimatorStateMachine (detailed introduction) and automatically switches AnimatorState and plays the referenced AnimationClips (detailed introduction) when conditions are met.

Main Components

AnimatorControllerLayer

AnimatorControllerLayer are used to organize and manage AnimatorStateMachines within an AnimatorController. Each AnimatorControllerLayer has its own AnimatorStateMachine. When the Animator component runs, all AnimatorControllerLayer run simultaneously, and multiple AnimatorControllerLayer achieve animation blending through different weights and blending modes. For detailed usage of AnimatorControllerLayer, please refer to the AnimatorControllerLayer document.

AnimatorControllerParameter

AnimatorControllerParameter are used to control the switching of AnimatorState in the AnimatorStateMachine. When the conditions of the AnimatorStateTransition are met by setting the values of the AnimatorControllerParameter, the AnimatorStateTransition will trigger, switching to the target AnimatorState. For detailed usage of AnimatorControllerParameter, please refer to the AnimatorStateMachine document.

Editor Usage

Through the AnimatorController editor, users can organize the playback logic of AnimationClips (detailed introduction).

  1. Prepare the AnimationClips (detailed introduction).

  1. To organize the playback of these AnimationClips, we need to create an AnimatorController asset. There are two ways to create an AnimatorController:

    1. Right-click on the blank space in the Asset Panel and select Create -> Animation Controller.
    1. Click the add asset button + and select Animation Controller.

  2. The newly created AnimatorController has no data. We need to edit it, double-click the asset, and add an AnimatorState (detailed introduction).

  1. Click the added AnimatorState to bind an AnimationClip (detailed introduction).
  1. Bind the AnimatorController asset to the Animator component (detailed introduction).
  1. Now you can play the Idle animation in the exported project by calling animator.play("New State").

For further usage of the AnimatorController editor, please refer to the AnimatorStateMachine document.

Script Usage

Before using scripts, it is recommended to read the following documents:

Bind AnimatorController

You can bind the AnimatorController to the Animator through the animator.animatorController property.

If the loaded glTF model has animation data, the engine will automatically bind a default AnimatorController to each glTF instance, and you can directly use it to play the animations within it.

animator.animatorController = new AnimatorController(engine);
animator.play("New State");

Reuse Animation Data

The AnimatorController is a data storage class and does not contain runtime data. Based on this design, as long as the skeletal node hierarchy and naming of the model bound to the Animator component are the same, we can reuse the animation data of this model.

const animator = model1.getComponent(Animator);
// Get the AnimatorController of the animation model
animator.animatorController = animationGLTF.getComponent(Animator).animatorController;
// Play the animation of animationGLTF
animator.play("anim from animationGLTF");

Was this page helpful?