Page History

Software Version: 10.1

Summary

This solution example demonstrates how to switch change the language of components using Localization options.

Technical Information

To set up multiple languages in your solution, go to Displays → Localization, click on the “Insert New…“ button and choose a name for your Localization. An empty Localization Table will be created. Fill each row with the original text and its translation, as shown in the figure below.

Image Removed

In the example above, there are three Localization options: Default, Português and Español. There are two ways to change your solution’s Localization. The first is by directly setting the client’s Localization property:

@Client.Localization = "Português";

The second is by calling method SetLocalization:

@Client.SetLocalization("Español");

In this example, you will learn how to create your own Localization Tables and localize components through Draw mode and CodeBehind. You will also receive a few suggestions on how to manage your localization code.

To localize text, create a Localization Table. Go to Displays → Localization, create a new Table, give it a name and fill its OriginalText and TranslatedText columns.

Image Added

n this example, we created two Localization Tables. You can either change the current localization by assigning the name of your Localization Table to Client.Localization, or by passing it as an argument to Client.SetLocalization. To return your solution to the default language, pass an empty string to the

property or

method.

To

localize labels, use the Client.Locale method, and pass the text you want to translate as an argument. Certain components require that you set up the solution’s Culture Info to match the desired localization. Change the Client.CultureInfo property to one of the supported culture codes to do it. In this example, the DatePicker component spawns a calendar that relies on this variable to translate months and days of the week.

To manage Localization and CultureInfo, this solution relies on the languages dictionary:

Dictionary<string, (string localization, string cultureInfo)> languages;

public void StartLanguages()
{
	languages = new Dictionary<string, (string localization, string cultureInfo)>();
	languages.Add("English", ("", "en-US"));
	languages.Add("Português", ("Português", "pt-BR"));
	languages.Add("Español", ("Español", "es-ES"));
}

With this dictionary, changing the Localization through CodeBehind is simple. Whenever the localization is changed, we call the following method:

public void LocalizeAll(string language)
{
	@Client.Localization = languages[language].localization;
	@Client.CultureInfo = languages[language].cultureInfo;
	LocalizeEmployeeDataGrid();
	LocalizePositionComboBox();
}

CodeBehind is also needed to translate the ComboBox and the DataGrid. To translate the DataGrid, we first store its column titles in a list using StartEmployeeDataGrid, and translate them as needed using LocalizeEmployeeDataGrid:

TDataGrid employeeDataGrid = null;
List<string> employeeDataGridTitles;

public void StartEmployeeDataGrid()
{
	

Client.Locale("Your text here");

If your text exists in the Localization Table, it will be translated. In this solution example, you can verify that the Localization you choose in the Language ComboBox applies to TextBlocks, Buttons, Tag References, and even other Displays, such as the header and the help popups.

However, certain components are exceptions to this process. For instance, ComboBoxes and DataGrids need to be translated through the Display’s CodeBehind. To translate a DataGrid, you can store the Default column titles in a list, as in this example’s CodeBehind:

var employeeDataGridTitles = new List<string>();
var 	employeeDataGrid = CurrentDisplay.GetControl("EmployeeDataGrid") as TDataGrid;
	foreach(var column in employeeDataGrid.Columns)
	{
		employeeDataGridTitles.Add(column.Title);  

Then, update the DataGrid titles when a different Localization is selected:

	}
} 

public void LocalizeEmployeeDataGrid()
{
	for(int i = 0; i < employeeDataGridTitles.Count; i++)
	{
		employeeDataGrid.Columns[i].Title = @Client.Locale(employeeDataGridTitles[i]); 

A similar procedure can be used to translate ComboBoxes. In this example, we use a ComboBox to choose the position of a new employee. We want to localize the ComboBox, but keep the selected position in English when we add it to our table of employees. First, we set up a tag containing an array of position texts. Then, we localize each array entry and add it to the ComboBox:

	}
}

For the ComboBox indicating employee positions, we instead save the positions to a text array tag. To localize the ComboBox, we clear it and then repopulate it with the translated items.

TComboBox positionComboBox = null;

public void StartPositionComboBox()
{
	

@Tag.Positions[0].Value = "Electrician";
	@Tag.Positions[1].Value = "Engineer";
	@Tag.Positions[2].Value = "Human Resources";
	@Tag.Positions[3].Value = "Software Developer";
	@Tag.Positions[4].Value = "Administrator";
	positionComboBox = CurrentDisplay.GetControl("PositionComboBox") as TComboBox;
	for(int i = 0; i < @Tag.Positions.ArraySize; i++)
		positionComboBox.Items.Add(@Client.Locale(@Tag.Positions[i].Value));  

To localize the ComboBox again, it is possible to empty it and use the same loop as above. Then, to add the employee to the table with the position written in the Default language, in Datasets → Queries, we use the ComboBox’s selected index to access the Default text in Tag.Positions:

INSERT INTO Employees
VALUES (
    (SELECT COUNT(*) FROM Employees),  -- ID equal to the number of rows
    'Employee' || (SELECT COUNT(*) FROM Employees),  -- Name as 'Employee' + number of rows
    '{Tag.Positions[Tag.PositionIndex].Value}'  -- Position as an empty string
);

	@Tag.PositionIndex = 0;
}

public void LocalizePositionComboBox()
{
	// Empties the ComboBox and repopulates it with the localized versions of positions
	int index = @Tag.PositionIndex;
	positionComboBox.Items.Clear();
	for(int i = 0; i < @Tag.Positions.ArraySize; i++)
		positionComboBox.Items.Add(@Client.Locale(@Tag.Positions[i].Value));
	@Tag.PositionIndex = index;
}

In this solution example, we save the positions to a tag in order to insert them into the employee table using a SQL query called AddEmployee, which you can find in Datasets → Queries. With the way we set up our code, the ComboBox shows localized text, but new rows are inserted in accordance with the table’s original language.

Reference Information

→ See Displays Localization for more information on Localization options

Reference Information

.

→ See ComboBox From Table Example for a simple guide on how to populate DataGrids and ComboBoxes.

In this section: