即使我输入较小的值,容器的高度也在 Flutter 中拉伸?

问题描述

我将 Container 的高度设置为 40,但它获得了父 Container 的高度。我认为 ListView.builder 正在拉伸其子项,因为如果我将其替换为该容器的一行(查看代码),它会按预期工作。

import 'package:Flutter/material.dart';

class PaymentScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(body: SafeArea(child: Column(children: [
            Container(alignment: Alignment.center,height: 200,child: ListView.builder(scrollDirection: Axis.horizontal,shrinkWrap: true,itemBuilder: (BuildContext context,int index) =>
                /// this Container is stretching,even it has definite height
                Container(alignment: Alignment.center,margin: EdgeInsets.all(8),padding: EdgeInsets.all(8),color: Colors.Amber,/// this width is not listening to me!
                  width: 40,height: 40,child: Text('${index + 1}'),),itemCount: 31,],);
  }
}

enter image description here

解决方法

发生这种情况是因为容器的性质。容器自然会尽可能多地尝试。要强制它达到您想要的大小,您需要添加一个中间小部件来解决您的容器无法填充的空间。

您可以使用的几个小部件是 CenterAlignStackPositioned 小部件一起使用。您甚至可以使用第二个 Container,但如果您必须使用 alignment 属性来避免相同的结果。