How do I change Text Input Action Button (return/enter key) on Keyboard in Flutter?

The input action for a TextField can be specified like this (here, the Go button):

TextField(
  textInputAction: TextInputAction.go
  ...
)

List of all available input actions.


This is how you can use 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),
  ),
);

This is currently not possible. Although you can edit flutter sources to make it possible quite easily.

The following edits are :

flutter/lib/src/widgets/editable_text.dart

Change _openInputConnection line ~430 to

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();
}

In the same file, also declare a new field on EditableText class (not the state one) ~line 280

final TextInputAction textInputAction;

And assign it in EditableText constructor above line 164

this.textInputAction,

flutter/lib/src/material/text_field.dart

Same story. Add a new field, but to TextField instead :

final TextInputAction textInputAction;

and add the following to it's constructor :

this.textInputAction,

Finally, pass that new field as parameter to EditableText line 479 :

    textInputAction: widget.textInputAction,

Done.

You can now inside your app specify a custom TextInputAction. This won't break existing TextField. It just adds the ability to override the default behavior.

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

Tags:

Dart

Flutter