Метод rich
Метод rich виджета
Text рисует тот же абзац,
что и конструктор Text, но вместо одной строки
принимает дерево
TextSpan:
у каждого фрагмента свой текст и свой стиль.
Параметры style, textAlign,
overflow и maxLines задают весь абзац сразу:
базовый стиль, выравнивание, обрезку и число строк.
Само дерево передают в textSpan.
Синтаксис
Text.rich(
TextSpan(
text: 'abcde',
children: [
TextSpan(text: '12345'),
],
),
)
Параметры
| Параметр | Описание |
|---|---|
textSpan |
Дерево
TextSpan,
из которого собран абзац. Обязательный параметр.
|
style |
Базовый стиль для всего абзаца. Сливается
со стилями отдельных TextSpan.
|
textAlign |
Выравнивание. Принимает
TextAlign.
|
overflow |
Обрезка при нехватке места. Принимает
TextOverflow.
|
maxLines |
Лимит строк абзаца. |
Пример
Давайте выделим вторую часть строки жирным:
import 'package:flutter/material.dart';
void main()
{
runApp(
MaterialApp(
home: Scaffold(
body: Center(
child: Text.rich(
TextSpan(
text: 'abcde',
children: [
TextSpan(
text: '12345',
style: TextStyle(fontWeight: FontWeight.bold),
),
],
),
),
),
),
),
);
}
На экране две части текста пойдут подряд:
обычная 'abcde' и жирная '12345'.
Пример
Давайте зададим разный цвет для каждого куска:
import 'package:flutter/material.dart';
void main()
{
runApp(
MaterialApp(
home: Scaffold(
body: Center(
child: Text.rich(
TextSpan(
children: [
TextSpan(
text: 'abcde',
style: TextStyle(color: Colors.red),
),
TextSpan(
text: '12345',
style: TextStyle(color: Colors.green),
),
],
),
),
),
),
),
);
}
На экране первая часть будет красной, вторая - зелёной.