我们有一个网格视图,它基本上是3列,每列中有一些额外的元素,但最后的元素似乎被溢出
GridView.count(
crossAxisSpacing: 35,
shrinkWrap: true,
crossAxisCount: 3,
children: List.generate(3, (index) {
return Center(
child: Column(
children: [
const CircleAvatar(
minRadius: 30,
),
const SizedBox(height: 20),
Text(
'Name',
style: Theme.of(context).textTheme.bodyMedium,
),
const SizedBox(height: 10),
Text(
'$index',
style: Theme.of(context).textTheme.headline5,
),
],
),
);
}),
),
3条答案
按热度按时间moiiocjp1#
使用“SingleChildScrollView”对列进行换行
ktecyv1j2#
尝试使用。
brqmpdu13#
解释:
假设
screen width
为300,并且有3列,每列的宽度为80
。此间距将导致
80 + 35 + 80 + 35 + 80 = 310
,这是额外的10px
。溶液:
通过在
grid items
内部提供padding
来替换crossAxisSpacing
设置
crossAxisSpacing = 0
后的输出: