Question Is it okay to use the animator component on a UI object?

In my scene I have a dialogue box that pops up, I want to have an animated face of the character speaking within the dialogue box - similar to how Banjo Kazooie does it (

)

Usually I animate UI using the LeanTween library, as I'm aware you don't usually use an animator on a UI object, but that's for more animating UI movement.

How else would I go about having a frame by frame animation in a UI object? Could I instead have a regular Game Object within a UI panel, that has the animator component on it?

 

Yes. Animators animate parameters on objects. UI elements are objects just like 3D game elements or 2D game elements. Alpha levels, rotations, frame changes, activate or deactivate, wobble, stretch, whatever you like.

If you want to draw 3D things that appear to be part of the UI, there are a couple of approaches. The video above just shows flat artwork that was pre-rendered. Another approach is to put 3D objects in the UI layer and make a separate UI camera.

 

So is it okay to put game objects in with UI? Would this have any issues with performance? So the structure would be like

Code (CSharp):

1. <Canvas>
2.     <UI-with-image-component>
3.         <Normal-game-object-with-animator-component>
4.         </Normal-game-object-with-animator-component>
5.     </UI-with-image-component>
6. </Canvas>

So the Normal-game-object-with-animator would show a frame by frame 2D animation of the character talking.

EDIT: Using the video above, I guess the <Normal-game-object-with-animator-component> would just need it's own UI parent that just houses it. In case I want to add more inside the <UI-with-image-component>

 

Again, UI *is* GameObjects. There's no special category other than the mental association we make. There's a layer that happens to have the name "UI" and there's a group of component types that depend on Canvas to work, but they're otherwise no different from any other GameObject.

Whatever is animated with an Animator needs to be on the object with Animator, or a child of it. The channels in an animation clip need to match the current names of those objects. Those are really the only constraints.

 

Thanks for the help I think I read somewhere that you don't usually put game objects with animator components tied to them in the canvas, as it's quite resource intensive, so from then on I avoided it. But thanks for clearing that up

 

The problem is that the animator in the UI will make the layout dirty every frame, even if the value in the animation doesn't change

 

What implications does that then have by placing a game object with an animator component in the UI? You say it makes it dirty, could you possibly expand on that?

 

This is what I have read:

Performance Implications: UI elements in Unity are rendered using a different pipeline compared to regular GameObjects. Placing a GameObject with an Animator into a UI Canvas can introduce additional performance overhead, especially if the animated GameObject is complex or if there are many such objects. This is because it forces the UI system to constantly update and redraw the element, which can be more performance-intensive than static UI elements.

So essentially on each frame it will cause the UI system to be constantly updating. I guess this is why I originally asked the question as to the best approach to putting animated characters in with the UI

 

For anyone else stuck on this, a great guy on Discord helped me out, I hope it helps you too:

You position the gameobject with animator somewhere in the scene, give it a separate layer and exclude that layer from the main camera. Create a new camera and include only the new layer with the animation. Camera settings can be adjusted so the game object fits nicely in the camera view. There is a checkbox to save the camera to a file. And use that file as reference in the raw image. Raw images work just as normal images in the UI.The “file” is called a Render Texture.