Translate the interface of your app to other languages to let more users use your app. These instructions are part of the technical preview for translating Reactive Web and Mobile Apps. See Technical Preview: Multilingual apps for more information.
Hers is a quick start to help you translate your app. To let the users use your app in their language, you need to:
Add a new language and translate the text in the app by using the Service Studio translation editor.
Create a language switcher to let users change the language in the app.
If your app uses Static Entities, check Working with Static Entities for more information.
Adding a new language and translating the text
These instructions are part of the technical preview for translating Reactive Web and Mobile Apps. See Technical Preview: Multilingual apps for more information.
To add a new language and translate your app, do the following in Service Studio:
Go to the Data tab and right-click on the Multilingual Locales. Then, select Add Locale. The Select Locale window opens.
Select a locale and then select OK. The translations editor opens.
Note the language code, as you need it later. For example, for Portuguese (Portugal) the code is pt-PT.
In the translations editor, select Show Translate option in the filter list to see all text that needs translation.
See Translating with the translation editor for more information on how to use the editor.
Translate the text in the Translation in (language code) column. Click on Done when you finish.
When you finish translating the text in your app, you need to create a language switcher to show the translations in the app.
Translate the text in all modules of your app. This is important as an app can have multiple modules with user interface elements.
Creating a language switcher
A language switcher lets your users change the language of the app. To create a language switcher, do the following:
Drag a Link widget to a screen. Then, enter the language name in the Text part of the Link.
The example shows how to use the Link widget to change the app language. You can create the same action with other widgets like Button or Dropdown.
Select the Link widget and in the properties, in the On Click list, select New Client Action. New Client Action opens for editing.
With the logic editor open, go to the Logic tab and expand the (System) section. Locate the SetCurrentLocale Client Action and drag it to the logic flow.
If you can't find the SetCurrentLocale Client Action, you need to reference it first. Press Ctrl+Q to open the Manage Dependencies window. Select (System); then, in the right pane under Client Actions, select SetCurrentLocale. Click on the Apply to confirm. You can now use SetCurrentLocale Client Action in your app logic.
Keep in mind that SetCurrentLocale Server Action doesn't work offline. Use SetCurrentLocale Client Action whenever possible.
In the SetCurrentLocale Client Action, in the Locale property, enter the code of the language. For example,
If you have translations from Static Entities, add Refresh Data after SetCurrentLocale. For more information see Working with Static Entities.
Publish the app and select your link to change the language of the app.
Editing existing translation
Getting the identifier of the current language
You can get information about the current language with the GetCurrentLocale built-in function.
Working with Static Entities
Follow these steps to translate the text in Static Entities and show the translation in the app.
In the translation editor, search for the text you want to translate and set Behavior to Translate.
Still in the translation editor, enter the translation in the Translation in (language name) cell.
In the logic to switch the locale, just after the SetCurrentLocale action, add Refresh Data and select the Static Entity.
Switching back to the default language
To let users switch back to the default UI language, create a language switcher that sets the locale code to en-US.
If you experience issues with this technical preview, let us know by posting a new question with the technical preview tag in Forums.