Supporting Multiple Languages

As the team behind the project grows it becomes useful to document how things are done. This post reviews how we provide both an English and a Spanish user interface.

The app is built in Dart and Flutter. Flutter is an application framework supporting smartphones especially well. Application frameworks provide many features, one of them is helping applications support multiple languages. These days, this is called Localizations. Flutter Localizations are fairly typical. The application developer provides files a separate text file for each language they want to support. Each line of a language text file has a tag and some text. When the application code wants to display some text, it provides the tag to the framework. The framework looks at the cell phone’s preferred languages and all the language files in the application and picks the best fit. For example, our app has an “About” button. The app also includes an English language file with the tag “about” and the text “About” as well as a Spanish language file with the tag “about” and the text “Acerca de”. When the app wants to display the About button, it asks the framework for the correct text corresponding to the about tag.

Flutter language files reside in the lib/i10n directory. Currently we have app_en.arb holding English strings and app_es.arb holding Spanish. To add something new, add the same tag to each file with the appropriate translations. Every time you restart the app the framework checks to see if these files have changed. If they have, some magic code generation runs in the background. In the app code, to access the translation for the about button use: AppLocalizations.of(context).about.

I’ve started to use ChatGPT 4 to translate text from English to Spanish. I say when I need text specifically for a button. Here’s is ChatGPT’s output when I asked for a translation for “Feedback”:

Feedback -> Retroalimentación
The word “Retroalimentación” is the most accurate translation for “Feedback,” but it’s relatively long for a button label. Depending on the context and space available, you might consider “Feedback” (borrowed directly from English, commonly understood in tech-related contexts in Spanish-speaking countries) or “Opinión” as alternatives, though “Opinión” is more closely related to “Opinion.”

Leave a Comment

Your email address will not be published. Required fields are marked *