Flutter. Много: “Hola, Amigos! Сегодня мы посмотрим, чем отличаются 2 виджета для вывод…”

Hola, Amigos! Сегодня мы посмотрим, чем отличаются 2 виджета для вывода текста - RichText и Text.rich, а также разберемся, какой из них лучше использовать.

RichText из них основной. Он позволяет нам отрисовывать текст с применением нескольких стилей, а также добавлением виджетов внутрь. Простой пример применения - выделение части текста жирным или курсивом:


RichText(
  text: TextSpan(
    children: [
      TextSpan(text: ‘Обычный текст. ‘, style: TextStyle(fontSize: 14, color: Colors.black)),
      TextSpan(text: Жирный текст. ‘, style: TextStyle(fontSize: 14, color: Colors.black, fontWeight: FontWeight.bold)),
      TextSpan(text: ‘Снова обычный текст.‘, style: TextStyle(fontSize: 14, color: Colors.black)),
    ],
  ),
);

С другой стороны, нам нужно каждый раз применять стиль текста к RichText, а также передавать ему textScaler. Эту проблему можно решить при помощи Text.rich, но он уже менее гибкий, чем RichText, так как в нем сложнее сделать что-то по-максимуму кастомное.


Text.rich(
  TextSpan(
    children: [
      TextSpan(text: ‘Обычный текст. ‘),
      TextSpan(text: Жирный текст. ‘, style: TextStyle(fontSize: 14, color: Colors.black, fontWeight: FontWeight.bold)),
      TextSpan(text: ‘Снова обычный текст.‘),
    ],
  ),
);

Получается, что для большинства случаев нам подойдет именно Text.rich, а RichText нужен для максимальной кастомизации.

Рассказывайте в комментариях, какой из них чаще используете в своей работе?