Runic Dialogue UI - scroll to the bottom (autoscroll?)

Announcements, support questions, and discussion for the Dialogue System.
Soth
Posts: 2
Joined: Tue Jun 15, 2021 9:44 am

Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by Soth »

Hi, I have chosen the "Runic Dialogue UI" template which is nice and all but all the communication (player and NPC comments) pile up on top of each other and what I see in the end is a huge paragraph of text. Which is hard to read.

What I want to achieve is that only the NPC picture and last statement is visible along with the player picture and possible answers. Only if the player wants he/she can scroll up to see what was said previously. You might have seen this in hundreds of RPGs like Baldur, Neverwinter etc...

I guess that this could be done by the Autoscroll mentioned on the forum a couple of times but I can't find it in the Dialogue Manager.. Or do I have to implement it directly in the code?

Thank you very much!
User avatar
Tony Li
Posts: 20646
Joined: Thu Jul 18, 2013 1:27 pm

Re: Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by Tony Li »

Hi,

Inspect the dialogue UI's subtitle panel, and untick the Accumulate Text checkbox. Feel free to play around with other options, too, to get exactly the effect you want.
Soth
Posts: 2
Joined: Tue Jun 15, 2021 9:44 am

Re: Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by Soth »

Hi,
thank you for reply but that's not what I need.

I need to accumulate text as I want to have the possibility to scroll back and see what has been said but at the same time I want to see just the last statement from the NPC along with possible answers.

In the print screen is how itlooks now. What I want to see is just the last statement from Jargan " You young folks don't like decent work these days......." but to be able to scroll up to see the begining of the converstation + the two possible answers from player
"Sounds good....."
"Mines stinks...."

Is this what autoscroll should do and I am just not able to set it up correctly?
Manual : http://www.pixelcrushers.com/dialogue_s ... croll.html

Thank you
Attachments
Autoscroll.png
Autoscroll.png (427.77 KiB) Viewed 693 times
User avatar
Tony Li
Posts: 20646
Joined: Thu Jul 18, 2013 1:27 pm

Re: Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by Tony Li »

Hi,

The dialogue UI doesn't do that by default. If you're accumulating text, as Runic does, it accumulates it into one big scrollable block of content.

Autoscroll is different. If the text would result in the window scrolling down so you can see it all, it will scroll line by line as it types out the characters, instead of jumping to the bottom all at once.

To get the effect you describe, you'll need to customize the dialogue UI behavior -- for example, by subclassing StandardUISubtitlePanel to compute and set the scroll position.
giltar
Posts: 11
Joined: Thu Jan 21, 2021 2:24 am

Re: Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by giltar »

Hi Tony,
Im the dev working with Soth. Could you please give us more hints how to subclass the StandardUISubtitlePanel and calculate the position?
Regards
Giltar
User avatar
Tony Li
Posts: 20646
Joined: Thu Jul 18, 2013 1:27 pm

Re: Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by Tony Li »

Hi Giltar,

Here's the API reference: StandardUISubtitlePanel

To swap in a custom subclass and retain its field assignments (e.g., Portrait Image, Subtitle Text, etc.):

1. Make a subclass. You can test with an empty subclass first:

Code: Select all

using UnityEngine;
using PixelCrushers.DialogueSystem;
public class MySubtitlePanel : StandardUISubtitlePanel
{
}
2. Inspect your dialogue UI's Subtitle Panel Info GameObject. Use the triple-dot menu in the upper right of the Inspector view to change to Debug mode. Drag your script into the Standard UI Subtitle Panel component's Script field.

Once you've confirmed that works, you can override the SetContent method:

Code: Select all

public override void SetContent(Subtitle subtitle)
{
    base.SetContent(subtitle);
    // Your code here to adjust the appearance/scroll position
}
You can use the same process to subclass StandardUIMenuPanel and/or StandardDialogueUI if necessary.

To be upfront, I haven't given much thought yet to the details of how you'd implement this. You'll need to pad the bottom of the Scroll Rect's Scroll Content so it can scroll up past where it would normally be able to scroll. Then you'll need to set the scroll position so it only shows the most recent subtitle (and response menu if applicable).

If this proves to be too much of a headache, an alternative would be to UNtick the subtitle panel's Accumulate Text checkbox. In this case, it will always show the most recent subtitle and the response menu. You'll need to accumulate the text on your own, which you can do by overriding StandardDialogueUI.ShowSubtitle to store lines or use an OnConversationLine method. Then you'll need to add some functionality to detect if the player is trying to scroll back. If so, temporarily add your accumulated text to the beginning of the scroll content.

If you'd rather not bother at all with the Standard Dialogue UI set of scripts, you can write your own dialogue UI. As long as it implements the simple IDialogueUI C# interface, you can assign it to the Dialogue Manager's Dialogue UI field.
giltar
Posts: 11
Joined: Thu Jan 21, 2021 2:24 am

Re: Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by giltar »

OK, so im not excited with the solution, but it seems to work. Heres the code if someone else struggles as we did:

Code: Select all

    public class DialogueHistory : MonoBehaviour
    {
        [SerializeField] private List<Subtitle> history = new List<Subtitle>();
        private bool isScrolling;
        private int historyToShow;
        [SerializeField] private Scrollbar scrollbar;

        public List<Subtitle> History => history;

        [SerializeField] private StandardUISubtitlePanel standardUISubtitlePanel;

        [SerializeField] private ConversationView selectedResponseEventArgs;
        
        
        void OnConversationLine(Subtitle subtitle)
        {
            FinishShowingHistory();
            history.Add(subtitle);
            subtitle.formattedText.text = @"\^" + subtitle.formattedText.text;
        }


        private void AddCompleteHistory()
        {
            standardUISubtitlePanel.accumulateText = true;
            foreach (var item in history)
            {
                standardUISubtitlePanel.SetContent(item);
            }
        }

        private void FinishShowingHistory()
        {
            isScrolling = false;
            standardUISubtitlePanel.accumulateText = false;

        }


        private void Update()
        {
            var scrollDialogueBy = Input.GetAxisRaw("Mouse ScrollWheel");
            if (scrollDialogueBy == 0)
                scrollDialogueBy = Input.GetAxisRaw("Vertical");

            if (!isScrolling && scrollDialogueBy != 0f && history.Count > 1)
            {
                isScrolling = true;
                AddCompleteHistory();
            }
        }

    }
}
Im sure it can be done better way.
User avatar
Tony Li
Posts: 20646
Joined: Thu Jul 18, 2013 1:27 pm

Re: Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by Tony Li »

Thanks for sharing your solution.
Sapidus3
Posts: 6
Joined: Fri Sep 10, 2021 2:31 pm

Re: Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by Sapidus3 »

Hi, I just wanted to say I was looking at doing the same thing you were and found your post. I've modified your code a bit to get rid of some wonkiness that exists when using the WRPG template (perhaps it is also in runic, I don't know), and thought I would share it here for anyone else.

Code: Select all

 public class DialogueHistory : MonoBehaviour
    {
        [SerializeField] private List<Subtitle> history = new List<Subtitle>();
        [SerializeField] private Scrollbar scrollbar;
        [SerializeField] private StandardUISubtitlePanel standardUISubtitlePanel;
        public List<Subtitle> History => history;
        private bool isScrolling;
        private bool goToBottom = false;

        void OnConversationLine(Subtitle subtitle)
        {
            FinishShowingHistory();
            history.Add(subtitle);
            //subtitle.formattedText.text = @"\^" + subtitle.formattedText.text;
         }


        private void AddCompleteHistory()
        {
            standardUISubtitlePanel.accumulatedText = "";
            standardUISubtitlePanel.accumulateText = true;
            foreach (var item in history)
            {
                if (item.formattedText.text == "")
                    continue;
                standardUISubtitlePanel.SetContent(item);
            }
        }

        private void FinishShowingHistory()
        {
            isScrolling = false;
            standardUISubtitlePanel.accumulateText = false;

        }


        private void Update()
        {
            var scrollDialogueBy = Input.GetAxisRaw("Mouse ScrollWheel");
            if (scrollDialogueBy == 0)
                scrollDialogueBy = Input.GetAxisRaw("Vertical");

            if (goToBottom)
            {
                scrollbar.value = 0;
                goToBottom = false;
            }

            if (!isScrolling && scrollDialogueBy != 0f && history.Count > 1)
            {
                isScrolling = true;             
                AddCompleteHistory();
                goToBottom = true;       
            }

            if (isScrolling)
            {
                scrollbar.value += Input.GetAxisRaw("Mouse ScrollWheel");
                scrollbar.value = Mathf.Clamp(scrollbar.value, 0, 1);
            }

        }


    }
For anyone comparing the two, there are only three changes. One is that it clears the accumulated text when it gets turned back on. I was having an issue with passages getting repeated, and that seems to fix it. Two, is the goToBottom. When it detects scrolling, it locks the scrollbar to 0 (depending on your layout maybe you might need to set it to 1). It happens the frame after the scroll starts to allow for the UI to refresh. Finally, adding the mouse wheel value to the scrollbar value.

(also depending on your use case, you may or may not want to clear out the history in an OnConversationStart function call, depending on if you want it to be comprehensive, or only show the current conversation).

With this, it seems to be working exactly as I would expect.
Last edited by Sapidus3 on Fri Sep 10, 2021 10:14 pm, edited 1 time in total.
User avatar
Tony Li
Posts: 20646
Joined: Thu Jul 18, 2013 1:27 pm

Re: Runic Dialogue UI - scroll to the bottom (autoscroll?)

Post by Tony Li »

Thanks for sharing!
Post Reply