Flutter聊天应用：bottomNavigationBar中Button无法固定底部问题

你的问题核心是Row组件默认的垂直对齐方式导致按钮和输入框居中对齐，只需调整对齐属性即可解决，以下是修改方案：

修改后的代码 #

Padding(
  padding: EdgeInsets.only(bottom: MediaQuery.of(context).viewInsets.bottom + 3),
  child: Row(
    // 关键：设置垂直对齐为底部
    crossAxisAlignment: CrossAxisAlignment.end,
    children: [
      Expanded(
        child: Padding(
          padding: EdgeInsets.fromLTRB(5, 0, 5, 5),
          child: TextField(
            keyboardType: TextInputType.multiline,
            minLines: 1,
            maxLines: 5,
            style: TextStyle(fontSize: 20),
            decoration: InputDecoration(
              border: OutlineInputBorder(),
              contentPadding: EdgeInsets.fromLTRB(10, 10, 10, 10),
            ),
          ),
        ),
      ),
      Padding(
        padding: EdgeInsets.fromLTRB(0, 0, 5, 5),
        child: Container(
          width: MediaQuery.of(context).size.width * 0.2,
          child: ElevatedButton(
            onPressed: () {},
            child: Text("发送"),
          ),
        ),
      ),
    ],
  ),
),

关键改动说明 #

• 给Row添加crossAxisAlignment: CrossAxisAlignment.end，强制子组件垂直方向对齐底部
• 移除了不必要的SizedBox和Stack（这两个组件对当前布局无实际作用）
• 调整输入框的contentPadding，让多行输入时上下内边距更均匀
• 微调按钮的左右内边距，优化整体布局的紧凑感

修改后，输入框多行展开时，按钮会始终固定在输入栏的底部，符合预期效果。

内容的提问来源于stack exchange，提问作者k1k4ss0