Translation keeps the text of one design in multiple languages, so a project can serve different regions without duplicating screens. This guide explains the concept, how to set up translations, and what to watch out for.
Overview
Interface text differs by region: the same label reads differently in Chinese and English. Without translation support, every language needs its own copy of every screen, which is expensive to design and to maintain.
Translation separates the text content from the language currently displayed:
| Concept | Meaning |
|---|---|
| Language | One target display language of the interface text. |
| Text entry | One piece of interface text, defined per language. |
Typical scenarios:
- One project serving multiple sales regions or device locales.
- Reviewing how every screen reads in a given language from inside the editor.
- Keeping translations next to the design, instead of in a separate file that drifts from it.
Usage
- Open the translation configuration.
- Add the target languages the project needs to support.
- Fill in the text of each language for the labels used on your screens.
- Switch the active language and check every screen in preview; preview runs the same generated code as the target device.
- Build a font library covering the characters of each target language, and confirm the final result in the code view or the codegen output.
Attention points
- The editor's own interface language is a separate setting (Language under General in Settings) and does not change project text.
- Every language needs glyph coverage: a font file usually carries the full character set of a language, but you still have to build a font library selecting the characters, ranges, and symbols actually used - importing a font file alone does not make text renderable. See Font library.
- Translated text is usually longer or wider than the source text and can overflow fixed-size widgets; review every screen in every language, adjusting with flex layout where needed.
- When the active language has no text for an entry, the value falls back to another language rather than rendering empty.
Related guides
- Font library - rendering the characters of each language.
- Layout - adapting screens to different text lengths.
- Preview - verifying each language with live rendering.
- Codegen - how text lands in generated code.
- Dynamic LVGL version - runtime (and language) version switching.