如何在Flutter中的键盘上更改文本输入操作按钮(返回/输入键)？

Question

在Android和iOS中,可以将键盘的输入/返回键更改为" Go "按钮(以及其他选项).

在顶部,我们可以看到常规的" 回报在两个系统"按钮,这是你在默认情况下,在这两个Android和iOS的原生和扑不作任何修改的一个.

在此之下,在两个系统上还有另一个设置,您可以在原生应用程序中进行简单调整.这是" 围棋在这种情况下"按钮.

Answer 1

这是您可以使用的方法textInputAction：

TextField(
  textInputAction: TextInputAction.search,
  onSubmitted: (value) {
    print("search");
  },
  decoration: InputDecoration(
    border: InputBorder.none,
    prefixIcon: Icon(Icons.search),
    hintText: 'Search ',
    contentPadding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
  ),
);

Answer 2

可以像这样指定a 的输入操作TextField(这里是Go按钮):

TextField(
  textInputAction: TextInputAction.go
  ...
)

所有可用输入操作的列表.

Answer 3

这是添加操作按钮并监听 onTap 的方法

对于文本字段

TextField(
  textInputAction: TextInputAction.go,
  onSubmitted: (value) {
    print("Go button is clicked");
  },
  decoration: InputDecoration(
    border: InputBorder.none,
    contentPadding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
  ),
);

对于文本表单字段

TextFormField(
      textInputAction: TextInputAction.go,
      onFieldSubmitted: (value) {
      print("Go button is clicked");
      },
      decoration: const InputDecoration(
          hintText: "Type your search here",
          hintStyle: TextStyle(color: Colors.black26),
          filled: true,
          fillColor: Colors.white,
          border: OutlineInputBorder(
            borderSide: BorderSide.none,
            borderRadius: BorderRadius.all(Radius.circular(40.0)),
          ),
          contentPadding:
              EdgeInsets.symmetric(horizontal: 20.0, vertical: 16.0)),
    )

Answer 4

目前这是不可能的.虽然您可以编辑颤振源,但很容易实现.

以下编辑是:

扑/ lib目录/ src目录/小工具/ editable_text.dart

换_openInputConnection行~430到

void _openInputConnection() {
  if (!_hasInputConnection) {
    final TextEditingValue localValue = _value;
    _lastKnownRemoteTextEditingValue = localValue;
    _textInputConnection = TextInput.attach(this,
        new TextInputConfiguration(
            inputType: widget.keyboardType,
            obscureText: widget.obscureText,
            autocorrect: widget.autocorrect,
            inputAction: widget.keyboardType == TextInputType.multiline
                ? TextInputAction.newline
                : TextInputAction.done
        )
    )..setEditingState(localValue);
  }
  _textInputConnection.show();
}

在同一个文件中,还在EditableText类(而不是状态一)〜第280行声明一个新字段

final TextInputAction textInputAction;

并在EditableText第164行的构造函数中指定它

this.textInputAction,

扑/ LIB/SRC /材料/ text_field.dart

相同的故事.添加一个新字段,但TextField改为:

final TextInputAction textInputAction;

并将以下内容添加到它的构造函数中:

this.textInputAction,

最后,将该新字段作为参数传递到EditableText第479行:

    textInputAction: widget.textInputAction,

完成.

您现在可以在应用内指定自定义TextInputAction.这不会破坏现有的TextField.它只是添加了覆盖默认行为的功能.

new TextField(
  keyboardType: TextInputType.text,
  textInputAction: TextInputAction.newline,
),

Answer 5

基本上我们使用两种类型的文本输入字段， TextField和TextFormField，

所以，

对于文本字段，

TextField(
  textInputAction: TextInputAction.go
  .......
)

对于文本表单字段，

TextFormField(
          textInputAction: TextInputAction.go,
           ........
)

两者都有 textInputAction 属性，我们可以使用它