问题描述
我将 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,],);
}
}
解决方法
发生这种情况是因为容器的性质。容器自然会尽可能多地尝试。要强制它达到您想要的大小,您需要添加一个中间小部件来解决您的容器无法填充的空间。
您可以使用的几个小部件是 Center
、Align
、Stack
与 Positioned
小部件一起使用。您甚至可以使用第二个 Container
,但如果您必须使用 alignment
属性来避免相同的结果。