Блог

Я создаю микросхему flutter, где на этикетке есть HTML-текст tag (br) . Я бы хотел, чтобы метка прерывалась на основе тега «br и размера виджета чипа, чтобы отразить это.

Вот мой образец :

 Chip(
  avatar: CircleAvatar(
    backgroundColor: Colors.grey.shade800,
    child: Text('AB'),
  ),
  label: HtmlWidget('You have pushed the button <br>this many times:'),
),
  

Я использую «flutter_widget_from_html_core» для рендеринга html.

Текст переносится, но виджет остается того же размера

не могли бы вы сообщить мне, как это исправить или альтернативный вариант

пример

Похоже, существует некоторая проблема с HtmlWidget неправильным вычислением размера в случае разрыва строки.

Простое исправление должно сработать.

РЕДАКТИРОВАТЬ: этот код также является адаптивным, просто передайте responsive:true

 class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Chip(
      avatar: CircleAvatar(
        backgroundColor: Colors.grey.shade800,
        child: Text('AB'),
      ),
      label: ResponsiveBrTag(
        'You have pushed the button very hard <br> this many times:',
      ),
    );
  }
}

class ResponsiveBrTag extends StatelessWidget {
  final String htmlText;
  final bool responsive;
  const ResponsiveBrTag(this.htmlText, {this.responsive = false});
  @override
  Widget build(BuildContext context) {
    var splits = htmlText.split("<br>");
    var fixedLayout = Column(
      children: splits.map((s) => Text(s)).toList(),
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.start,
    );
    var respLayout = Wrap(children: splits.map((s) => Text(s)).toList());

    return responsive ? respLayout : fixedLayout;
  }
}
  

Примечание: я не полностью протестировал его на наличие ошибок, это всего лишь пример кода.