expo: RTL localization doesn't work on first load, requires restart

This is a followup issue to the discussion here: https://github.com/expo/expo/issues/1205

The generally accepted recommendation in upstream react-native is to add a few native lines when your app starts (before AppRegistry is called):

Right now the only thing you can do with Expo is Updates.reload (similar to react-native-restart) in order to get the behavior on second load. This isn’t great, so we might need to add a native hook to make RTL-localized builds start correctly on the first load.

In particular, this has been an issue for some users who want to force their app to stay in LTR even when the device system settings are configured as RTL.

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 5
Comments: 21 (4 by maintainers)

Most upvoted comments

Expo.Updates.reload();

but the issue is this will take effect only on the next load of the app. to solve the issue you can either use

Just like I18nManager.forceRTL(false); works on next load, Updates.reload() too works on the next load of the App and not on the first load. No matter if you give conditions or not…

creativemind1 on Jun 24, 2019

hey, any updates on this issue? I managed to find a work around by running the following code:

const isRTLAndroid = Platform.OS === 'android' && I18nManager.isRTL;
    if (isRTLAndroid) {
      I18nManager.forceRTL(false);
      I18nManager.allowRTL(false);
      Expo.Updates.reload();
    }

the issue with it is that it causes the app to crash and show Expo’s blue screen, prompting the user to manually reload (horrible UX). If the issue is currently not being prioritised/ worked on, did anyone find a better workaround? thanks a lot!

amitneeman on Feb 28, 2019

here is the solution:

https://stackoverflow.com/a/61343685/7564751

Library link: https://www.npmjs.com/package/fiction-expo-restart

install: npm i fiction-expo-restart

import: import {Restart} from 'fiction-expo-restart';

Use: Restart();

mahevstark on Apr 21, 2020

Sorry for the slow followup @m4tx . I think we’d like to have a way to specify the LTR/RTL settings before running JS code – perhaps a new configuration setting in app.json. Ideally we’d like people’s apps to load correctly on the first run without immediately having to reload.

Let me know if that doesn’t make sense or if I’m missing some complexity here!

esamelson on Aug 15, 2018