如何将小部件放置在表单小部件的底部？

Question

我有小部件：

Scaffold(
  appBar: ...,
  body: Form(
    child: ListView(
      children: [
        ...
        ElevatedButton() // Save button
      ]
    )
  )
);

所以，我想把它放在屏幕的底部。 我试图将它放在Align小部件中，但它不起作用。 另一件事是我上面有ExpansionTile ，它可以溢出屏幕。 在这种情况下， Activate和Save按钮之间不能有任何额外的空间。 怎么做？

Answer 1

使用 MainAxisAlignment.spaceBetween。 文档：

将空闲空间均匀地放在孩子之间。

bool _hasExpansionTile = false;

Scaffold(
  appBar: ...,
  body: Column(mainAxisAlignment: _hasExpansionTile ? MainAxisAlignment.start : MainAxisAlignment.spaceBetween, /// Checking that the expansion tile is visible
        children: [
          Flexible(
             child: Form(
                child: Column(
                    children: [
                       ...
                    ],
                ),
             ),
          ),
          ElevatedButton(onPressed: (){}, child: Text("Send")),
        ],
      ),
);

当然，当您更改_hasExpansionTile属性的值时，您必须使用 setState()。

Answer 2

您可以使用 Spacer()

Scaffold( appBar: ...,
body: Form(
child: ListView(
  children: [
    ...
    Spacer(),
    ElevatedButton() // Save button
  ]
)

));