我有三个小部件,我希望顶部的小部件在最上面,底部的小部件在最底部.中间的小部件可以等间距分布,也可以正好位于顶部小部件的下方(最好是后者).
=================
top widget
<some space>
middle widget
<some (or more) space>
bottom widget
=================
我想我可以使用LayoutWidget来计算我需要多少空间,使用MainAxisAlignment.启动并在中间和底部的小部件之间插入一个间隔小部件,但我希望有一种更自然的方法来做到这一点.
我试着把它们和mainAxisAlignment: MainAxisAlignment.spaceEvenly
个放在一起,
body: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
BoardWidget(board: widget.board),
TipWidget(board: widget.board),
OnScreenKeyboard(onKeyPressed: _onKeyPress),
],
),
但这增加了顶部和底部以及小部件之间的空间.
在flutter - how to align at the top and at the bottom (this is the issue) - and column middle part的基础上,我试着添加一个扩展,像这样:
body: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
BoardWidget(board: widget.board),
TipWidget(board: widget.board),
Expanded(
child: Align(
alignment: Alignment.bottomCenter,
child: OnScreenKeyboard(onKeyPressed: _onKeyPress)),
),
],
),
但这似乎没有任何影响(我不确定我是否完全理解了这个简洁的答案,tbh).
Update: 多亏了下面的回答,我在这里结束了.可能仍然会按照建议进行调整,但它得到的正是我想要做的:
body: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
BoardWidget(board: widget.board),
TipWidget(board: widget.board),
const Spacer(),
OnScreenKeyboard(onKeyPressed: _onKeyPress),
],
),