Internationalization

All apps built with Appfarm Create support internationalization by default. By using the built-in UI components you ensure that your apps can be easily translated and maintained in different languages.

The default language for a solution, as well as the calendar locale and date and number formatting is set to English (US). We recommend using English as the base language when creating your UI as it makes it easier to provide support and it's often a preferred source language if you choose to translate the UI.

If you do choose to build your UI using a language other than English (US), you can set that language as the default under Internationalization > Languages by changing the Base Language of the default language.

Customize date and number formatting

The default date and number formatting settings can be changed under Internationalization > Languages > English (default). These can also be configured for each new language you add.

Calendar locale

The locale used when formatting dates and displaying Datetime related strings, for example "Monday" and "February".

Date format

The default amount of detail that will be included when displaying a Datetime value. This can also be set per value using the Value processor.

  • Short date

  • Date

  • Long date

Below is an example of how calendar locale and date format work together to format dates:

Calendar Locale
Short Date
Date
Long Date

English - Great Britain

07/02/2022

7 February 2022

7 February 2022, 00:00 CET

English - United States

2/7/2022

February 7, 2022

February 7, 2022, 12:00 AM GMT+1

Norsk bokmål

7.2.2022

7. februar 2022

7. februar 2022, 00:00 CET

Number format

The locale used when applying number formatting using the Value processor or UI components that support number formatting such as Table.

Currency

The currency to display when applying number formatting using the Value processor.

Add a new language

To add a new language to your solution, click the + under Internationalization > Languages. Then, select the desired Base Language. You can also can set the date and number formatting you'd like to apply when this language is set as the active language in the Appfarm Client.

If you need a language that is not currently available, please get in touch.

Once you have added a new language, you need to add translations and enable language switching in your apps.

Translate your apps

Adding and editing translations

Translations can be added and edited in two places in Appfarm Create.

  • Directly within the UI designer.

  • Under Internationalization > Translations.

To add translations directly within the UI designer, look for any property with a globe icon. Click the icon to view and edit all translations for that property. A button to translate all using Google Translate is available. Existing translations will not be affected.

All default language strings and translations are listed under Internationalization > Translations.

Translations are saved instantly as you type. For UI components that support line breaks, you can add a line break by typing Shift + Return/Enter.

Each row includes a context reference, identifying which component and property the string is located in. Click on the reference to be taken directly to that property in the UI designer.

It's also possible to run Google Translate individually for each row. Empty translation values will be replaced with a translation. Existing translations will not be affected. This can be a useful starting point for translations. A human can then review the text and correct translations as required. You will see the best results when you have English as a base language.

Sorting and filtering

By default all strings are displayed and are sorted by app. Strings used in enums are sorted to the bottom. You can also sort alphabetically.

The strings can be filtered down to specific apps and enums.

To search for a specific value, use the Find functionality in your browser Ctrl/Cmd + F.

Import and export

User interface strings and all stored translations can be exported to a CSV file for translation and review. The file is comma delimited. The contents of the file is determined by any sorting and filtering you have applied. The CSV file is structured as follows:

  • The first value is a unique ID (key) referencing the location of the string in the solution.

  • The second value contains the source (default language) string.

  • Any additional values contain the translations, if any, stored for that string. These values follow the same order that the languages are listed in Appfarm Create.

A translated CSV file can be imported back into Appfarm Create. The two first header rows will be skipped. The import loops through all lines and values, and updates translations where the value (trimmed of whitespace) is not empty or is different from the existing trimmed translation value stored in Appfarm Create. Both comma and semicolon delimited files are accepted.

Functions

If you have text in your app that is returned by a function, it will not be shown under Translations. For example, return `Hello ${firstName}` won't be included in the list of strings. To translate such text you can add if statements to check the active language and return the appropriately translated string.

Last updated