Add Cursor To Response Menu

Announcements, support questions, and discussion for the Dialogue System.
User avatar
PayasoPrince
Posts: 104
Joined: Thu Jan 27, 2022 6:47 pm

Add Cursor To Response Menu

Post by PayasoPrince »

Hello,

I would like to add a cursor that points to the hovered response selection.
I am looking to add something just like this:
Image

What is the best way to accomplish this? :?:
User avatar
Tony Li
Posts: 21977
Joined: Thu Jul 18, 2013 1:27 pm

Re: Add Cursor To Response Menu

Post by Tony Li »

The Dialogue System Extras page has an example:

DS_ResponseButtonArrowExample_2022-04-17.unitypackage

The response button has an arrow Image next to it. The Button component's Transition changes the color of arrow. In the normal (unselected) state, the arrow's alpha color is zero (invisible). In the selected state, the arrow's color is visible.

The response button also has an Event Trigger component to play a sound when the button is selected.
User avatar
PayasoPrince
Posts: 104
Joined: Thu Jan 27, 2022 6:47 pm

Re: Add Cursor To Response Menu

Post by PayasoPrince »

Very cool! :D

If I wanted to set something similar in my own prefab, is it as simple as adding an image to the Response Button Template's Button component?
User avatar
Tony Li
Posts: 21977
Joined: Thu Jul 18, 2013 1:27 pm

Re: Add Cursor To Response Menu

Post by Tony Li »

Yes, just like the example scene.
User avatar
PayasoPrince
Posts: 104
Joined: Thu Jan 27, 2022 6:47 pm

Re: Add Cursor To Response Menu

Post by PayasoPrince »

Hmm, I feel like I am almost there. For some reason the option that is not hovered will not go transparent. It just goes to a different color shade. I also added a "DeselectPreviousOnPointerEnter" component.
Image

I also noticed that when I copy and pasted your Response Panel, the button itself doesn't seem to highlight anymore. Is there a way to turn that on as well? :idea:
User avatar
Tony Li
Posts: 21977
Joined: Thu Jul 18, 2013 1:27 pm

Re: Add Cursor To Response Menu

Post by Tony Li »

Did you assign the arrow to the Button's Transition target graphic?

Make sure the Transition's Normal color > alpha is zero.

If you want to highlight the button background (e.g., the gray bar behind "Yes"), combine the arrow and background into a single image, and change the Transition type to Sprite Swap.
User avatar
PayasoPrince
Posts: 104
Joined: Thu Jan 27, 2022 6:47 pm

Re: Add Cursor To Response Menu

Post by PayasoPrince »

The issue was the Transition's Normal color alpha not being set to zero. It is working now!

In the future, if I wanted to make this more sophisticated and instantiate a game object or add an effect when an option is hovered, would this be possible?
User avatar
Tony Li
Posts: 21977
Joined: Thu Jul 18, 2013 1:27 pm

Re: Add Cursor To Response Menu

Post by Tony Li »

Yes. Use an Event Trigger or add a script that implements interfaces such as IPointerEnterHandler.
User avatar
PayasoPrince
Posts: 104
Joined: Thu Jan 27, 2022 6:47 pm

Re: Add Cursor To Response Menu

Post by PayasoPrince »

Oh. Awesome, thanks! :mrgreen:

My last question is - I added an OnSelect()> Play.OneShot() for a sound effect like you did in your example scene. It works great. The only thing I don't like is that it plays the sound effect when the response menu is first created and the player hasn't pressed a button yet.

Is there anyway to have it not play the sound effect when the response menu is first enabled? :?
User avatar
Tony Li
Posts: 21977
Joined: Thu Jul 18, 2013 1:27 pm

Re: Add Cursor To Response Menu

Post by Tony Li »

You might need to add a custom method to do that.
Post Reply