From b5dcc26d4e65d2b66952c3427850d68b2e8ed211 Mon Sep 17 00:00:00 2001 From: Ayush Shekhar Date: Mon, 27 Jul 2026 19:42:03 +0400 Subject: [PATCH] docs(localization): clarify translatable text support Co-Authored-By: OpenAI Codex --- .../localization-accessibility/localization.md | 14 ++++++++++++-- .../control-flow/functions/utility-functions.md | 5 ++++- docs/resources/ui/widgets/basic-widgets/text.md | 2 ++ 3 files changed, 18 insertions(+), 3 deletions(-) diff --git a/docs/ff-concepts/localization-accessibility/localization.md b/docs/ff-concepts/localization-accessibility/localization.md index 38534c8ba..b11a499dd 100644 --- a/docs/ff-concepts/localization-accessibility/localization.md +++ b/docs/ff-concepts/localization-accessibility/localization.md @@ -26,7 +26,9 @@ FlutterFlow enables you to translate all text in your app at once using Google T Adding multi-language support is essential for making your app accessible to a wider audience. For instance, if your app provides exercise instructions only in English, non-English speakers may find it hard to understand and might choose a different app, even if it’s less effective, simply because it’s available in their language. Implementing a multi-language feature helps your app succeed globally by offering a user-friendly experience for diverse audiences. -To add multi-language support in FlutterFlow, navigate to **Settings and Integrations** > **Languages**, add the languages to support, set a primary language as a fallback, and optionally choose a display language. Then, use **Translate All** for automatic translations and adjust them if needed. Finally, verify translations on different pages by changing the language dropdown in the canvas. +To add multi-language support in FlutterFlow, navigate to **Settings and Integrations** > **Languages**, add the languages to support, and set a primary language. Then, use **Translate All** for automatic translations and adjust them if needed. + +To preview translated content without running your app, open **Canvas Settings** next to the light and dark mode control and choose a **Display Language**. This selector is available after you add multiple languages to your project. :::warning @@ -116,6 +118,14 @@ You can also add or update translations for individual text directly inside the ![manage-translation-in-properties-panel.avif](imgs/manage-translation-in-properties-panel.avif) +:::note[RichText and Combine Text] + +Static text in each **RichTextSpan** is translatable and appears in the Languages table like text from a standard Text widget. + +Text assembled with the **Combine Text** function does not appear in the Languages table and is not included in **Translate All**. If you need separately styled translatable text, use a [**RichText** widget](../../resources/ui/widgets/basic-widgets/text.md#richtext-widget) and enter the text in its RichTextSpan children. + +::: + ## Translating Predefined Messages FlutterFlow allows you to manage the translation for the following types of predefined messages. @@ -215,4 +225,4 @@ Localization testing is crucial to ensure that all elements work properly across - **Change Device Locale**: Test your app by changing the device locale to verify translations and layout adjustments. - **Use Emulators**: Use Android or iOS emulators to simulate different locales and ensure everything is displaying correctly. - **Long Texts**: Verify that long translations do not overflow or cause UI issues. -- **Manual Testing**: Manually verify the accuracy of translations, date formats, number formats, etc. \ No newline at end of file +- **Manual Testing**: Manually verify the accuracy of translations, date formats, number formats, etc. diff --git a/docs/resources/control-flow/functions/utility-functions.md b/docs/resources/control-flow/functions/utility-functions.md index a8797a1d4..108d7921f 100644 --- a/docs/resources/control-flow/functions/utility-functions.md +++ b/docs/resources/control-flow/functions/utility-functions.md @@ -83,6 +83,9 @@ The **Combine Text** built-in function only allows you to combine multiple value static) together, with the same text style applied to all of them. If you need to combine multiple String values with different text styles for each, consider using the **[RichText](../../ui/widgets/basic-widgets/text.md#richtext-widget)** widget. + +Text assembled with **Combine Text** does not appear in the Languages table and is not included in +**Translate All**. Static text in RichTextSpan children is translatable. ::: @@ -261,4 +264,4 @@ With Inline Functions, you had to manually pass values as arguments. In contrast You can write any valid Dart expression in a Custom code expression, even multi-line logic using anonymous functions. Plus, Custom Code Expressions support real-time autocomplete and inline error validation, making it much easier to discover available variables and avoid mistakes.

- \ No newline at end of file + diff --git a/docs/resources/ui/widgets/basic-widgets/text.md b/docs/resources/ui/widgets/basic-widgets/text.md index dad996390..c24ceee68 100644 --- a/docs/resources/ui/widgets/basic-widgets/text.md +++ b/docs/resources/ui/widgets/basic-widgets/text.md @@ -36,6 +36,8 @@ either drag it to your desired location on the screen or insert it directly via When the RichText widget is added to your widget tree, FlutterFlow automatically creates two RichTextSpan child objects. You can modify the text value and styling of each object to create multiple styles within your paragraph. +Static text entered in a RichTextSpan is translatable and appears in the Languages table. In contrast, text assembled with the [**Combine Text** function](../../../control-flow/functions/utility-functions.md#combine-text) does not appear in the Languages table or **Translate All**. + To modify the RichTextSpan objects, see the quick demo below: