我需要在另一个ListView中创建一个动态的ListView高度。我来的所有答案都没有真正回答它。我已经做了一个简单的示例来说明我要做什么,因此您只需复制并粘贴即可尝试并使用它。我在子ListView上遇到问题,我需要根据其中的项目数使它增大或缩小(程序中注释的问题)
class Test extends StatefulWidget {
@override
_TestState createState() => _TestState();
}
List<List<bool>> subList = [
[true, true],
[true]
];
class _TestState extends State<Test> {
@override
Widget build(BuildContext context) {
return ListView.separated(
itemBuilder: (BuildContext context, int index) {
return Column(
children: <Widget>[
ListTile(
trailing: IconButton(
icon: Icon(Icons.add),
onPressed: () {
setState(() {
subList[index].add(true);
});
},
),
title: Text(
'item $index',
style: TextStyle(fontWeight: FontWeight.w600),
),
),
Container(
height: 100, // <--- this needs to be dynamic
child: ListView.builder(
physics: NeverScrollableScrollPhysics(),
itemBuilder: (BuildContext context, int subIndex) {
return TestRow(
text: 'sub$subIndex',
onRemove: () {
setState(() {
subList[index].removeAt(subIndex);
});
});
},
itemCount: subList[index].length,
),
)
],
);
},
separatorBuilder: (BuildContext context, int index) => Divider(),
itemCount: subList.length);
}
}
class TestRow extends StatelessWidget {
final String text;
final Function onRemove;
const TestRow({this.onRemove, this.text});
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.symmetric(horizontal: 20),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(text),
IconButton(
icon: Icon(Icons.remove),
onPressed: onRemove,
)
],
),
);
}
}
顺便说一句,我设法通过将容器(注释部分)的高度更改height: 50.0 * subList[index].length
为副标题的高度50来解决该问题。我仍在寻找一种正确的方法来执行此操作,而无需硬编码图块的高度并进行计算
这是该项目的视频,以及解决方法
尝试将收缩包装属性设置为true并删除容器
ListView.builder(
shrinkWrap: true, //<-- Here
physics: NeverScrollableScrollPhysics(),
itemBuilder: (BuildContext context, int subIndex) {
return TestRow(
text: 'sub$subIndex',
onRemove: () {
setState(() {
subList[index].removeAt(subIndex);
});
});
},
itemCount: subList[index].length,
)
输出:
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句