Флаттер разного цвета для разных букв в текстовом виджете
У меня есть сценарий использования, когда я хочу изменить цвет буквы в строке внутри Text
виджет. Допустим, моя строка "Флаттер". По нажатию FloatingActionButton
Я хочу, чтобы буква "F" изменила свой цвет, а затем при следующем нажатии FloatingActionButton
измените цвет буквы 'l', затем 'u', затем 't', затем 't', затем 'e' и, наконец, 'r' с каждым FloatingActionButton
Нажмите.
Пожалуйста, не предлагайте другой Text
виджет для каждой буквы.
2 ответа
Решение
Вы можете сделать это с помощью RichText
виджет и разные TextSpan
s. Вы можете прочитать документацию, чтобы больше узнать о ней. https://docs.flutter.io/flutter/widgets/RichText-class.html
RichText(
text: TextSpan(
text: 'Hello ',
style: DefaultTextStyle.of(context).style,
children: const <TextSpan>[
TextSpan(text: 'bold', style: TextStyle(fontWeight: FontWeight.bold)),
TextSpan(text: ' world!'),
],
),
)