flutter - 在 SingleChildScrollView 中实现嵌套的 ListView
问题描述
在这个示例代码中,我想嵌套ListView
在里面SingleChildScrollView
,但是我得到了这个错误:
RenderBox was not laid out: RenderRepaintBoundary#8de00 relayoutBoundary=up1 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'
我的代码:
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'test',
home: Scaffold(
appBar: AppBar(
title: Text("Scrollview Demo"),
),
body: SingleChildScrollView(
child: Column(
children: <Widget>[
Container(
height: 50.0,
color: Colors.green,
child: Center(
child: Text('message'),
),
),
Expanded(
child: ListView.builder(
itemCount: 30,
itemBuilder: (context, index) {
return ListTile(title: Text("Index : $index"));
},
),
),
],
),
),
),
);
}
}
解决方案
在 ListView 中,您可以设置
收缩包装:真
这样 ListView 只占用它需要的空间。
要禁用 ListView 上的滚动,以便它使用 SingleChildScrollView 的滚动,您可以设置
物理:NeverScrollableScrollPhysics()。
如果这里是无限的,您需要删除将孩子设置为可用屏幕的 Expanded。
这里:
SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
height: 50.0,
color: Colors.green,
child: Center(
child: Text('message'),
),
),
Flexible(
child: ListView.builder(
itemCount: 30,
shrinkWrap: true,
itemBuilder: (context, index) {
return ListTile(title: Text("Index : $index"));
},
),
),
],
),
)
推荐阅读
- c - BUG:无法在 ffffffffffffffff 处理内核分页请求
- shell - USB 2.0 和 USB 3.0:如何确定 USB 端口的版本并将其与 USB 驱动器匹配
- java - javax.imageio.IIOException:无法在 Tomcat 9、OpenJDK 11 和 Geoserver 中创建 ImageInputStream
- javascript - @JavaScript 不是注解类型
- javascript - 如何将 jQuery 模态更改为 React 模态?
- c# - 无法将“System.Collections.Generic.List”类型的对象转换为“System.Linq.IGrouping”类型
- postgresql - 如何使用 = 运算符查询 Postgres JSONB 数组
- jira - 使用rest API在JIRA上添加Release
- java - Spring Transaction 回滚 `UPDATE` 和 `INSERT`
- linux - 授予非 root 用户 kubernetes 中 kubectl 的访问权限