如何通过系统键盘按钮发送TextFormField中的聊天消息？

要实现点击系统键盘上的发送按钮提交TextFormField的输入内容，只需以下几步：

• 初始化TextEditingController，用于控制输入框内容和获取输入文本：

  final TextEditingController _messageController = TextEditingController();
  

• 配置TextFormField的textInputAction属性为TextInputAction.send，这会让系统键盘的确认按钮变为发送样式（对应你图中的绿色按钮）。

• 在onFieldSubmitted回调中处理发送逻辑：获取输入内容、校验非空、执行发送操作，最后清空输入框。

完整示例代码：

import 'package:flutter/material.dart';

class ChatInput extends StatefulWidget {
  const ChatInput({super.key});

  @override
  State<ChatInput> createState() => _ChatInputState();
}

class _ChatInputState extends State<ChatInput> {
  final TextEditingController _messageController = TextEditingController();

  void _sendMessage(String message) {
    if (message.trim().isEmpty) return;
    // 这里替换为你的实际发送逻辑，比如调用API或添加到消息列表
    debugPrint("发送消息: $message");
    _messageController.clear();
  }

  @override
  void dispose() {
    _messageController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: TextFormField(
        controller: _messageController,
        textInputAction: TextInputAction.send,
        decoration: const InputDecoration(
          hintText: "输入消息...",
          border: OutlineInputBorder(
            borderRadius: BorderRadius.all(Radius.circular(20)),
          ),
          contentPadding: EdgeInsets.symmetric(horizontal: 16, vertical: 12),
        ),
        onFieldSubmitted: _sendMessage,
      ),
    );
  }
}

另外，如果你需要在用户输入时实时响应，也可以结合onChanged回调，但核心的发送触发还是靠onFieldSubmitted配合TextInputAction.send。

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