將按鈕移至底部

我試圖將按鈕移動到螢屏底部但徒勞無功。我基本上有 2 個 textEditingController 和一個按鈕，但后者一直堅持使用 textEditingController。請問有什么建議嗎？

return Scaffold(
      
      body: SafeArea(
        child: SingleChildScrollView(
          physics: const ScrollPhysics(),
          child: Column(
            children: [
                
              return Card(
                 elevation: 5,
                 clipBehavior: Clip.antiAlias,
                 margin: const EdgeInsets.all(0),
                 child: Container(
                 padding: const EdgeInsets.all(15),
                 child: Row(
                   children: [
                    Column(
                    
         ),
         Expanded(
          child: Column(
          children: [
            LocationField(
                isDestination: false,
                textEditingController: sourceController),
            LocationField(
                isDestination: true,
                textEditingController: destinationController),
            
          ],
         ),
        ),   
              Align(
                alignment: Alignment.bottomCenter,
                child: Container(
                  margin: const EdgeInsets.all(5),
                  width: double.infinity,
                  child: ElevatedButton(
                    onPressed: () {},
                    child: const Text('Bottom Button '),  // trying to move to the bottom
                  ),
                ),
              )


            ],
        
         

    );
  }

我哪里錯了？

uj5u.com熱心網友回復：

如果您在 Scaffold 中并希望在螢屏上的固定位置有一些 Button，您可以使用 floatingActionButton 屬性。

例子：

Scaffold(
      floatingActionButtonLocation:
          FloatingActionButtonLocation.centerFloat,
      floatingActionButton: Container(
        height: 50,
        margin: const EdgeInsets.all(10),
        child: ElevatedButton(
          onPressed: () {},
          child: const Center(
            child: Text('Hello'),
          ),
        ),
      ),
    );

當然，floatingActionButton 屬性主要用于 FloatingActionButton，但很高興知道您可以在其中放置任何小部件（其他型別的按鈕、行、列等）。要定位此小部件，您可以使用 'floatingActionButtonLocation' Scaffold 屬性。

uj5u.com熱心網友回復：

您可以通過對自己的代碼進行小的更改來實作它。您必須更改代碼樹，如下所示。

Scaffold -> Body -> Column 

1. Column First Child 應該用 Expanded 然后 SinglechildScrollView 然后 Column 和剩余的 Widgets 包裝
2. 第二個小部件應該是您的按鈕。

這將使 Button 移動到螢屏的末尾。我希望這就是你想要做的。但是這種方式使 Button 始終在螢屏上可見，而剩余的小部件將滾動。

uj5u.com熱心網友回復：

試試下面的代碼

Column(
  children: <Widget>[
    Card(
      elevation: 5,
      clipBehavior: Clip.antiAlias,
      margin: const EdgeInsets.all(0),
      child: Container(
        padding: const EdgeInsets.all(15),
        child: Row(
          children: [
            Expanded(
              child: Column(
                children: [
                  Container(
                    width: 100,
                    height: 50,
                    color: Colors.red,
                  ),
                  Container(
                    height: 50,
                    width: 100,
                    color: Colors.black,
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    ),
    Expanded(
      child: Align(
        alignment: Alignment.bottomCenter,
        child: Container(
          margin: const EdgeInsets.all(5),
          width: double.infinity,
          child: ElevatedButton(
            onPressed: () {},
            child: const Text(
                'Bottom Button '), // trying to move to the bottom
          ),
        ),
      ),
    ),
  ],
),

結果->

標籤：扑 镖 颤振布局

上一篇：條件抖動后如何更改容器中的顏色

下一篇：是否可以從顫振應用程式中鎖定整個設備？