如何在不显示键盘的情况下聚焦 TextField?

Dav*_*ego 7 dart flutter

我需要关注文本字段但不显示键盘。当用户点击文本字段时才需要显示键盘。

我尝试了2种方法。

第一次尝试:

这样,键盘就会显示出来,而在屏幕构建后就会隐藏起来,这不太好看。

建造者:

TextFormField(
    controller: barcodeStringController,
    focusNode: myFocusNode,
    autofocus: true,
    textAlign: TextAlign.right,
    textInputAction: TextInputAction.done,
    textCapitalization: TextCapitalization.characters,
    style: TextStyle(fontSize: 20),
    maxLines: null,
    onTap: () {
      SystemChannels.textInput.invokeMethod('TextInput.show');
    },
    //... Other event listeners to handle submit
),
Run Code Online (Sandbox Code Playgroud)

并在 build() 之外:

void _onAfterBuild(BuildContext context) {
  SystemChannels.textInput.invokeMethod('TextInput.hide');
}
Run Code Online (Sandbox Code Playgroud)

第二次尝试:

这样键盘就隐藏在较低的位置,并且更容易看到。问题是 onTap 从未被调用,因此键盘永远不会显示,onTap 也不会显示。

建造者:

GestureDetector(
    onTap: () {
        SystemChannels.textInput.invokeMethod('TextInput.show');
    },
    child: TapOnlyFocusTextField(
        controller: barcodeStringController,
        focusNode: myFocusNode, //this is a TapOnlyFocusTextFieldFocusNode
        textAlign: TextAlign.right,
        textInputAction: TextInputAction.done,
        textCapitalization: TextCapitalization.characters,
        style: TextStyle(fontSize: 20),
        cursorColor: Colors.black,
        //... Other event listeners to handle submit
    ),
),
Run Code Online (Sandbox Code Playgroud)

TapOnlyFocusTextField 类:

class TapOnlyFocusTextField extends EditableText {
  TapOnlyFocusTextField({
    @required TextEditingController controller,
    @required TextStyle style,
    @required Color cursorColor,
    bool autofocus = false,
    Color selectionColor,
    FocusNode focusNode,
    TextAlign textAlign,
    TextInputAction textInputAction,
    TextCapitalization textCapitalization,
    onSubmitted,
    onChanged,
  }) : super(
          controller: controller,
          focusNode: focusNode,
          style: style,
          cursorColor: cursorColor,
          autofocus: autofocus,
          selectionColor: selectionColor,
          textAlign: textAlign,
          textInputAction: textInputAction,
          textCapitalization: textCapitalization,
          maxLines: null,
          onSubmitted: onSubmitted,
          backgroundCursorColor: Colors.black,
          onChanged: onChanged,
        );

  @override
  EditableTextState createState() {
    return TapOnlyFocusTextFieldState();
  }
}

class TapOnlyFocusTextFieldState extends EditableTextState {
  @override
  void requestKeyboard() {
    super.requestKeyboard();
    //hide keyboard
    SystemChannels.textInput.invokeMethod('TextInput.hide');
  }
}
Run Code Online (Sandbox Code Playgroud)

TapOnlyFocusTextFieldFocusNode 类:

class TapOnlyFocusTextFieldFocusNode extends FocusNode {
  @override
  bool consumeKeyboardToken() {
    // prevents keyboard from showing on first focus
    return false;
  }
}
Run Code Online (Sandbox Code Playgroud)

我知道 Flutter Github 中已经有一个关于此的未决问题,但我需要找到解决方案: https://github.com/flutter/flutter/issues/16863

小智 0

text_input.dart 有一个方法

    void show({bool ifShowKeyBoard = true}) {
      assert(attached);
      if (ifShowKeyBoard) {
        TextInput._instance._show();
      }
    }
Run Code Online (Sandbox Code Playgroud)

我改变了这个方法,它有效