Флаттер разного цвета для разных букв в текстовом виджете

У меня есть сценарий использования, когда я хочу изменить цвет буквы в строке внутри Text виджет. Допустим, моя строка "Флаттер". По нажатию FloatingActionButtonЯ хочу, чтобы буква "F" изменила свой цвет, а затем при следующем нажатии FloatingActionButtonизмените цвет буквы 'l', затем 'u', затем 't', затем 't', затем 'e' и, наконец, 'r' с каждым FloatingActionButton Нажмите.

Пожалуйста, не предлагайте другой Text виджет для каждой буквы.

2 ответа

Решение

Вы можете сделать это с помощью RichText виджет и разные TextSpans. Вы можете прочитать документацию, чтобы больше узнать о ней. 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!'),
    ],
  ),
)
Другие вопросы по тегам