Ограничить максимальную ширину контейнера во Flutter

Может быть, использовать гибкий текст вокруг текста, а затем обернуть его в контейнер фиксированного размера? Просто идея.

Вы можете добавить ограничение в виджет контейнера с предпочтительным maxWidth следующим образом:

Widget build(context) {
return Row(
  mainAxisSize: MainAxisSize.min,
  children: [
    Container(
      constraints: BoxConstraints(minWidth: 100, maxWidth: 200),
      padding: EdgeInsets.all(10),
      decoration: BoxDecoration(
        color: color ?? Colors.blue,
        borderRadius: BorderRadius.circular(10)
      ),
      child: msg
    )
  ],  
);
}

Надеюсь, это поможет!

Используйте ConstrainedBox с BoxConstraintsmaxWidth, завернутым в виджет Flexible(). Гибкий виджет также позволяет изменять размер окна для небольших экранов.

Flexible(
  child: ConstrainedBox(
    constraints: BoxConstraints(maxWidth: 150),
    child: Container(
      color : Colors.blue,
      child: Text('Your Text here'),
    ),
  ),
),

Я знаю, что уже поздно, но кто-то может получить помощь в будущем.
Я использовал плагин auto_size_text, чтобы сделать это:

AutoSizeText(
  'A really long String',
  style: TextStyle(fontSize: 30),
  minFontSize: 18,
  maxLines: 4,
  overflow: TextOverflow.ellipsis,
)

Вот простой метод, который я использую для длинных текстов:

ConstrainedBox(
  constraints: BoxConstraints(maxWidth: 200),
  child: Container(
    child: Text(
      'Long string of text',
      maxLines: 2,
      overflow: TextOverflow.ellipsis,
    ),
  ),
)

Обратите внимание на атрибут maxLines, который может быть полезен, если вы хотите показать только одну строку текста.

Используйте свойство Constraints в виджете Container.

используйте значение maxWidth и minWidth для выполнения требования.

 Container(
      constraints: BoxConstraints(minWidth: 150, maxWidth: 300),
      padding: EdgeInsets.all(10),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(5)),
      child: Text("")
    )

Это должно быть внутри виджета Row или Column

1. Ряд

  Row(
      children: [
        Container(
            constraints: BoxConstraints(maxWidth: 300),
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8.0)),
            child: Text("Long Text....")
        ),
      ],
    );

2. Колонка

Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
            constraints: BoxConstraints(maxWidth: 300),
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8.0)),
            child: Text("Long Text....")
        ),
      ],
    );

Здесь, в обоих примерах, это работает, потому что Column и Row позволяют своим дочерним элементам расширяться до заданного ограничения/размера.

Примечание: Если дочерний элемент хочет, чтобы его размер отличался от размера его родителя, а у родителя недостаточно информации для выравнивания, то размер дочернего элемента может быть проигнорирован.

В моем случае мое решение было таким: Обернуть в строку и добавить разделитель (в виджете пузыря комментариев я не определял ни ширину, ни максимальную ширину. Она растет в зависимости от текста. для ограничения ширины добавлено дополнение к пузырю комментариев.

return Row(
      children: [
          CommentBubble(
              chatText: snapshot.get('text'),
              sentAt: snapshot.get('sentAt'),
              sendBy: snapshot.get('sendBy'),
          ),
          Spacer(),
      ],
);

Вот как я это исправил

Center(
    child: Container(
      child: this.child,
      width: 300,
      height: double.infinity,
    ),
  )

Для меня, по крайней мере, установка поля Constrained в IntrinsicWidth решила проблему.

IntrinsicWidth(
  child: Container(
    constraints: BoxConstraints(maxWidth: 200),
    child: Row(
      children: [
       
      ],
    ),
  ),
);