Show TOC

Support TranslationLocate this document in the navigation structure

Support for the translation of resource bundles.

Prerequisites

You've created an SAPUI5 application project as described in:
  1. Create an SAPUI5 Application Project
  2. Add a Control to Your View
  3. Implement a Method in the Controller

Context

To enable the translation of the user interface, you define a specific suffix for the resource bundles and use a specific first line in the resource bundle file.

Procedure

  1. If not already done so, change the bootstrap tag (located in the index.html file) to enable the application to access the SAPUI5 libraries on the xsengine as follows: src="resources/sap-ui-core.js" to src="/sap/ui5/1/resources/sap-ui-core.js".
  2. Create a new folder i18n in the WebContent folder. Add a new file messagebundle.hdbtextbundle to the i18n folder with the following content:
    # TRANSLATE
    # XBUT,30
    MY_BUTTON_TEXT=Hello {0} button
    Note A specific suffix .hdbtextbundle is needed for the resource bundles on SAP HANA (so called .properties file on other platforms).
  3. To load this bundle, add the following coding to the createContent function of your view:
    // require the jQuery.sap.resources module     
     jQuery.sap.require("jquery.sap.resources");   
    // load the resource bundle
    var oBundle = jQuery.sap.resources({
      // specify url of the .hdbtextbundle
      url : "i18n/messagebundle.hdbtextbundle"
    });
  4. To add a control to your view for example to the helloworld.view.js), insert the following coding:
    createContent : function(oController) {
    var aControls = [];
             var oButton = new sap.ui.commons.Button({
                    id : this.createId("MyButton"),
                    // access the text using the welcome key and pass the value
                    // for the placeholder ( {0} ) via an array
                    text : oBundle.getText("MY_BUTTON_TEXT", [ "World" ])
             });        
            aControls.push(oButton.attachPress(oController.doIt));        
            return aControls;
    } 

    The text property of the button now is connected to the resource bundle and can be displayed in other languages.