我有一个 ListView.builder，它的右侧有一个下拉箭头，当点击它时，它会显示另一个 listView.builder 及其项目。第一个列表运行良好，因为它占用了其子项的大小，但在第二个列表中没有发生相同的体验。我已经尝试了所有解决方案，但由于出现错误仍然无法正常工作。
代码
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 30,
),
Text(
"SELECT A PACKAGE",
textAlign: TextAlign.start,
style: TextStyle(
fontSize: 12,
fontFamily: 'Lato',
color: textColor,
fontWeight: FontWeight.w700,
),
),
SizedBox(
height: 14,
),
!isDataLoaded?ShimmerListView():
Expanded(
child: ListView.builder(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemCount: bloc.packages.length,
itemBuilder: (context, index){
return Container(
margin: EdgeInsets.only(bottom: 5),
child: Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.
all(Radius.circular(12)),
side: BorderSide(color:
borderColor, width: 1)
),
child: Container(
padding: EdgeInsets.symmetric(horizontal: 16, vertical: 16),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
bloc.packages[index].title,
textAlign: TextAlign.start,
style: TextStyle(
fontSize: 16,
fontFamily: 'Lato',
color: primaryColor,
fontWeight: FontWeight.w700,
),
),
SizedBox(
height: 14,
),
Text(
bloc.packages[index].desc,
textAlign: TextAlign.start,
style: TextStyle(
fontSize: 14,
fontFamily: 'Lato',
color: textColor,
fontWeight: FontWeight.w500,
),
),
bloc.packages[index].isTapped?
Container(
height: 300,
child: ListView.builder(
physics: NeverScrollableScrollPhysics(),
shrinkWrap: true,
itemCount: bloc.packages[globalIndex].plans.length,
itemBuilder: (context, index){
return Container(
width: 230,
margin: EdgeInsets.only(top: 14),
padding: EdgeInsets.symmetric
(horizontal: 10, vertical: 10),
decoration: BoxDecoration(
color:containerBgColor,
borderRadius: BorderRadius
.all(Radius.circular(12))
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Container(
width:24,
height:24,
decoration: BoxDecoration(
color: Colors.white,
shape: BoxShape.circle,
),
),
SizedBox(
width: 16,
),
Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
bloc.packages[index].desc,
textAlign: TextAlign.start,
style: TextStyle(
fontSize: 14,
fontFamily: 'Lato',
color: textColor,
fontWeight: FontWeight.w500,
),
),
SizedBox(
height: 10,
),
Text(
'NGN ${12000}',
textAlign: TextAlign.start,
style: TextStyle(
fontSize: 16,
fontFamily: 'Lato',
color: normalText,
fontWeight: FontWeight.w700,
),
),
],
),
],
),
);
},
),
)
:Container(),
],
),
Spacer(),
IconButton(icon:
Icon(
!bloc.packages[index].isTapped?
Mdi.chevronDown:
Mdi.chevronUp,
color: textColor,
), onPressed:(){
setState(() {
globalIndex = index;
bloc.packages[index].isTapped
= !bloc.packages[index].isTapped;
});
})
],
),
),
),
);
},
),
),
],
),
错误
RenderBox was not laid out: RenderRepaintBoundary#87e06 relayoutBoundary=up27 NEEDS-PAINT
尝试用扩展包装第二个列表并给出固定高度，但得到相同的错误。
答案 0 :(得分：1)
ListView 需要一个有限的高度，但你内心的 ListView 有一个无限的高度。
一种方法是用 ListView、Container 或任何具有定义高度的小部件包装内部 SizedBox
示例
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('title'),
),
body: ListView.builder(
itemCount: 20,
itemBuilder: (BuildContext context, int index) {
if (index == 10) {
return Container(
height: 200, // finite height
child: ListView.builder(
itemCount: 20,
itemBuilder: (BuildContext context, int index) {
return Container(
height: 30,
color: Color.fromRGBO(10, 255, index * 10, 100),
child: Text(index.toString()),
);
},
),
);
}
return Container(
height: 36,
color: Color.fromRGBO(index * 10, 20, 100, 100),
child: Text(index.toString()),
);
},
),
);
}
如果您想要更简洁的方法，请查看 NestedScrollView 和类似问题的 this answer。
'constraints.hasBoundedWidth': is not true. 错误您需要为 ListView 提供有限的宽度。您的 ListView 排成一行，宽度无限。
要修复它，请按如下方式编辑第 39 行中的行。
Row(
children: [
Expanded( // 1- Wrap the Column with an Expanded
child: Column(
// ...
),
),
// Spacer(), 2- Remove Spacer
IconButton(
// ...
),
],
)