Интерфейс Flutter: два ListView.builders в расширенном виджете

Question

приложение должно быть совместимо с различными форматами экрана. Режим портрета установлен, поэтому ландшафтный режим не должен соблюдаться.

Содержимое размещено в виджете Column (). Все виджеты с содержимым, кроме обоих ListView.builder, имеют фиксированную высоту.

Можно ли расположить оба ListView.builder в виджете, таком как Expanded, чтобы оба они равномерно расширялись в доступном пространстве, и вы по-прежнему могли прокручивать дополнительные оба?

Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              _showQuestionTheme(),
              _showQuestion(), //ListView.builder, which should expand 
              _showAnswers(), //ListView.builder, which should expand
              _buildAnswerButton(),
              _buildGameStatusTextfields(),
              _progressBarAnswerTimeLeft(),
            ],
          ),

Answer 1

Надеюсь, это сработает для вас:)

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text("LIST VIEW:1",style: TextStyle(fontWeight: FontWeight.bold),),
              SizedBox(height: 20,),
             Expanded(
              //  flex: 1,
               child:Container(
                 decoration: BoxDecoration(
                   border: Border.all(color: Colors.black),
                   color: Colors.green,
                 ), 
                 height: 20,
                 child: ListView.builder(
                   itemCount: 20,
                   itemBuilder: (context, index){
                     return Card(
                       child: ListTile(
                         title: Text("Name"),
                          subtitle: Text("SubNME"),
                        ),
                      );
                    }
                  ),
                )
              ),
              SizedBox(height: 20,),
               Text("LIST VIEW:2",style: TextStyle(fontWeight: FontWeight.bold)),
              SizedBox(height: 20,),
              Expanded(
               child:Container(
                 decoration: BoxDecoration(
                   border: Border.all(color: Colors.black),
                   color: Colors.red,

                 ),

                 height: 20,
                 child: ListView.builder(
                   itemCount: 20,
                   itemBuilder: (context, index){
                     return Card(
                       child: ListTile(
                         title: Text("Title"),
                          subtitle: Text("Subtitle"),
                       ),
                     );
                    }
                  ),
                )
              )
            ],
          ),
        ),
      ),   
    );
  }
}

Answer 2

Виджеты, такие как listView, всегда нуждаются в предварительно определенной высоте и ширине. Вы можете обернуть Listview внутри контейнера, а затем, дать контейнеру динамику c height: (элементы в списке) * (высота каждого элемента). Я надеюсь, что этот прием будет работать для вас.

например:

Container(
height:litems.length*20,
child:ListView.builder
  (
    itemCount: litems.length,
    itemBuilder: (BuildContext ctxt, int index) {
     return Container(height:20,
             child:Text(litems[index]));
    }
  )
)

Answer 3

используйте это для обоих ListView:

Container(
        height: MediaQuery.of(context).size.height*0.5,
    child:YOUR_LISTVIEW
)