我试图实现一种现在非常常见的行为,即在另一个可滚动的小部件中具有水平列表。想象一下 IMDb 应用程序主屏幕的样子:
因此,我想要一个垂直滚动的小部件,上面有几个项目。在顶部,应该有一个水平的 ListView
,随后是一些称为 motivationCard
的项目。列表和卡之间还有一些标题。
我在我的 Widget
上得到了以下内容:
@override
Widget build(BuildContext context) => BlocBuilder<HomeEvent, HomeState>(
bloc: _homeBloc,
builder: (BuildContext context, HomeState state) => Scaffold(
appBar: AppBar(),
body: Column(
children: <Widget>[
Text(
Strings.dailyTasks,
),
ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: tasks.length,
itemBuilder: (BuildContext context, int index) =>
taskCard(
taskNumber: index + 1,
taskTotal: tasks.length,
task: tasks[index],
),
),
Text(
Strings.motivations,
),
motivationCard(
motivation: Motivation(
title: 'Motivation 1',
description:
'this is a description of the motivation'),
),
motivationCard(
motivation: Motivation(
title: 'Motivation 2',
description:
'this is a description of the motivation'),
),
motivationCard(
motivation: Motivation(
title: 'Motivation 3',
description:
'this is a description of the motivation'),
),
],
),
),
);
我收到的错误信息如下:
I/flutter (23780): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter (23780): The following assertion was thrown during performResize():
I/flutter (23780): Horizontal viewport was given unbounded height.
I/flutter (23780): Viewports expand in the cross axis to fill their container and constrain their children to match
I/flutter (23780): their extent in the cross axis. In this case, a horizontal viewport was given an unlimited amount of
I/flutter (23780): vertical space in which to expand.
我尝试过:
使用
Expanded
将 ListView 包裹起来使用
SingleChildScrollView > ConstrainedBox > IntrinsicHeight
将 Column 包裹起来将 CustomScrollView 作为父级,使用 SliverList 并在 SliverChildListDelegate 中放置列表
这些方法都无法解决问题,我一直收到相同类型的错误。这应该是很常见的事情,不应该有任何难度,但是我就是无法让它正常工作 :(
如果有任何帮助,将不胜感激,谢谢!
编辑:
我认为这个链接可以帮助我,但实际上没有。