RichText class

A paragraph of rich text.

The RichText widget displays text that uses multiple different styles. The text to display is described using a tree of TextSpan objects, each of which has an associated style that is used for that subtree. The text might break across multiple lines or might all be displayed on the same line depending on the layout constraints.

Text displayed in a RichText widget must be explicitly styled. When picking which style to use, consider using DefaultTextStyle.of the current BuildContext to provide defaults. For more details on how to style text in a RichText widget, see the documentation for TextStyle.

Consider using the Text widget to integrate with the DefaultTextStyle automatically. When all the text uses the same style, the default constructor is less verbose. The Text.rich constructor allows you to style multiple spans with the default text style while still allowing specified styles per span.

RichText(
  text: TextSpan(
    text: 'Hello ',
    style: DefaultTextStyle.of(context).style,
    children: const <TextSpan>[
      TextSpan(text: 'bold', style: TextStyle(fontWeight: FontWeight.bold)),
      TextSpan(text: ' world!'),
    ],
  ),
)

Selections

To make this RichText Selectable, the RichText needs to be in the subtree of a SelectionArea or SelectableRegion and a SelectionRegistrar needs to be assigned to the RichText.selectionRegistrar. One can use SelectionContainer.maybeOf to get the SelectionRegistrar from a context. This enables users to select the text in RichTexts with mice or touch events.

The selectionColor also needs to be set if the selection is enabled to draw the selection highlights.

RichText(
  text: const TextSpan(text: 'Hello'),
  selectionRegistrar: SelectionContainer.maybeOf(context),
  selectionColor: const Color(0xAF6694e8),
)

See also:

• TextStyle, which discusses how to style text.
• TextSpan, which is used to describe the text in a paragraph.
• Text, which automatically applies the ambient styles described by a DefaultTextStyle to a single string.
• Text.rich, a const text widget that provides similar functionality as RichText. Text.rich will inherit TextStyle from DefaultTextStyle.
• SelectableRegion, which provides an overview of the selection system.