ListView.builder与SingleChildScrollView底部的Widget
ListView.builder与SingleChildScrollView底部的Widget
提问于 2022-08-18 16:07:30
我需要一个底部有消息的SingleChildScrollView。
我在SingleChildScrollView here中找到了一个底部对齐的解决方案。
class Home extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('AppBar'),
),
body: LayoutBuilder(builder: (context, constraints) {
return SingleChildScrollView(
child: ConstrainedBox(
constraints: BoxConstraints(minWidth: constraints.maxWidth, minHeight: constraints.maxHeight),
child: IntrinsicHeight(
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Text('header'),
Expanded(
child: Container(
color: Colors.green,
child: Text('body'),
),
),
Text('footer'),
// MY CODE STARTS
ListView.builder(
itemCount: 2,
itemBuilder: (context, index) {
return Text("a " + index.toString());
}
)
// MY CODE ENDS
]
),
)
)
);
})
);
}
}但是，当我尝试将ListView.builder添加到此解决方案时，我得到：
The following assertion was thrown during performLayout():
RenderViewport does not support returning intrinsic dimensions.
Calculating the intrinsic dimensions would require instantiating every child of the viewport, which defeats the point of viewports being lazy.
If you are merely trying to shrink-wrap the viewport in the main axis direction, consider a RenderShrinkWrappingViewport render object (ShrinkWrappingViewport widget), which achieves that effect without implementing the intrinsic dimension API.有人能说出怎么修吗？
回答 2
Stack Overflow用户
发布于 2022-08-19 06:27:18
使用Expanded在SingleChildScrollView中将获得无限高，最好在内部小部件上使用顶级LayoutBuilder约束。LisView也渴望无限的高度。
至于您想要获得的UI，可以这样做，您可能不需要两个可滚动的小部件。
body: LayoutBuilder(
builder: (context, constraints) {
return Column(
children: [
Text('header'),
Expanded(
child: ListView.builder(
itemBuilder: (context, index) =>
Text("a " + index.toString())
// MY CODE ENDS
),
),
Text('footer'),
],
);
},
),同时，使用customScrollView还提供了更多的灵活性，
return Scaffold(
bottomNavigationBar: TextFormField(),
body: LayoutBuilder(
builder: (context, constraints) {
return CustomScrollView(
slivers: [
SliverAppBar(
pinned: true,
title: Text("title"),
),
SliverToBoxAdapter(
child: Text('top item'),
),
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) {
return Text("a " + index.toString());
},
),
),
SliverToBoxAdapter(
child: Text('End item'),
)
],
);
},
),
);事实上，它可以做很多方法。
不是推荐的方式，
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('AppBar'),
),
body: LayoutBuilder(
builder: (context, constraints) {
return SingleChildScrollView(
child: ConstrainedBox(
constraints: BoxConstraints(
minWidth: constraints.maxWidth,
minHeight: constraints.maxHeight),
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Text('header'),
Container(
color: Colors.green,
child: Text('body'),
),
Text('footer'),
// MY CODE STARTS
ListView.builder(
shrinkWrap: true, //not recommended
itemCount: 211,
itemBuilder: (context, index) {
return Text("a " + index.toString());
})
// MY CODE ENDS
],
),
),
);
},
),
);
}Stack Overflow用户
发布于 2022-08-18 16:33:16
在这里：
class Home extends StatelessWidget {
List<String> listData = [
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item",
"Item"
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('AppBar'),
),
body: ListView.builder(
itemCount: listData.length + 2,
itemExtent: 100,
itemBuilder: (context, index) {
if (index == 0) {
return Container(
child: Text('Header'),
);
}
if (index == listData.length + 1) {
return Container(
child: Text('Footer'),
);
}
return Container(
child: Text('Item at $index'),
);
},
));
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73406296
复制相关文章
相似问题
腾讯云开发者
