Простой вызов макета

Question

Я пытаюсь создать карту, которая отображает счет в игре.Карта будет более сложной, чем в этом примере, но в середине карты я хочу получить строку.Эта строка содержит две колонки.Первый столбец содержит две строки.В каждой из этих двух строк указывается название команды и счет.

  Widget build(BuildContext context) {
    return Card(
      child:  Row(
        children: <Widget>[
          Column(
            children: <Widget>[
              Row(
                children: <Widget>[
                  Text('Team A'),
                  Text('100'),
                ],
              ),
              Row(
                children: <Widget>[
                  Text('Team B'),
                  Text('100'),
                ],
              ),
            ],
          ),
          Text('15:00'),
        ],
      ),
    );
  }

Теперь я хочу обернуть текстовые виджеты, которые отображают название команды в расширенном виде.Как только я это делаю, я получаю длинную описательную ошибку, которая в основном говорит о том, что у моей строки есть родительский элемент, который не имеет конечной ширины, но у него есть дочерний элемент, который просит расширение, и эти два находятся в конфликте.Я понимаю, что они в конфликте.Как мне это исправить?Я определенно не хочу давать родительскому виджету (карте) конечную ширину.

Answer 1

Не совсем на 100% ясно, как вы хотите, чтобы табло выглядело - это тот случай, когда быстрая помощь была бы очень полезна.

Однако я могу сказать вам, почему вы получаетеисключение.

Когда вы оборачиваете текст «Команда А» в Расширенное, во время прохода макета путаница запутывается.В строке верхнего уровня есть два элемента, ни один из которых не определяет какого-либо размера, поэтому он делает их максимально большими по поперечной оси (по вертикали) и как можно меньшими по основной оси (по горизонтали).Это означает, что они делегируют свой размер своим детям.

Оборачивая «Команду А» в Расширенном, вы в основном говорите это:

«Эй, ты,ваш родительский виджет довольно большой. Я хочу, чтобы вы взяли на себя все, что еще не используется, вместо того, чтобы быть таким большим, каким вы обычно были бы. "

Он отвечает

"Конечно, босс, но я только что проверил, и ни один из моих родителей на самом деле не имеет определенного размера ... поэтому я не знаю, что делать. Думаю, я просто скину исключение. "

Исправление заключается в определении размера родителя, который в данном случае является столбцом, который содержит две строки (черт, это сбивает с толку).

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

  Widget build(BuildContext context) {
    return Card(
      child: Row(
        children: <Widget>[
          Expanded(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Row(
                  children: <Widget>[
                    Expanded(child: Text('Team A')),
                    Text('100'),
                  ],
                ),
                Row(
                  children: <Widget>[
                    Expanded(child: Text('Team B')),
                    Text('100'),
                  ],
                ),
              ],
            ),
          ),
          Text('15:00'),
        ],
      ),
    );
  }

Таким образом, столбец, содержащий две строки, расширяется, чтобы занять все доступное пространство во время прохода макета.Как только текст «Team A» начинает пробовать проход макета, он может просто масштабировать себя (по горизонтали) до этого столбца.

Затем вы можете поиграть с коэффициентом изгиба, чтобы получить все, как вы хотите.

Просто к сведению - как только вы начнете получать много вложенных контейнеров и строк, вы можете рассмотреть CustomMultiChildLayout .Он немного более ручной, так как вам нужно самостоятельно выполнять расчеты макета, но в долгосрочной перспективе это может быть проще, в зависимости от сложности вашего табло.