Autoscroll not working how I assumed

[NedSanders]

Hi! I'm trying to get my scrolling text interface to behave similarly to Disco Elysium, where each new line pushes the existing text upwards to make space for the new block of dialogue. Video for reference:

I followed a tutorial for 'auto scrolling' assuming that would help (the one that involves adding a 'sizer text' object) but the result is that each new line in the typewriter dialogue shunts the textbox up as it fills and the result is pretty jarring and bad for readability.

How can I...

a) non-destructively reverse the autoscroll so that the text box pre-empts the size and prevents the moving textbox effect

b) Implement the bottom-up scrolling dialogue as described.

Thank you!

[Tony Li]

Hi,

So I understand correctly: Currently the auto-scroll scrolls up line by line. You instead want to immediately scroll up the full amount of text, which the typewriter will fill as it types?

If that's correct, turn off auto-scroll. Configure the typewriter effect's OnCharacter() UnityEvent to set the Scroll Rect's ScrollRect.verticalNormalizedPosition to zero.

[NedSanders]

Hi,

So I understand correctly: Currently the auto-scroll scrolls up line by line. You instead want to immediately scroll up the full amount of text, which the typewriter will fill as it types?

If that's correct, turn off auto-scroll. Configure the typewriter effect's OnCharacter() UnityEvent to set the Scroll Rect's ScrollRect.verticalNormalizedPosition to zero.

Hey Tony!

Thanks for the response. I did as you suggested but a) it creates a strange overlapping effect as shown in the link below and b) the text still starts at the top and adds as you progress, rather than being based at the bottom (as in the Disco Elysium example).



I've included a screenshot of my typewriter component to ensure I've configured it correctly based on your suggestion:



EDIT: To clarify, the original goal was to have the first line of dialogue appear at the bottom of the scroll box. From there, each new line appears also at the bottom, pushing the rest of it up. It's the way Disco and lots of other dialogue based games work and I feel that, from a design perspective, it's more natural and allows the player to keep their eyes in one place rather than constantly adjusting as the text moves down the screen.

[Tony Li]

Hi,

Sorry, I totally misread what you were looking for. Scratch what I suggested above. Use auto-scroll. Here's an example:

DS_TestScrollingTMP_2023-07-22.unitypackage

The only change you need to make from the Scrolling Dialogue UI prefab (apart from switching to TMPro) is to set the Scroll Content's Rect Transform to bottom / stretch:

scrollContentRectTransform.png (76.71 KiB) Viewed 784 times

Also, if you don't want to use a typewriter effect to type out character-by-character, you can do a smooth scroll using a coroutine similar to the one in the SMSDialogueUI script's ScrollToBottom() on line 334.

[NedSanders]

That's great! The text now is centred at the bottom - I had a feeling the solution would be something simple like that, I'm just new to a lot of basic Unity concepts.

I still have the issue where each new line in the textbox causes it to change size, which is what I meant by non-destructively undoing the autoscroll? I've tried just disabled autoscroll and/or deleting the sizer text object but I can't figure out how to get it back to how it was: with the textbox automatically being the size it needs to be to fit the text once it's finished typwriting.

[NedSanders]

In fact, I may have beefed it - I've messed around with the setting and now the dialogue is very much not working as intended. If possible, would you mind having a look to see what exactly I've done wrong? I'd undo but I've saved since and this is my last backup.

Link to project:

[Tony Li]

Hi,

I couldn't update that scene because I don't have the requisite assets such as the font you're using. But I copied the dialogue UI into the test scene I posted above. Here's an updated copy:

DS_TestScrollingTMP_2_NedSanders_2023-07-23.unitypackage

The only formatting change I made was to adjust the Scroll Content's Rect Transform as suggested in my previous reply. I also copied the TextMesh Pro subtitle text GameObject and used it instead of the Text your dialogue UI was using, so make sure to enable TextMesh Pro Support.

[NedSanders]

Thanks! I managed to get it into my project.

Any tips on the point below?

I still have the issue where each new line in the textbox causes it to change size, which is what I meant by non-destructively undoing the autoscroll? I've tried just disabled autoscroll and/or deleting the sizer text object but I can't figure out how to get it back to how it was: with the textbox automatically being the size it needs to be to fit the text once it's finished typwriting.

[Tony Li]

I'm having trouble understanding what you mean. I'll take a guess.

In the screenshot below, Autoscroll is enabled on the subtitle text's typewriter effect:

autoscroll.png (65.39 KiB) Viewed 768 times

As the typewriter types, the subtitle text's Rect Transform grows in size to accommodate the currently-visible text.

In contrast, in the screenshot below, Autoscroll is disabled:

noAutoscroll.png (60.34 KiB) Viewed 768 times

As soon as the typewriter effect starts, the Rect Transform is sized to accommodate the final text size.

If you want the latter, disable Autoscroll.

[NedSanders]

Sorry if I wasn't super clear! You guessed correctly, that's exactly what I wanted and it worked perfectly. Thanks for your patience!