1

This is an Android question.

Inside my <TextInput> (ReactNative (which renders an EditText in Android)) when the user types "#" and then they use Androids swipe mode to auto-complete a word, it adds a space between the "#" and the autocompleted word. So what I was doing was, onChange of the text, I replace the space between "#" and the word, however while the user is in swift mode, it is really messing things up. The space comes back and the swift autocomplete messes up to another word.

Is there a way in react-native to listen when the user accepts an autocompletion? I want to then check if the previous two chars are a # (hashtag and space) and if so, then replace it with just # (hashtag without space).

I was thinking the onCommitCompletion- https://developer.android.com/reference/android/widget/TextView.html#onCommitCompletion(android.view.inputmethod.CompletionInfo) - fires after a suggested word is accepted - is this true? If it is this would be perfect and I can submit a PR to react-native to accept this for Android.

Here is a video of what's happening: https://gfycat.com/AdmirableGrizzledIrishsetter

Low quality:

Daksh Gargas
  • 3,498
  • 2
  • 23
  • 37
Noitidart
  • 35,443
  • 37
  • 154
  • 323
  • 1
    I've been developing android apps as a professional for almost an year, have never heard of such. Are you sure "swift mode" is a correct term? – Daksh Gargas Jul 11 '18 at 19:48
  • 1
    Also, there is no such thing called ``, it's actually called `` and **No** it's not an `EditText` but it's more of a *wrapper* to it. One usually put's an `EditText` inside `TextInputLayout` to provide some additional features to it. – Daksh Gargas Jul 11 '18 at 19:50
  • @Dennis thanks, I might be using wrong terminology. You know how if you want to type "hello" you can put your figure on "h" and without lifting trace to the e l o and it will smart figure out what we are doing. Is this called swift? Or auto suggest? or Commit? – Noitidart Jul 11 '18 at 23:45
  • 1
    Looking at your score, I thought you are new to this, that's why I was just helping you. And that term you want is called `AutoComplete` – Daksh Gargas Jul 11 '18 at 23:51
  • 1
    I just saw your updated question. I totally misunderstood it in the first time. By "swift mode" you are referring to the IOS version, right? – Daksh Gargas Jul 11 '18 at 23:54
  • 1
    If yes, I'll ask me office colleagues who work on the IOS side of the app to help you with. Just wait for 5 more hours. – Daksh Gargas Jul 11 '18 at 23:54
  • @Dennis I really appreciate your help. I'm actually very new to mobile I use react-native so don't know proper mobile way. I'll take a screencast video of the thing and share. I really appreciate your help I have been struggling with this for long time. – Noitidart Jul 12 '18 at 00:30
  • 1
    Don't mention it buddy!! we all are here to help each other. :) – Daksh Gargas Jul 12 '18 at 00:42
  • @Dennis You're too kind :) :) Thanks also for waiting. I got it record, please see high quality here - https://gfycat.com/AdmirableGrizzledIrishsetter - after I press and hold F to get the "hashtag" symbol in, then I press down on "s" then swipe till it auto fills "sleep". My problem is it is putting a space between the previous "#". So I was looking for an event to detect when this happens, and figure out if it was preceded by "# " and then remove the space so its just "#". – Noitidart Jul 12 '18 at 03:22

3 Answers3

1

This is happening because you are typing a text via Swipe feature of your keyboard. The Swipe feature automatically adds an extra space before and after the String. There is no way to get rid of it, it's an integrated feature of(some) the keyboard. We have no control over it. Don't worry, the end user is aware of it and all he has to do is type the whole text rather than using Swipe feature to input his text.

Try disabling AutoComplete inside your TextInput , perhaps like <TextInput autoCorrect={false}/>, I'm not sure.

Also, this isn't the problem with Android phones only, try installing GBoard in an Apple Device and you'll face the same problem.

Daksh Gargas
  • 3,498
  • 2
  • 23
  • 37
  • Oooh "swipe" haha. Thanks Dennis! What does `onCommitCompletion` mean? Does it trigger after a word is accepted? My hope is to not change the default behavior, as its needed for it to work norally. But just for hash tags, I want to detect if an auto completion is accepted and if it was check if the leading two charcters are a "# " (pound and space). And if so auto replace these leading two chars with just a #. – Noitidart Jul 12 '18 at 08:47
  • 1
    `onCommitCompletion` something used in Xamarian(A framework developed by Microsoft, just like ReactNative) It is called by the framework in response to a text completion from the current input method. The default implementation does nothing; `textViews` that are supporting auto-completion should override this to do their desired behavior. "Does it trigger after a word is accepted?" I'm not really sure. In android we usually add a `Listener` to our `EditText` and whenever it's `onTextChangeListener` -> https://stackoverflow.com/questions/20824634/android-on-text-change-listener – Daksh Gargas Jul 12 '18 at 08:57
  • Ah interesting thanks so much Dennis for such a fast reply! This is the thing I was refering to - https://developer.android.com/reference/android/widget/TextView.html#onCommitCompletion(android.view.inputmethod.CompletionInfo) – Noitidart Jul 12 '18 at 09:01
  • 1
    `TextView` is a superclass of `EditText`. The `EditText` allows you to input a text while `TextView` is just a via in which you add a text programmatically. But there is something called `AutoCompleteTextView` which takes user input and you pass a list of String to it at the compile time which will give suggestions to the users. – Daksh Gargas Jul 12 '18 at 09:04
1

I worked on a major keyboard for 2 years and I have no idea what you mean by "swift mode". But there is no such feature in the generic keyboard API. It may be a feature of some particular keyboard, but there'd be no way to programmatically turn it off.

What you're describing comes closest to sounding like autospacing. This is not a concept that Android has, it would be a concept of each individual keyboard. And since Android knows nothing about it, it can't turn it off (on many keyboards the user could, but that's it).

You might be able to override it (not turn it off, but force the spaces to disappear) if you were to do some work with either overridding the InputConnection or setting a text watcher in Java and altering the text to be inserted, but neither can be done at the react native level- you'd need to write a custom edit text and link that down to react native via a native component.

Gabe Sechan
  • 90,003
  • 9
  • 87
  • 127
  • Thanks Gabe. I have been struggling with this for long time. I don't want to turn it off, I need it, my goal is to just replace space only if swipe/autocomplete is used after typing a hash. The default behavior is good and needed, except for hashtag. Does the `onCommitCompletion` or some other callback fire after a word is accepted? – Noitidart Jul 12 '18 at 08:53
  • 1
    @Noitidart It depends on the keyboard- if it uses completion mode or not. It may use that, but only if it uses the build in completion display (the word list above the keyboard). Many keyboards implement their own, Android's is wonky. More likely it would be commitText, or finishComposingText, although other calls are possible. – Gabe Sechan Jul 12 '18 at 12:20
  • Thanks very much Gabe may you share with me the possibles or which direction I can research? I'm not so familiar with Android. – Noitidart Jul 12 '18 at 15:31
  • 1
    The keyboard app and the view its attached to talk via the InputConnection class. The view returns an InputConnection from the getInputConnection function, which can be overridden for any special behavior you wish. Pretty much any of the functions which push text could be called, depending on how the keyboard was implemented. But commitText and finishComposingText are the two most common. You may be better off looking at TextWatcher.afterTextChanged and editing it out after its set, as all changes to the text will go through there. – Gabe Sechan Jul 12 '18 at 15:34
0

I think this would be onCommitCompletion - I'm not sure though I am not able to test yet. I think in this callback I would get the position, and see if there is a leading space, and if so then remove that leading space.

Noitidart
  • 35,443
  • 37
  • 154
  • 323