React-native: I18n.forceRTL is forcing rtl layout only on second app launch

[grmmph]

Description

I have an App in hebrew that should force RTL layout even for LTR devices (curenty our interface is only in hebrew)

Using I18nManager.forceRTL(true) does the trick, but only after the scond app launch by the user.

So now when the akp is in production the user gets the following:
User download app from store -> user open app and get LTR Layout. -> user close app and remove from background -> user open app again and get desired RTL layout.

Solution

My guess would be that somehow we should run force RTL method before appRegistery, but not sure how to do it.
Alternativle and more desirable solution is to make forceRTL more dymanic, so user can switch layouts direxction without the need to relaunch app.

[lacker]

Well you could call forceRTL before you call the app registry. Does that work?

Alternatively you could try calling whatever forceRTL calls from native code.

[ghost]

@lacker I call forceRTL method before appRegistery, but in first run everything will be rendered Left to Right.
Android only

how should I call forceRTL in native code?

[eldadcaspi]

Hi @grmmph, did you get to solve this? I'm having the exact same issue and am trying to avoid changes to the native projects since i'm using Expo. thanks

[I-ad]

if you are not using expo so you can use react-native-restart,
you can make a condition at the first like if !isRTL then make true and then restart.

and if you use expo you have to reload the app with Util but Im not sure if its gonna work the same at the real app.

[hramos]

Hi there! This issue is being closed because it has been inactive for a while. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. Either way, we're automatically closing issues after a period of inactivity. Please do not take it personally!

If you think this issue should definitely remain open, please let us know. The following information is helpful when it comes to determining if the issue should be re-opened:

• Does the issue still reproduce on the latest release candidate? Post a comment with the version you tested.
• If so, is there any information missing from the bug report? Post a comment with all the information required by the issue template.
• Is there a pull request that addresses this issue? Post a comment with the PR number so we can follow up.

If you would like to work on a patch to fix the issue, contributions are very welcome! Read through the contribution guide, and feel free to hop into #react-native if you need help planning your contribution.

[iddan]

This issue still occurs on RN 0.48

[papmodern]

"expo": "^22.0.0",
"react": "16.0.0-alpha.12",
"react-native": "^0.48.4",

Still occurs

[miladnit]

Hi,
exact same issue

[MortezaAghili]

After a week finally i found a logicly way to solve this issue with using Redux & react-native-restart plugin. If you are interested you can check it on Stackoverflow

[ShacharAngel]

Still occurs

[sergey-korchagin]

Had same problem, in android mainApplication:
@Override
public void onCreate() {
super.onCreate();
I18nUtil sharedI18nUtilInstance = I18nUtil.getInstance();
sharedI18nUtilInstance.forceRTL(this,true);
sharedI18nUtilInstance.allowRTL(this, true);
}

The problem solved

[sergey-korchagin]

Also solved in IOS
@implementation AppDelegate

• (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
  {
  NSURL *jsCodeLocation;
  [[RCTI18nUtil sharedInstance] allowRTL:YES];
  [[RCTI18nUtil sharedInstance] forceRTL:YES];

[iamsoorena]

Still occurs on 0.55

[karimkhamwani]

any updates?

[FakhruddinAbdi]

How to fix it if I use expo and can not edit native codes :( ?

[HosamZewain]

Editing native code is not a solution. It may work for RTL only apps but any app uses tow languages can't force RTL in native code.
The only solution I found is to use react-native-restart, But It's very bad UX.

[azzozhsn]

Also, I have two languages application (rtl, ltr). When I switch the language, the layout doesn't update after restart app. I have to click on the language again to flip the UI. This is annoying,