How To: Animate Portrait Images

[Tony Li]

To use animated sprites instead of static textures for portrait images:

• Prepare one or more sprite animation clips that animate the contents of a UI Image component (not a SpriteRenderer), as shown in this image:
  
  Since the dialogue UI works within UI space, and not SpriteRenderer space, your animation clips must control a UI Image, not a SpriteRenderer.
• Prepare an animator controller that plays one of the animation clips on start. Add the other animation clips to the animator controller, too, if you've made any.
• Add a Dialogue Actor component to each character, and assign the animator controller to it.
• Tick the subtitle panel's Use Animated Portraits checkbox to enable animated portrait support.
• Add an Animator component to the subtitle panel's portrait image. You don't have to assign an animator controller to it. Each actor will assign its animator controller to it when the actor is speaking.
• Optional: If you want to change the actor's portrait animator state at any time, use the AnimatorPlay() or AnimatorTrigger() sequencer commands to transition to a different state, specifying the portrait image's GameObject name (see Cutscene Sequences). You'll typically put this sequence in a dialogue entry's Sequence field. It might look something like this:

  Code: Select all

  AnimatorPlay(Talking, NPC Portrait Image);
  required AnimatorPlay(Idle, NPC Portrait Image)@{{end}}

  • The sequence above plays the character's "Talking" animator state on the NPC Portrait Image GameObject. At the end of the duration determined by the length of the dialogue text, it plays the character's "Idle" animator state. The 'required' keyword guarantees that it play Idle even if the player skips ahead before the {{end}} duration.
  • Note that AnimatorPlay() works on GameObject names. If you have more than one NPC subtitle panel, name each portrait image GameObject uniquely, such as NPC Portrait Image 0, NPC Portrait Image 2, NPC Portrait Image 3, etc. This way your AnimatorPlay() sequencer commands can correctly specify which portrait image to play the animation on.
• Assign a portrait to the actor's Portrait Sprites or Portrait Textures. Although this image will not be used, it tells the Dialogue System that this actor uses portrait images, which keeps the portrait image UI element active and available to be animated.

The Dialogue System Extras page has an example package: DS_AnimatedPortraitExample_2020-03-29.unitypackage

[lcn_mc]

Hello!

I've been trying to get Animated Portraits to work in a test project I'm doing for the better part of two hours, but I cannot seem to get it working. I've followed the instructions (in this post / in the Dialogue System manual) 1:1, but my animated speaker portrait never seems to leave the 'Idle' state. I then downloaded/imported the Animated Portrait Example package and, within it, setup a new speaker that mirrored the configurations of the others (Red/Yellow/Green Wizard), added some new conversation steps for my new speaker (again, mirroring the existing conversation steps), and still nothing.

On a lark, I tried replacing Yellow Wizard's Portrait Animator Controller with the animator controller I had created for the character where I'm experiencing the issue, and lo and behold the animated portrait began working as expected.

I did a further experiment where I took an existing dialogue step (the "I am the Yellow Wizard." one) and adjusted the actor speaking the line as well as the Portrait Animator Controller of that actor. The results were a bit odd:

Scenario 1

• Actor: Yellow Wizard
• Portrait Anim Ctrl on Actor: Yellow Wizard
• Outcome: Portrait animates correctly

Scenario 2

• Actor: Yellow Wizard
• Portrait Anim Ctrl on Actor: My New Character
• Outcome: Portrait animates correctly

Scenario 3

• Actor: My New Character
• Portrait Anim Ctrl on Actor: My New Character
• Outcome: Portrait does not animate

Scenario 4

• Actor: My New Character
• Portrait Anim Ctrl on Actor: Yellow Wizard
• Outcome: Portrait animates correctly

And for added weirdness, if I repeat this experiment, but instead use the third dialogue step ("I am the red wizard.") with the Red Wizard actor, the portrait animates correctly every time.

Suffice it to say, I have absolutely no idea what's going wrong or why I cannot get my animated portraits working on their own.

Any assistance or insight anyone can provide would be greatly appreciated. Thanks!

[Tony Li]

Hi,

Would it be possible for you to send a reproduction project to tony (at) pixelcrushers.com? It's often the quickest and least stressful way to resolve issues like this.

Otherwise, are there any errors or warnings in the Console window when the portrait doesn't animate?

As a test, assign your new character's animator controller to the subtitle panel Portrait Image's Animator component. With the Portrait Image GameObject selected in the Hierarchy, open the Animation window. Can you preview the animations? If you select one and play it in the Animation window, you should see the animation happen in the Scene view.

If that works, let's make sure your new character actually assigns its new animator controller to the Portrait Image at runtime. Your Scenario 4 might have worked only accidentally if you left the Yellow Wizard's animator controller assigned to the Portrait Image's Animator.

1. Temporarily set the Dialogue Manager GameObject's Other Settings > Debug Level to Info.

2. Play the scene and start the conversation. In the Console window, look for a line similar to:

Dialogue System: Starting conversation 'title' with actor=X and conversant=Y

Is X or Y your new character?

3. Then get to a point in the conversation where your new character's portrait animation should be playing. Inspect the Portrait Image. Is the new character's animator controller assigned to the Animator component?

[lcn_mc]

Thanks for the quick reply, Tony. I'll reply to the points in your post in order:

Sure, I'll have a Reproduction Project sent to you at that email address shortly. The new character is just a debug-type entity called 'Speaker Green' that uses similarly debug-looking artwork.

No warnings in the Console Window during any of the testing mentioned in my last post.

I was able to preview the animations by assigning my new character's animation controller to the Subtitle Panel's Portrait Image. It played correctly.

When putting the Debug Level to Info, I did see the 'actor=' part after the conversation started, but there was nothing assigned to 'actor.' It simply read 'actor='.

For Step 3, yes, the Portrait Image is using the new character's animation controller. If you look at the Animator Window, it stays cycling through the 'Idle' step without ever moving to the 'Talk' step.

I very much appreciate you looking into this further, and I'll certainly be interested to hear what's causing this odd issue.

Let me know if you don't see that email come through.

[Tony Li]

Hi,

It's a bug. I can confirm it happens when the first node's speaker is not the conversation's primary actor or conversant and when the subtitle panel's Visibility is set to Always From Start and when the character has an animated portrait:

speakerGreen.png (42.26 KiB) Viewed 1504 times

If the first node's speaker is the primary actor or conversant, or if Visibility is set to a different value, or if the character appears later in the conversation, it animates.

BTW, in the debug info, 'actor=' means no GameObject is associated with the actor, which is correct in this scene because the scene doesn't have a player GameObject.

[Tony Li]

Here's the fix:

DS_AnimatedPortraitPatch_2022-06-30.unitypackage

Version 2.2.29 is coming out on Monday, and this fix will be in it.

[lcn_mc]

Thanks for taking a look, Tony.

I'll keep an eye out for the updated version and will experiment with it once the patch is released.

Really liking the Dialogue System, by the way; the positive reviews are all well-deserved.

[Tony Li]

Thanks!

Our messages crossed. The fix is above.

[lcn_mc]

Tony,

I was able to get animated portraits working in one of my (test) projects, but not in another project. In the case of the latter, I'm absolutely stumped as to why it wouldn't be behaving when I've (presumably) followed the instructions (in the Dialogue System's online manual) to the letter and there's nothing odd in the console (beyond an expected 'missing AnimatorController' warning on a different actor than the one I'm expecting to be animating) or anywhere else that I can see. If you willing, I'd very much like to send you the exported project (similar to last time) so you can cast your expert eye on it to see what I'm missing.

Semi-related to the above, now that I've been mucking around with the Dialogue System for about a full week now, I've got some general and 'best practices' questions related to it. Should I post those here in this thread, or create a new post for them?

Thanks for the help, as always.

[Tony Li]

Hi,

Please send the reproduction project to tony (at) pixelcrushers.com. I'll be happy to take a look.

For your general and best practices questions, let's create a new post.