Flutter Localization and Languages

An app written in one language reaches only part of the world. Localization lets the same app speak Hindi, Spanish, Arabic, or any other language based on the user's phone settings. Flutter ships official tools that keep all translated text in organized files and generate type-safe code from them.

The Big Picture

  Phone language: Hindi
          │
          ▼
  Flutter picks  app_hi.arb
          │
          ▼
  AppLocalizations.of(context).welcome
          │
          ▼
  Screen shows the Hindi word for "Welcome"

Think of the setup as a phone book. Each message has one key, and every language file stores its own translation under that key.

Step 1: Add the Packages

flutter pub add flutter_localizations --sdk=flutter
flutter pub add intl

Step 2: Turn On Code Generation

Add this line inside the flutter section of pubspec.yaml:

flutter:
  generate: true

Create a file named l10n.yaml in the project root:

arb-dir: lib/l10n
template-arb-file: app_en.arb
output-localization-file: app_localizations.dart

Step 3: Write ARB Files

ARB files are simple JSON files that store translations. The English file acts as the template.

// lib/l10n/app_en.arb
{
  "welcome": "Welcome",
  "greeting": "Hello, {name}!",
  "@greeting": {
    "placeholders": {
      "name": { "type": "String" }
    }
  }
}

// lib/l10n/app_es.arb
{
  "welcome": "Bienvenido",
  "greeting": "¡Hola, {name}!"
}

Each language gets its own file, and the file name ends with the language code. Run flutter gen-l10n or simply flutter run to generate the Dart class.

Step 4: Connect the App

import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';

MaterialApp(
  localizationsDelegates: [
    AppLocalizations.delegate,
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
    GlobalCupertinoLocalizations.delegate,
  ],
  supportedLocales: [
    Locale('en'),
    Locale('es'),
  ],
  home: HomeScreen(),
)

The built-in delegates translate system widgets such as the date picker. The supportedLocales list tells Flutter which languages the app offers. Flutter falls back to the first language in the list when the phone uses an unsupported one.

Step 5: Use the Text

Text(AppLocalizations.of(context)!.welcome)
Text(AppLocalizations.of(context)!.greeting('Asha'))

A misspelled key becomes a compile error instead of a runtime surprise.

Plurals

Languages treat counts differently. English uses "1 item" and "2 items". Other languages have extra forms. ARB files handle this with a plural syntax:

"itemCount": "{count, plural, =0{No items} =1{One item} other{{count} items}}",
"@itemCount": {
  "placeholders": { "count": { "type": "int" } }
}

Dates, Numbers and Currency

Formats change with location. The date 08/11/2026 means 8 November in India and August 11 in the United States. The intl package formats values for the active locale.

import 'package:intl/intl.dart';

String d = DateFormat.yMMMd().format(DateTime.now());
String price = NumberFormat.currency(locale: 'en_IN', symbol: '₹').format(1499.5);

Right-to-Left Languages

Arabic, Hebrew, and Urdu read from right to left. Flutter flips the layout automatically when the active language is right-to-left. Use EdgeInsetsDirectional and AlignmentDirectional instead of left and right values, and the layout mirrors itself correctly.

  English (LTR)                 Arabic (RTL)
  ┌───────────────────┐         ┌───────────────────┐
  │ [icon] Title      │         │      Title [icon] │
  │ Back          Next│         │Next          Back │
  └───────────────────┘         └───────────────────┘

Letting Users Choose a Language

Set the locale property of MaterialApp from a variable. Store the user's choice and rebuild the app when it changes, the same way a dark mode toggle works.

Translation Habits

• Keep full sentences in one key. Joining word fragments breaks grammar in other languages.
• Leave room for longer text. German and Finnish words often run 30 percent longer than English.
• Avoid text inside images, because translators cannot reach it.
• Use professional or native-speaker review for production text.

Practice Ideas

Translate a welcome screen into two languages. Change the phone language and watch the app switch. Add a plural message for a shopping cart count and test counts of zero, one, and five.

Planning for Many Languages from Day One

Adding translations late costs far more than preparing early. Moving hundreds of hard-coded strings into ARB files takes careful hunting through every screen. Start each project with the localization setup, even if the app launches in a single language. Each new message goes straight into the English file, and a future translation becomes a matter of copying the file and filling in the values.

Context helps translators. Add a description to each key in the template file, so the translator knows whether "Open" means a verb on a button or an adjective describing a store.