Changing Locale in React-Native (Android)
I have developed an application that is written in React-Native,But when i added localization support i have noticed that when i change the language and come back to the application ,the language didn’t change until i kill the app and start it again (this is not a default behaviour in Android).
Here i will explain how to fix this Issue:
- Open your
AndroidManifest.xml
- Find this line :
android:configChanges=”keyboard|keyboardHidden|orientation|screenSize”
- Replace it with this to be able to detect locale changes
android:configChanges=”keyboard|keyboardHidden|orientation|screenSize|layoutDirection|locale”
4. Run npm install — save react-native-restart@0.0.1
(this will help you reload. all resources and restart the app like CodePush does).
5. Run npm install — save react-native-locale-listener
, this is a library i have written to detect if the locale was changed.
6. Go to your root container and add this imports at the top of the file :
import RNReactNativeLocale from ‘react-native-locale-listener’
import RNRestart from ‘react-native-restart
7. Create a function changeLayout :
changeLayout (language) {
RNRestart.Restart()
}
8.In componentDidMount register listener :
componentDidMount () {
RNReactNativeLocale.addLocaleListener(this.changeLayout)
}
9. in componentWillUnmount unregister listener to avoid leak:
componentWillUnmount () {
RNReactNativeLocale.removeLocaleListener(this.changeLayout)
}
Thank you for reading.