Search Unity

  1. Welcome to the Unity Forums! Please take the time to read our Code of Conduct to familiarize yourself with the forum rules and how to post constructively.
  2. We’re making changes to the Unity Runtime Fee pricing policy that we announced on September 12th. Access our latest thread for more information!
    Dismiss Notice
  3. Dismiss Notice

[Solved] Best practice - displaying multiple lines with unity tiny

Discussion in 'Project Tiny' started by boringName, Apr 26, 2019.

  1. boringName


    Jul 20, 2016
    I wish to display a paragraph of text. If this paragraph is too long to display in one line, I'd like to display it across multiple lines.

    Currently, I can't find any documented way to make a UI Text component wrap over multiple lines. In all the sample tiny projects, multiple lines of text are displayed using multiple entities each with a UI Text component that contains a portion of the full sentence.

    Is there currently support for UI text wrapping over multiple lines, such that I can toss a longish paragraph in a single UI text component?

    If there isn't its alright, as a simple System that cuts a long string into multiple sentences should be able to mimic the functionality I want, I just want to make sure I'm not missing a simpler method.

    Thanks in advance for any advice!
  2. reallyhexln


    Jun 18, 2018

    As I know, Tiny is not supported multiline fields yet ( , see slide #10), and the only one way to achieve displaying of text paragraph, is using multiple text fields.

    It's not a problem for me, because I use small predefined set of text replies, so I just hardcoding them and their font size.

    If you will intensively use multiline text, I think, it's better to implement some algorithm that will separate text to specified count of text lines.

    I'm not sure, it's easy to achive, but I don't know another way.
    boringName likes this.
  3. boringName


    Jul 20, 2016
    Thanks for your advice! In the end, I got the code working.

    I'm putting my code here to be helpful to anyone else attempting to do what I did. My solution is rather inelegant as this is the first time I've ever written in project tiny, or typescript for that matter, but hopefully it will be helpful to someone else attempting to do something similar!

    Code (JavaScript):
    2. namespace game {
    4.     /** New System */
    5.     export class TextSystem extends ut.ComponentSystem {
    7.         OnUpdate():void {
    9.             var toDisplay : String;
    10.             toDisplay = "";
    11.   [ut.Entity, ut.HitBox2D.HitBoxOverlapResults, game.IsPlayer, ut.Core2D.Sprite2DRenderer],
    12.                 (entity, hit, gameOverLine, sprite) => {
    13.                     var firstChoice = hit.overlaps[0];
    14.                     if(, game.IsTextBox))
    15.                     {
    16.                         var textBox =, game.IsTextBox);
    17.                         toDisplay = textBox.text;
    18.                     }
    20.                     //, game.GameOverLine);
    21.                 });
    23.             //okay so now we have the string to display. So lets display! Maybe. We might have to (dun dun dun) split the string into multiple lines so that it fits.
    24.             var finalDisplay : string[];
    25.             finalDisplay = [];
    26.             var length = toDisplay.length;
    27.             var numLines = 1 + (length - 1) % 48; //50 arbitary number of characters to max out line.
    29.             for(var i = 0; i < Math.min(4,numLines);i++)
    30.             {
    31.                 finalDisplay.push(toDisplay.substring(i * 48,(i + 1) * 48));
    32.             }
    33.             var finalLength = finalDisplay.length;
    36.   [ut.Entity,game.DisplayText,ut.Text.Text2DRenderer],
    37.                 (entity,tag,textRenderer) => {
    38.                     var x = tag.Index;  //what line of text should this text renderer display?
    39.                     if(x < finalLength && x >= 0)
    40.                     {
    41.                         textRenderer.text = finalDisplay[x];
    42.                     }
    43.             });
    44.         }
    45.     }
    46. }
    Rallix and reallyhexln like this.