#ReactNative Keyboard vs Map flicker

ReactNative Keyboard

How to prevent Map view flicker transitioning from keyboard hide?
I noticed that going from a view that has a TextInput to a Map view would cause screen to flicker when the keyboard was hiding. To prevent this, you can make sure that soft keyboard is dismissed before the app navigates to a Map view.

Check out Keyboard document.

import { Keyboard } from 'react-native'

class Form extends Component {

  componentWillMount() {

    this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide.bind(this));

  }

  componentWillUnmount() {

    this.keyboardDidHideListener.remove();

  }

  _keyboardDidHide() {

    // navigate to Map View

  }

  

  _dismissKeyboard() {

    Keyboard.dismiss()

  }

  render() {

    return(
      <View>

        <TextInput/>

      </View>

    )

  }

}

We can probably prevent the flicker via Animations too. I will give it a try next time.

Thank you for reading!

Jun