Localization

Gameface provides tools for adding support for multiple languages and regional variants to your application (for example, supporting text in multiple languages).

Implementation

It’s required to implement the ILocalizationManager interface from the C# side to fit your needs. To outline the key steps to achieve that, consider the following points:

  1. Make your class and inherit the ILocalizationManager which will take care of translating the elements in the UI.

  2. Override the Translate() method, which will do the actual localization. This method receives a key of the element that should be localized and a data parameter that will be used to set the value. The key will hold the data-l10n-id attribute set on the HTML element, and the data attribute will be the result. Based on the key localization for the text in this example, the key will be “NewGame_Localized”. For example: C# side

    public class MyLocalization : cohtml.Net.ILocalizationManager
    {
        public override void Translate(string key, TranslationData data)
        {
                data.Set([localizedText], (uint)localizedText.Length);
        }
    }
    

    HTML Side

    <div class="menuButton" data-l10n-id="NewGame_Localized">New Game</div>
    
  3. You should pass an instance of the custom localization manager to the CohtmlSystemSettings of Gameface CohtmlSystemSettings.LocalizationManager of custom UISystem instance.

Localization data sheets

You can decide how to store the keys and the different localizations for the HTML elements (i.e., collections in the C# code, CSV files, etc.). For example, you can store the information in predefined collections with the translations and obtain needed data from there once a request for a translation is received:

public struct Translation
{
    public string Language;
    public List<string> Texts;
}

public string m_Language;
public List<string> m_Ids;
public List<Translation> m_Translations;

Update Localization data

To force the localization of a specific element in the UI, you can invoke the engine.translate() method with the specific key from the JavaScript code or invoke engine.reloadLocalization() to translate all elements. Keep in mind that all dynamically-created elements with the data-l10n-id attribute will be automatically translated.

Upon the initial loading of the HTML page, the localization will automatically be triggered. In other words, the Translate method will be called for each of the elements on the page which have the data-l10n-id attribute.