无TextField时如何在Flutter中显示和隐藏iOS键盘？

我用KeyboardListener配合FocusNode实现点击屏幕聚焦/失焦，尝试通过SystemChannels.textInput.invokeMethod("TextInput.show")和TextInput.hide来唤起/隐藏键盘，但在iOS模拟器和真机上都没效果。点击屏幕能打印出unfocus和focus requested，而且用笔记本键盘输入时，按键事件能被正常捕获，但系统软键盘就是弹不出来。

代码实现 #

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

  @override
  State<MyClass> createState() => _MyClassState();
}

class _MyClassState extends State<MyClass> {
late FocusNode _focusNode;

KeyEventResult keyEventHandler(KeyEvent event) {
  if (kDebugMode) {
    print("handle key: ${event.logicalKey}");
  }
  return KeyEventResult.handled;
}

@override
void initState() {
  _focusNode = new FocusNode(
    debugLabel: "wordlet",
  );
  super.initState();
}

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

@override
Widget build(BuildContext context) {
  return KeyboardListener(
    focusNode: _focusNode,
    onKeyEvent: keyEventHandler,
    autofocus: true,
    child: GestureDetector(
      onTap: () {
        if (_focusNode.hasFocus) {
          _focusNode.unfocus();
          SystemChannels.textInput.invokeMethod("TextInput.hide");
          if (kDebugMode) {
            print("unfocus");
          }
        } else {
          _focusNode.requestFocus();
          SystemChannels.textInput.invokeMethod("TextInput.show");
          if (kDebugMode) {
            print("focus requested");
          }
        }
      }, // onTap
    ), // GestureDetector
  ), // KeyboardListener
} // build
} // _MyClassState

Flutter Doctor 输出 #

[✓] Flutter (Channel stable, 3.24.5, on macOS 14.5 23F79 darwin-arm64, locale en-US)
[✓] Android toolchain - develop for Android devices (Android SDK version 35.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 16.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2024.2)
[✓] VS Code (version 1.95.3)
[✓] Connected device (6 available)
[✓] Network resources

• No issues found!

测试环境与日志 #

• 测试环境：iOS Simulator iPhone 15，iOS 17.5
• 点击屏幕时的日志：

flutter: unfocus
flutter: focus requested

• 用笔记本键盘输入时的日志：

flutter: handle key: LogicalKeyboardKey#12bb1(keyId: "0x00000061", keyLabel: "A", debugName: "Key A")
flutter: handle key: LogicalKeyboardKey#1e0f5(keyId: "0x00000065", keyLabel: "E", debugName: "Key E")
flutter: handle key: LogicalKeyboardKey#34b7d(keyId: "0x0000006d", keyLabel: "M", debugName: "Key M")
flutter: handle key: LogicalKeyboardKey#12bb1(keyId: "0x00000061", keyLabel: "A", debugName: "Key A")

解决方案 #

问题出在SystemChannels.textInput的调用逻辑上——iOS要求必须先注册一个文本输入客户端，才能唤起软键盘。直接调用TextInput.show不会生效，因为系统没有对应的输入上下文。以下是两种可行解决方式：

方式一：使用透明TextField（推荐）

通过一个完全透明的TextField来触发键盘逻辑，同时保留KeyboardListener的按键监听能力，这是最简单可靠的方案：

class _MyClassState extends State<MyClass> {
  late FocusNode _focusNode;
  late TextEditingController _textController;

  KeyEventResult keyEventHandler(KeyEvent event) {
    if (kDebugMode) {
      print("handle key: ${event.logicalKey}");
    }
    return KeyEventResult.handled;
  }

  @override
  void initState() {
    _focusNode = FocusNode(debugLabel: "wordlet");
    _textController = TextEditingController();
    super.initState();
  }

  @override
  void dispose() {
    _focusNode.dispose();
    _textController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        KeyboardListener(
          focusNode: _focusNode,
          onKeyEvent: keyEventHandler,
          child: GestureDetector(
            onTap: () {
              if (_focusNode.hasFocus) {
                _focusNode.unfocus();
                if (kDebugMode) {
                  print("unfocus");
                }
              } else {
                _focusNode.requestFocus();
                if (kDebugMode) {
                  print("focus requested");
                }
              }
            },
            child: Container(color: Colors.white), // 替换为你的实际UI组件
          ),
        ),
        // 透明TextField用于触发系统键盘
        Opacity(
          opacity: 0.0,
          child: TextField(
            focusNode: _focusNode,
            controller: _textController,
            decoration: const InputDecoration(border: InputBorder.none),
          ),
        ),
      ],
    );
  }
}

方式二：手动注册文本输入客户端

如果不想依赖TextField，可以手动通过TextInput.attach注册输入会话，模拟TextField内部的键盘触发逻辑：

import 'package:flutter/services.dart';

class _MyClassState extends State<MyClass> {
  late FocusNode _focusNode;
  TextInputConnection? _textInputConnection;

  KeyEventResult keyEventHandler(KeyEvent event) {
    if (kDebugMode) {
      print("handle key: ${event.logicalKey}");
    }
    return KeyEventResult.handled;
  }

  void _openKeyboard() {
    _textInputConnection = TextInput.attach(
      _focusNode,
      const TextInputConfiguration(
        inputType: TextInputType.text,
        autocorrect: false,
      ),
    );
    _textInputConnection?.show();
  }

  void _closeKeyboard() {
    _textInputConnection?.close();
    _textInputConnection = null;
  }

  @override
  void initState() {
    _focusNode = FocusNode(debugLabel: "wordlet");
    super.initState();
  }

  @override
  void dispose() {
    _textInputConnection?.close();
    _focusNode.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return KeyboardListener(
      focusNode: _focusNode,
      onKeyEvent: keyEventHandler,
      child: GestureDetector(
        onTap: () {
          if (_focusNode.hasFocus) {
            _focusNode.unfocus();
            _closeKeyboard();
            if (kDebugMode) {
              print("unfocus");
            }
          } else {
            _focusNode.requestFocus();
            _openKeyboard();
            if (kDebugMode) {
              print("focus requested");
            }
          }
        },
        child: Container(color: Colors.white), // 替换为你的实际UI组件
      ),
    );
  }
}

说明 #

• iOS的软键盘唤起机制依赖有效的文本输入会话，TextField内部已经封装了完整的会话注册逻辑，因此用透明TextField是最省心的方案。
• 手动注册TextInputConnection需要自行管理会话的生命周期，避免内存泄漏，适合需要底层控制的场景。

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