如何使Widget不会溢出Flutter Web上的ListView

Question

上下文：我正试图用Flutter制作一个网络应用程序，所以这一切都在Chrome 中

问题：我有一个图表，来自charts_flutter库，当它在列中时，它会显示为OK。问题是，我希望能够滚动并在图表下方添加更多内容。当我尝试将列更改为ListView时，它会溢出(似乎图表试图尽可能大，而ListView有无限高(。我不知道如何绕过这个问题。

当前代码：只是脚手架，因为这就是我认为在这里很重要的东西

Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method, and use it to set our appbar title.
title: Text(widget.title),
),
body: ListView(
children: <Widget>[
Row(
children: <Widget>[
FlatButton(onPressed: (){
print("flat button pressed");
}, child: Text("Flat Button 1")),
FlatButton(onPressed: (){
print("flat button pressed");
}, child: Text("Flat Button 2")),
FlatButton(onPressed: (){
print("flat button pressed");
}, child: Text("Flat Button 3")),
],
mainAxisAlignment: MainAxisAlignment.center,
),
Flexible(child: GroupedStackedBarChart.withRandomData()),
],
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);

Answer 1

buddy只是用Expanded包装您的Listview，并用Column扩展您的小部件，如下所示：

body: Column(
children: <Widget>[
Expanded( 
child: ListView(
children: <Widget>[
],
),
),

Answer 2

我认为Flexible会导致图表填充父对象的高度，这是无限的。尝试将其包装在Column中，以给出预先计算的大小。

body: ListView(
children: <Widget>[
Row(
children: <Widget>[
FlatButton(onPressed: (){
print("flat button pressed");
}, child: Text("Flat Button 1")),
FlatButton(onPressed: (){
print("flat button pressed");
}, child: Text("Flat Button 2")),
FlatButton(onPressed: (){
print("flat button pressed");
}, child: Text("Flat Button 3")),
],
mainAxisAlignment: MainAxisAlignment.center,
),
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [GroupedStackedBarChart.withRandomData()],
),
],
),