Почему SizedBox не ограничивает ширину текстового виджета? - PullRequest
Новая
       1

Почему SizedBox не ограничивает ширину текстового виджета?

0 голосов
/ 09 мая 2020

Итак, я делаю простое приложение для обмена сообщениями и столкнулся со следующей проблемой:

Я установил ширину SizedBox равной 100, но когда дочерний элемент является текстовым виджетом, он переопределяет ширину SizedBox.

Этот виджет вызывается из ListView.builder в другом файле.

Есть ли другой виджет, который я должен использовать для этого вместо sizebox? 

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: SizedBox(
        width: 100,
        child: Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.all(Radius.circular(14.0)),
            color: currentUserIsSender ? Styles.accentColor30 : Colors.grey.shade200,
          ),
          padding: EdgeInsets.all(8.0),
          child: Text(
            message,
            softWrap: true,
          ),
        ),
      ),
    );
  }

Спасибо

Изображение проблемы с приложением

1 Ответ

0 голосов
/ 09 мая 2020

Проблема в том, что SizedBox может установить размер виджета только в пределах ограничений, установленных родителем. Многие виджеты, такие как Padding, хотят, чтобы их дочерние элементы занимали 100% доступного им пространства. Это имеет смысл, потому что, если ребенок меньше, они не будут знать, куда его положить.

Если вы хотите, чтобы ребенок был меньше, чем родитель, вы можете использовать Center или Align, например, заменить 

Padding(
  child: SizedBox(
    width: 100,
    child: ...
    ),
  ),
);

с 

Padding(
  child: Center(
    child: SizedBox(
      width: 100,
      child: ...
      ),
    ),
  ),
);

(для приложения чата вы можете использовать Align вместо Center)

Прочтите по теме: https://flutter.dev/docs/development/ui/layout/constraints

...