CreateText

Hello World

Content:
- Methods

If you want to display text in your app you can use the Text object.

txt = app.CreateText( text, width, height, options ) → app object: Text

You can use the “Multiline” option to allow multi-line text and the “Left” or “Right” options to align the text. The default is single line centered text.
Other options you will see used in the samples include “AutoScale”, “Bold”, “Html” and “FontAwesome”.
Use the SetText and GetText functions of the Text object to set and get it's text.

Example - Single line click to expand contents

You can change the look of a Text using the SetBackColor and SetTextColor functions on the Text object.

Example - Multi line click to expand contents

function OnStart()
{
    lay = app.CreateLayout( "Linear", "VCenter,FillXY" );

    txt = app.CreateText( "Hello\nWorld", 0.8, 0.2, "Multiline" );
    txt.SetTextSize( 12 );
    txt.SetTextColor( "#ff6666ff" );
    txt.SetBackColor( "#ffffffff" );
    lay.AddChild( txt );

    app.AddLayout( lay );
}

Copy Copy All Run

Text can be shortened using ellipsis (...) when the size of the control is too small to show all the text. Use the SetEllipsize to control where the ellipsis is placed. Available modes are “start”, “middle”, “end” and “marq”.

Example - Ellipsize click to expand contents

function OnStart()
{
    lay = app.CreateLayout( "Linear", "VCenter,FillXY" );

    txt = app.CreateText( "The quick brown fox jumps over the lazy dog", 0.75 );
    txt.SetTextSize( 28 );
    txt.SetEllipsize( "end" );
    lay.AddChild( txt );

    app.AddLayout( lay );
}

Copy Copy All Run

You can also set a background image/pattern or background gradient for the Text using the SetBackground and SetBackGradient functions. See Layouts for examples of how to use these functions.