Keyboard doesn't show when component is refocused on android

[joseph7h]

on android, if keyboard is dismissed (by clicking arrow down button below the phone-pad), click the input field again (say area code) won't bring it back. Below is the source code:

        <PhoneAuth
            signInWithPhone={phone => console.log('Please attach method to signInWithPhone prop')}
            redeemCode={code => console.log('Please attach method to redeemCode prop')}
            codeLength={6}
            buttonTextColor='black'
            spinnerColor='black'
            color='#ff8203'
            androidFont='monospace'
            iOSFont='Menlo'
            containerStyle={{flex: 1}}
            verifyButtonMessage='Verify Phone Number*'
            disclaimerMessage='*Message & data rates may apply.'
            cca2='US'
            callingCode='1'
        />
    )

[TylerStanish]

Thank you for submitting this issue, I am able to reproduce it.

When building this I was expecting the user to click on the close button rather than clicking the Android back button twice (once to dismiss the keyboard and another time to close the modal).

[TylerStanish]

My hands are sort of tied because a lot of this component uses the react-native-country-picker-modal component; so there is no way for me to hook into the event listener for their modal and refocus on the keyboard when the Android back button is closed because they do not offer a callback for it (they do offer an onClose callback but it is not called when the Android back button is pressed).

I tried adding an event listener for the Android back button on my own, but it doesn't register for the modal (which makes sense because I don't have control over it).

[TylerStanish]

Furthermore, for some reason when I add a <Text/> onPress callback for the area-code (as you say) to re-show the keyboard I still can't get the keyboard to re-appear. I'll look into this some more and try to get something figured out

[grinono]

i'm having more or less the same issue. When i embed the component in a route and navigate to it. somehow the keypad is not appearing.

A tab/press on the phonenumber textfield is not reopening the keypad. Any idea how to fix this?

[TylerStanish]

I think I might be stumped... I tried adding something like

<Text onPress={() => {
  console.log('in onPress callback');
  this._ref.focus();
}}>...

but even though the console.log worked the ref (keyboard) didn't focus or throw an error. I also tried calling setState after the this._ref.focus() but still no

[rgordon95]

The keyboard on android does not reveal at all for me when I push the component that contains this. What I have noticed is if you open the multitasking screen that displays all your currently running apps and then reselect the application, the keyboard does reveal. The actual input display does behave kind of wonky when inputting the code at this point, but it does work. The same must be done on the code confirmation screen. I am trying to devise a fix for this but that is about the only workaround I have come up with so far. Maybe it will help you or the dependency creators.

Will update if I figure out a way to get the keyboard to reveal from the same thing triggering it to work when you "reopen" the running app onto the page.