Text
The Text widget is one of the most commonly used widgets in Digia Studio. It allows you to display static or dynamic text content on the screen. Whether it's a heading, a paragraph, a label, or inline text — the Text widget helps convey information clearly and effectively to users.
It plays a vital role in any user interface, contributing both to the design language and the communication of purpose, values, and actions.
Adding a Text Widget
To add the Text widget to your project:
Select the Text widget from the Add Widget button.
Alternatively, insert it directly via the widget tree, or drag and drop it from the Widget Pallet.
Once selected, the Widget Properties Panel appears on the right side of the screen.
Use this panel to enter your desired text and customize its appearance.
Customizing Text
Once the Text widget is placed on screen, you can style and customize it via the Widget Properties panel:
Modify font styles and weights.
Choose font sizes and colors.
Control how the text aligns and wraps.
Set a limit on the number of visible lines.
For more detailed formatting (e.g., multiple styles in one sentence), we recommend using the RichText widget instead.
Content Properties
Value
The actual string content displayed. Can be a word, sentence, or paragraph. Can be an expression or simple value.
Typography Properties
Text Style
Controls the font styling. Can be linked to predefined text styles or customized individually.
Max Lines
Limits the number of lines shown. If empty, the text will expand as needed.
Alignment
Aligns text horizontally (left, center, right, justify).
Overflow
Controls how text overflows. Options include clip, fade, ellipsis, visible, marquee.
Text Style Properties
The Text Style selector has two states: linked (using predefined text styles) and unlinked (custom styling).
When Linked to Text Style
When using a predefined text style, you can modify these properties:
Text Color
The color of the text in HEX format (e.g., #000000).
Highlight Color
The background color behind the text for highlighting effects.
Text Decoration
Adds decorative lines to text (underline, overline, line-through).
Text Decoration Color
The color of the text decoration lines.
When Unlinked (Custom Styling)
When detached from predefined styles, you can customize all font properties:
Font Family
The font family used (e.g., Poppins, Roboto).
Size
Font size in pixels.
Weight
Font weight like regular, bold, medium, etc.
Height
Line height multiplier (e.g., 1.5 for 150%).
is Italic
Whether the text should be displayed in italic style.
Text Color
The color of the text in HEX format (e.g., #000000).
Highlight Color
The background color behind the text for highlighting effects.
Text Decoration
Adds decorative lines to text (underline, overline, line-through).
Text Decoration Color
The color of the text decoration lines.
Default Properties
The Text widget supports all Default Properties.
Best Practices
Use semantic styling (
bodyLarge,headlineSmall, etc.) for consistency.Avoid long blocks of text; break content into readable chunks.
Prefer RichText if you need varied styling within a single sentence or paragraph.
Use the link/unlink feature to switch between predefined styles and custom styling as needed.
Last updated