Flutter ListView.Builder () в прокручиваемой колонке с другими виджетами

Question

У меня есть TabBarView () с количеством различных представлений.Я хочу, чтобы они были столбцами с TextField вверху и ListView.Builder () внизу, но оба виджета должны находиться в одной прокручиваемой области (scrollview).То, как я это реализовал, вывело несколько ошибок:

@override
Widget build(BuildContext context) {
return new Column(
  mainAxisAlignment: MainAxisAlignment.center,
    mainAxisSize: MainAxisSize.max,
    children: <Widget>[
      new Padding(
          padding: EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
          child: new TextField(
            decoration: new InputDecoration(
                hintText: "Type in here!"
            ),
          )
      ),
      new ListView.builder(
          itemCount: _posts.length, itemBuilder: _postBuilder)
    ],
   );
}

Ошибка:

I/flutter (23520): The following assertion was thrown during performResize():
I/flutter (23520): Vertical viewport was given unbounded height.
I/flutter (23520): Viewports expand in the scrolling direction to fill their container.In this case, a vertical
I/flutter (23520): viewport was given an unlimited amount of vertical space in which to expand. This situation
I/flutter (23520): typically happens when a scrollable widget is nested inside another scrollable widget.
I/flutter (23520): If this widget is always nested in a scrollable widget there is no need to use a viewport because
I/flutter (23520): there will always be enough vertical space for the children. In this case, consider using a Column
I/flutter (23520): instead. Otherwise, consider using the "shrinkWrap" property (or a ShrinkWrappingViewport) to size
I/flutter (23520): the height of the viewport to the sum of the heights of its children.

Я читал о размещении ListView.builder () в Expanded-Area, но это сделало вид текстового поляиз "липкой", что не то, что я хочу.:-)

Я также натолкнулся на CustomScrollView, но не совсем понял, как его реализовать.

Заранее спасибо!

Answer 1

Размещение ListView внутри виджета Expanded должно решить вашу проблему:

@override
Widget build(BuildContext context) {
return new Column(
  mainAxisAlignment: MainAxisAlignment.center,
    mainAxisSize: MainAxisSize.max,
    children: <Widget>[
      new Padding(
          padding: EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
          child: new TextField(
            decoration: new InputDecoration(
                hintText: "Type in here!"
            ),
          )
      ),
      new Expanded(child: ListView.builder(
          itemCount: _posts.length, itemBuilder: _postBuilder))
    ],
   );
}

Answer 2

Лучшим способом будет сделать прокручиваемый столбец, сделав столбец дочерним для SingleChildScrollView, а затем назначив один и тот же ScrollController для SingleChildScrollView и ListView.builder.Это сделает текстовое поле и нижний ListView прокручиваемым.

Answer 3

Column не прокручивается, поэтому TextField сверху не будет прокручиваться, а ListView снизу.

Лучший способ решить эту проблему, по моему мнению, состоит в том, чтобысделайте ваш TextField первым элементом в вашем ListView.

Так что вам не понадобится столбец, ваш родительский виджет - ListView, а его дочерние элементы - TextField, за которым следуют остальныепредметы, которые вы строите с _postBuilder.