flutter - listview.builder 底部溢出和灵活和扩展小部件的错误
问题描述
我正在尝试构建一个 ListView 但我无法做到我的列表在不溢出的情况下到达底部,我发现工作的方式是设置容器的高度,但是,当我使用我的个人设备时,我得到了一个我的列表下方的大空白区域。
我已经在列表之前尝试了灵活和扩展的小部件,但都没有成功,我总是遇到同样的错误:
RenderFlex children have non-zero flex but incoming height constraints are unbounded
Vertical viewport was given unbounded height error
您对此有什么解决方案吗?
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
elevation: 0,
backgroundColor: Colors.blueAccent,
title: Padding(
padding: EdgeInsets.only(left: 5.0),
child: Text(
user.name,
style: TextStyle(fontSize: 30.0),
),
),
actions: <Widget>[
IconButton(
alignment: Alignment.center,
icon: Icon(Icons.forward),
onPressed: () {},
),
],
),
body: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Container(
color: Colors.blueAccent,
child: Padding(
padding: EdgeInsets.only(top: 30.0, left: 20.0, right: 20.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("Conta",
style: TextStyle(fontSize: 17.0, color: Colors.white)),
Divider(color: Colors.blueAccent),
Text("${user.bankAccount} / ${user.agency}",
style: TextStyle(fontSize: 30.0, color: Colors.white)),
Padding(
padding: EdgeInsets.only(top: 30.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("Saldo",
style:
TextStyle(fontSize: 17.0, color: Colors.white)),
Divider(color: Colors.blueAccent),
Text("${user.balance}",
style:
TextStyle(fontSize: 30.0, color: Colors.white)),
Divider(color: Colors.blueAccent),
],
),
),
],
),
),
),
Divider(color: Colors.white),
Padding(
padding: EdgeInsets.only(left: 20.0, right: 20.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("Recentes",
style: TextStyle(fontSize: 20.0, color: Colors.black)),
FutureBuilder(
future: getuserStatement(user.userId),
builder: getstatements,
),
],
),
),
],
),
);
}
Future getuserStatement(int id) {
return api.getUserExtract(id);
}
Widget getstatements(BuildContext context, AsyncSnapshot snapshot) {
return !snapshot.hasData
? Center(child: CircularProgressIndicator())
: Container(
height: 340,
child: ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (context, index) {
print(snapshot.data[index].title);
return Card(
elevation: 5,
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.only(top: 10.0, left: 10.0),
child: Row(
children: <Widget>[
Text(snapshot.data[index].title),
Expanded(
child: Align(
alignment: Alignment(0.90, 0.00),
child: Text(snapshot.data[index].date),
),
),
],
),
),
Padding(
padding:
EdgeInsets.only(top: 20.0, bottom: 10.0, left: 10.0),
child: Row(
children: <Widget>[
Text(snapshot.data[index].desc),
Expanded(
child: Align(
alignment: Alignment(0.90, 0.00),
child:
Text(snapshot.data[index].value.toString()),
),
),
],
),
)
],
),
);
},
),
);
}
}
解决方案
解决方案:
在花了这么多时间之后,我找到了解决方案:
我看到在我的这部分代码中,我在填充中放置了另一列:
Padding(
padding: EdgeInsets.only(left: 20.0, right: 20.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("Recentes",
style: TextStyle(fontSize: 20.0, color: Colors.black)),
Expanded(
child: FutureBuilder(
future: getuserStatement(user.userId),
builder: getstatements,
),
),
],
),
),
所以我所做的是,只是删除了 Column 并留下了 Text 小部件并将扩展的小部件放在填充下方。
Padding(
padding: EdgeInsets.only(left: 20.0, right: 20.0),
child: Text("Recentes",
style: TextStyle(fontSize: 20.0, color: Colors.black)),
),
Expanded(
child: FutureBuilder(
future: getuserStatement(user.userId),
builder: getstatements,
),
),
它使用设备的最大空间创建了我的列表,因此我不需要使用 Container 或 sizedBox 设置高度。
在我的愿景中,我认为这是因为我将一个列表放在一个已经在一个列内的列中,所以这个列表不知道她有多少空间
推荐阅读
- oauth - 具有 OAuth 身份验证和模拟的 Office 365 EWS 应用程序 - 错误 401
- python - 总是执行 else 语句
- javascript - 如何防止可拖动的 div 离开其父标签
- python - 从 pandas 绘图使日期粘在一起
- c# - Audit.NET - 实体框架 - 如何实现 OptOut
- css - 如何在自定义形状周围添加类似路径的边框
- ios - 无法在 iOS 模拟器上使用 fetch(尝试访问 https://{domainName}.amazonaws.com:8080/{uri} )(React Native)
- r - ggplot:如何打破绘图线的顺序和图例中的顺序之间的联系?
- dart - 使用默认泛型类型设置 typedef
- xpath - 如何获取此菜单项的 Xpath?