Почему дети этого столбца так сильно отличаются друг от друга? Разве они все не должны отображаться одинаково?

Question

Я отображаю столбец внутри контейнера, который должен содержать фрагмент текста и ListView с несколькими элементами ToDo с флажками. Однако ListView вообще не отображается. Я понятия не имею, почему это может происходить.

class NotesScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Container(
            padding: EdgeInsets.only(
              top: 20.0,
            ),
            height: 70.0,
            decoration: BoxDecoration(
              color: Color(0xFFFF674F),
              borderRadius: BorderRadius.only(
                bottomLeft: Radius.circular(20.0),
                bottomRight: Radius.circular(20.0),
              ),
            ),
            child: Column(
              children: <Widget>[
                Text(
                  'Note-Taker',
                  style: TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.w700,
                    fontSize: 20.0,
                  ),
                ),
                ListView(
                  children: <Widget>[
                    ListTile(
                      title: Text('Filler'),
                      trailing: Checkbox(
                        value: false,
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

Answer 1

У вас есть ListView внутри вашего второго Column попробуйте это

 Scaffold(
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Container(
            padding: EdgeInsets.only(
              top: 20.0,
            ),
            height: 70,
            decoration: BoxDecoration(
              color: Color(0xFFFF674F),
              borderRadius: BorderRadius.only(
                bottomLeft: Radius.circular(20.0),
                bottomRight: Radius.circular(20.0),
              ),
            ),
            child: Column(
              children: <Widget>[
                Text(
                  'Note-Taker',
                  style: TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.w700,
                    fontSize: 20.0,
                  ),
                ),
              ],
            ),
          ),
          Expanded(
            child: ListView(
              padding: EdgeInsets.all(0),
              shrinkWrap: true,
              children: <Widget>[
                CheckboxListTile(
                  title: Text('There would Normally be text here'),
                  value: true,
                  onChanged: (bool value) {},
                )
              ],
            ),
          ),
        ],
      ),
    );

Дайте мне знать, как это работает для вас

Answer 2

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

Scaffold(
  body: Column(
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: <Widget>[
      Container(
        padding: EdgeInsets.only(
          top: 20.0,
        ),
        height: 70.0,
        decoration: BoxDecoration(
          color: Color(0xFFFF674F),
          borderRadius: BorderRadius.only(
            bottomLeft: Radius.circular(20.0),
            bottomRight: Radius.circular(20.0),
          ),
        ),
      ),
      Expanded(
        child: Column(
          children: <Widget>[
            Text(
              'Note-Taker',
              style: TextStyle(
                color: Colors.white,
                fontWeight: FontWeight.w700,
                fontSize: 20.0,
              ),
            ),
            Expanded(
              child: ListView(
                children: <Widget>[
                  ListTile(
                    title: Text('Filler'),
                    trailing: Checkbox(
                      onChanged: (value) {},
                      value: false,
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    ],
  ),
);