Search Unity

How to make text with a scroll bar?

Discussion in 'UGUI & TextMesh Pro' started by Velcer, Mar 16, 2017.

  1. Velcer

    Velcer

    Joined:
    Mar 16, 2017
    Posts:
    23
    Greetings,

    I'm attempting to make a chat system and pretty much every way I've tried has failed.

    Is there a good solution to making a chat log attached to a panel?

    If at all possible, I want to attach a Text component to a panel and have a scrollbar scroll with the text inside the panel.

    Can this be done?
     
  2. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,689
    The effect itself is quite simple.
    You have the parent GO with a scrollrect and have the Child Content with a Vertical Layout attached.
    You can then use a scrollbar with the scrollrect to scroll the content.
    Additionally, you can add a mask to the parent so the user only sees a few lines instead of them all.

    The issue with "Chat Boxes" is performance, as text rendering is not great. Although with TextMeshPro now being free, this might be a lot easier.

    SO start with a Scroll View, add text as Children to the "Content" and remove unneeded scrollbars and you should be set.

    P.S.
    Must get round to adding a "Chatbox" control to the UI Extensions project :p
     
    Ali_V_Quest likes this.
  3. TheWanderingBen

    TheWanderingBen

    Joined:
    Nov 3, 2015
    Posts:
    98
    I'm thinking about using an InputField object for the portion where the player types a message, and a Text object for where to display the delivered messages.

    On the InputField's EndEdit call, you take its text value and append it to the Text object's text value, then delete the InputField's text value.

    To get the scrolling to work, use the ScrollRect/Scrollbar technique from this tutorial.

    I must admit, I haven't tried this myself, but without knowing what you've tried so far, this is where I would start.
     
  4. methos5k

    methos5k

    Joined:
    Aug 3, 2015
    Posts:
    8,712
    Are you still looking for a solution or did one of these previous posters get you headed in the right direction?
     
  5. Velcer

    Velcer

    Joined:
    Mar 16, 2017
    Posts:
    23
    This is solved, thanks!
     
  6. mrgreaper

    mrgreaper

    Joined:
    Aug 6, 2017
    Posts:
    18
    can you post how you solved it?
    looking to do a similar thing (a text ui that is scrollable, google search sent me here and i confess its a little frustrating to simply see "This is solved" lol
     
  7. methos5k

    methos5k

    Joined:
    Aug 3, 2015
    Posts:
    8,712
    Did you try some of the suggestions from this page? Can you describe your setup so far?
     
  8. mrgreaper

    mrgreaper

    Joined:
    Aug 6, 2017
    Posts:
    18
    At the minute i shelved making it scroll-able to focus on the code that provides the text to the textUI.
    I did spend a couple of hours trying to get my head around it, needing transform rects and assigning scroll bars and masks and completly messing up my project (it is in my opinion needlessly complicated for something that is a basic requirement of displaying a large panel of text).
    I will attempt again later, i am not sat here waiting for the solution to just drop.

    The setup at the minute is
    a quad with a paper texture
    a canvas with a resolution of 1080x1920 (the resolution of the phone target...but something i do need to adjust to make more square)
    with a textui text trancated if it drops off it (that needs to be changed ofcourse) and auto sized text for readability on both small and large text inputs.
    a script sends the text to the textui

    coming from android where to do this i just put a webview into a scrollable box and viola lol.

    So much is better in unity (the fact that i can build for pc and android from the same project for example) and not at the mercy of supporting 3 different sdk ways of doing the same thing that work only in 1 phone version each lol, BUT some things seem needlessly complicated, the ability to scroll text in a box is pretty standard in most games.


    EDIT
    after a few more hours of hitting my head on a wall i found this video

    not only did it help me sort out the scrolling but it has given me a much better understanding of anchour points and ui scaling. so YAY!
     
    Last edited: Aug 14, 2017
    BMRG14, Philip-Rowlands and Zyriab like this.
  9. methos5k

    methos5k

    Joined:
    Aug 3, 2015
    Posts:
    8,712
    Very cool.. I haven't seen that video, but glad it helped you :)
     
  10. mrgreaper

    mrgreaper

    Joined:
    Aug 6, 2017
    Posts:
    18
    Created - deleted - recreated a few panels to make sure i understand the concepts right in my head but yeah the video helped a hell of a lot.
    Originally commented here as its a pet peev of mine when you search for help with something, see someone with the exact same issue and then it just ends with "solved it" and no description/link of how lol
     
  11. methos5k

    methos5k

    Joined:
    Aug 3, 2015
    Posts:
    8,712
    I know.. it's nice when people post a solution :) At least this thread contains that video link now, which could help someone else if they find their way here.
     
    SimonDarksideJ and mrgreaper like this.
  12. multimediamarkers

    multimediamarkers

    Joined:
    Feb 17, 2016
    Posts:
    49
    This is also a simple explanation of how to create a scrollable text panel ...
     
  13. AnhNT86

    AnhNT86

    Joined:
    Jul 30, 2018
    Posts:
    1
    The above method is useful for Text, but what to do with InputField, can you give me a solution, thanks?
     
  14. gputhread

    gputhread

    Joined:
    Dec 7, 2018
    Posts:
    36
    same i also want to download unknown text size from url and want to make it scrollable
     
    AnhNT86 likes this.