Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
cancel
Showing results for 
Search instead for 
Did you mean: 
Internationalization, or localization, are the terms designated to the concept of providing texts, such as screen labels, titles, messages, and so on, in the language of end users, whose native languages might differ.

How do SAP Fiori apps support internationalization?


SAP Fiori apps support internationalization. To do so, you can make use of a folder in the project structure called i18n. The i18n folder contains i18n.properties files, in which all translatable texts per language are located. Be aware that hardcoded strings cannot be translated and should therefore not be used for language dependent texts.

Texts are obtained by specifying the key of the required text and the current language set in the app.  That way, the most appropriate language texts are shown in the UI. In case no translation of a text element is found, the raw text created by the developer is displayed. For information about how the language is identified, see Identifying the Language Code / Locale.

What’s the key to creating language dependent texts?

Language dependent texts are represented by a key, and a value containing the text. The key represents the type of text. It’s a good idea to make the key clearly identifiable. See the SAP documentation List of Text Types for some best practices.  The type of text is added to the start of the key, which provides contextual information.  For example, “XTIT.myTitle=This is the Title”.

Texts can also contain parameters, which allow for a different order of formatting according to the language. These texts have many uses. For example, to indicate that items are filtered according to a certain criteria.



The texts in the i18n.properties file can be translated, and the file named accordingly; for example, “i18n_de.properties” (texts in German). As well as language codes, you can also add region codes, for example, “i18n_en_us.properties” for American English.  See the de facto standard BCP-47. For more information, see the SAP documentation about Localization.

Once the texts are translated, the files are then uploaded to the i18n folder, which enables the app to access the relevant language texts as determined by the language set for the app.

How do the texts get on the UI?

In the app itself, the texts are read according to the language code to be used and put into a resource bundle. A resource bundle is just a collection of the properties files. The texts are read according to the defined key.

i18n texts without parameters can be referenced in a XML view and obtained via a model, attached to a control or controller, for example:

var oModel = new sap.ui.model.resource.ResourceModel({bundleUrl, bundleLocale: “en”});
oControl.setModel(oModel, “i18n”);

bundleUrl is the location of the i18n resource. For example, "... /i18n/i18n.properties"

Texts can also be referenced in an XML view as “{i18n>sKey}”; for example, “text={i18n>xtit.productNew}”

Note that a text element with parameters cannot be specified directly in the XML view.  Instead, a formatter needs to be defined which fills the values via getText with the key plus a list of the values for parameters.

Example: formatter for a text element with a parameter

In an XML view, a formatter is called with a path to specify the parameter:

text="{path: 'Product', formatter:'.tileTitleDisplay'}"



In the corresponding view controller:

tileTitleDisplay: function(sProductId){

return this.oBundle.getText("xtit.tileTitleDisplay", [sProductId]);

},

Usage in SAP Fiori App Templates


In the templates, the manifest defines the name of the i18n folder in the template app structure.  The appropriate properties file is then read into a resource bundle and put into a model “i18n”.



The resource bundle can be accessed via the view’s controller from the model in the component using, for example:

this.getOwnerComponent().getModel("i18n").getResourceBundle();

What are the key takeaways?

  • The properties files in the i18n folder are used to store language dependent texts.

  • It’s essential to have clearly identifiable keys for your texts.

  • Text resources are bundled together and made available via a model.

  • If your texts have parameters, use formatters.


 

 
1 Comment