Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Backspace button is not working on some Android devices (Samsung especially) #95

Open
aj-989 opened this issue Jul 21, 2021 · 6 comments

Comments

@aj-989
Copy link

aj-989 commented Jul 21, 2021

On a few android devices (so far all from Samsung) the backspace on the virtual keyboard of the device, doesn't so anything.
It doesnt delete chip nor text.

The same code works perfectly on all iOS devices and other Android devices.

I noticed that on Web, the backspace of a real keyboard, doesn't do anything.

So I tried to do this, in the chips_input code, I added this snippet:

RawKeyboardListener(
    focusNode: _effectiveFocusNode,
    onKey: (event) {
  if (event.isKeyPressed(LogicalKeyboardKey.backspace)) {
           setState(() {

      _value = _value.copyWith(
        text: "",
        selection: TextSelection.collapsed(offset: 0),
        composing: TextRange.empty,
      );
      });
})

so basically I m emptying manually the whole _value, and this works on the Android devices where the backspace is not working.

So this means that on those Android devices, the virtual keyboard is actually considered as a "RawKeyboard" as on those Devices, this listener is firing!

But the same code, on the devices where we have no issue with backspace, this code snippet does not fire!

Any suggestions?
And how can I adjust the code, so when a "backspace" is found on a RawKeyboard, it just deletes the last character or removes the latest chip if no text.

@Esmail-Rahmani
Copy link

I Have same problem

@jorelkimcruz
Copy link

jorelkimcruz commented Aug 19, 2021

Ive fixed this by wrapping the NotificationListener widget with RawKeyboardListener.
override back space click.

return RawKeyboardListener(
      focusNode: _effectiveFocusNode,
      onKey: (event) {
        final str = currentTextEditingValue.text;
        /// Make sure to filter event since without checking 'RawKeyDownEvent' will trigger this multiple times (2) because of RawKeyUpEvent
        if (event.runtimeType.toString() == 'RawKeyDownEvent' &&
            event.logicalKey == LogicalKeyboardKey.backspace &&
            str.isNotEmpty) {
          final sd = str.substring(0, str.length - 1);
          /// Make sure to also update cursor position using the TextSelection.collapsed.
          updateEditingValue(TextEditingValue(
              text: sd, selection: TextSelection.collapsed(offset: sd.length)));
        }
      },
      child: NotificationListener<SizeChangedLayoutNotification>(
        onNotification: (SizeChangedLayoutNotification val) {
          WidgetsBinding.instance?.addPostFrameCallback((_) async {
            _suggestionsBoxController.overlayEntry?.markNeedsBuild();
          });
          return true;
        },
        child: SizeChangedLayoutNotifier(
          child: Column(
            children: <Widget>[
              GestureDetector(
                behavior: HitTestBehavior.opaque,
                onTap: () {
                  requestKeyboard();
                },
                child: InputDecorator(
                  decoration: widget.decoration,
                  isFocused: _effectiveFocusNode.hasFocus,
                  isEmpty: _value.text.isEmpty && _chips.isEmpty,
                  child: Wrap(
                    crossAxisAlignment: WrapCrossAlignment.center,
                    spacing: 4.0,
                    runSpacing: 4.0,
                    children: chipsChildren,
                  ),
                ),
              ),
              CompositedTransformTarget(
                link: _layerLink,
                child: Container(),
              ),
            ],
          ),
        ),
      ),
    );

@vijayvaghela72
Copy link

getting same issue backspace bottom not working for samsung and vivo Phones.

please share solution if any exist .

Thank You...!

@lanistor
Copy link

Ive fixed this by wrapping the NotificationListener widget with RawKeyboardListener. override back space click.

return RawKeyboardListener(
      focusNode: _effectiveFocusNode,
      onKey: (event) {
        final str = currentTextEditingValue.text;
        /// Make sure to filter event since without checking 'RawKeyDownEvent' will trigger this multiple times (2) because of RawKeyUpEvent
        if (event.runtimeType.toString() == 'RawKeyDownEvent' &&
            event.logicalKey == LogicalKeyboardKey.backspace &&
            str.isNotEmpty) {
          final sd = str.substring(0, str.length - 1);
          /// Make sure to also update cursor position using the TextSelection.collapsed.
          updateEditingValue(TextEditingValue(
              text: sd, selection: TextSelection.collapsed(offset: sd.length)));
        }
      },
      child: NotificationListener<SizeChangedLayoutNotification>(
        onNotification: (SizeChangedLayoutNotification val) {
          WidgetsBinding.instance?.addPostFrameCallback((_) async {
            _suggestionsBoxController.overlayEntry?.markNeedsBuild();
          });
          return true;
        },
        child: SizeChangedLayoutNotifier(
          child: Column(
            children: <Widget>[
              GestureDetector(
                behavior: HitTestBehavior.opaque,
                onTap: () {
                  requestKeyboard();
                },
                child: InputDecorator(
                  decoration: widget.decoration,
                  isFocused: _effectiveFocusNode.hasFocus,
                  isEmpty: _value.text.isEmpty && _chips.isEmpty,
                  child: Wrap(
                    crossAxisAlignment: WrapCrossAlignment.center,
                    spacing: 4.0,
                    runSpacing: 4.0,
                    children: chipsChildren,
                  ),
                ),
              ),
              CompositedTransformTarget(
                link: _layerLink,
                child: Container(),
              ),
            ],
          ),
        ),
      ),
    );

Change as following to support 'emoji'.

RawKeyboardListener(
      focusNode: _effectiveFocusNode,
      onKey: (event) {
          ... 
          final sd = String.fromCharCodes(str.runes, 0, str.runes.length - 1);
          ...
      }

@novvia-dev
Copy link

Are there any outstanding PRs? @lanistor it would be great if you made one with that fix

@lanistor
Copy link

lanistor commented Sep 3, 2022

Forward here: https://github.com/flickerlist/flutter_chips_input/tree/br/1.10.1

Fix: android delete cannot be triggered in some devices
Fix: iOS Simulator Jiantipinyin cannot input

I cannot create a pull request, for version code management, i created from v1.10.0, which is not existed in danvick/flutter_chips_input, but existed in pub.dev.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants