Localize UI created with UI Toolkit
Bind UI Toolkit elements to localized strings and assets.
Read time 2 minutesLast updated a month ago
Bind UI Toolkit elements to localized strings and assets.
Every localized reference type, such as and , is also a UI Toolkit runtime data binding and a UI Toolkit XML (UXML) object. The same type works three ways: as a field in the window, as a binding authored in UI Builder or UXML, and as a binding created in code. Bound values update automatically when the user switches language.
LocalizedStringLocalizedTextureInspector
?
Prerequisites
Before you start, make sure you have the following:
- A table collection with entries. Refer to Get started with localization.
Bind in UI Builder
To bind a property to a localized value in UI Builder:
- In UI Builder, select the element, for example a .
Label - In the Inspector window, right-click (macOS: Ctrl+click) the property to localize, for example Text, and select Add binding.
- Set the binding type to LocalizedString and pick the table entry.
For asset-typed properties, use the matching type, for example LocalizedTexture for a background image.
Bind in UXML
The reference types are UXML objects, so a binding can live in the UXML itself:
<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:loc="Unity.Localization"> <ui:Label> <Bindings> <loc:LocalizedString property="text" table="My Strings" entry="greeting" /> </Bindings> </ui:Label></ui:UXML>
Bind in code
A binding created in code follows the same pattern as any custom binding:
Label label = root.Q<Label>("title");LocalizedString binding = new LocalizedString();binding.SetReference("My Strings", "greeting");label.SetBinding("text", binding);
Language selection controls
Two built-in controls appear in the UI Builder library under Controls:
- : A dropdown that lists the enabled locales.
LanguageDropdown - : A group of radio buttons, one per enabled locale.
LanguageRadioButtonGroup
Both fill themselves from the available locales and apply the user's choice, with no additional setup code required. Refer to Create a language selection menu.