Change the default Languages

Open src/common/Constants.js and edit the default language for the app

Language: 'English', 
// Arabic, English. Default to set redux. Only use first time

This setting should be matched with the Languages file from src/comon/Languages.js.

Copy whole English: {...} key-value pair and place in right after that.

export default new LocalizedStrings({
  English: {
    Hello: 'Hello'
    ...
  },
  English: {
    Hello: 'Hello'
    ...
  }
}

Then change en code to your language, for example: France, and translate all contents inside.

export default new LocalizedStrings({
  English: {
    Hello: 'Hello'
    ...
  },
  France: {
    Hello: 'Bonjour'
    ...
  }
}
  • Your new language should be appear in Settings > Languages after reload the app
  • For more details, take a look at ReactNativeLocalization.
  • Please note that the Switching Language feature is only available for Mstore Pro version

Change the language to RTL (right to left)

As the product already support RTL when select Arabic languages, however if you would like to setup the app as the default RTL, try with following guide

Open src/common/Constants.js and edit the default option to RTL: true

You could see the RTL is loaded correctly but the datetime is not changed, let's go to Components/Custom/react-native-timeago to uncomment link this screenshot.

img

Change the date time RTL

On ios you need to change the plist like this screenshot:

img

Config Xcode to support RTL as default

To add more font, you can able to add to the collection from "Fonts provided by application" (see above screenshot)

If you want to support RTL in the first time open app. You need some updates

  • Update for android:
    Enter the folder: android/app/src/main/java then look for file MainApplication.java
    import this package: import com.facebook.react.modules.i18nmanager.I18nUtil;
    add these line in onCreate function

    I18nUtil.getInstance().allowRTL(this, true);
    I18nUtil.getInstance().forceRTL(this,true);
  • Update for iOS:
    Look for the file AppDelegate.m in ios folder
    import this package: #import <React/RCTI18nUtil.h>
    Add these lines in didFinishLaunchingWithOptions function

    [[RCTI18nUtil sharedInstance] allowRTL:YES];
    [[RCTI18nUtil sharedInstance] forceRTL:YES];