Flutter Localization Helper

Inspect source and target ARB bundles. Validates key parity, placeholder variables, and supported ICU plural/select syntax with a live registered Flutter template and ambient RTL/LTR stress preview.

Preset Scenario:

📖Tutorial Guide (T08.06)↗

✓All checks passed

🔒 Runs in your browser

Source ARB Bundle (Base Reference)

7 keys

{
  "@@locale": "en",
  "@@context": "WidgetExamples Localization Lab",
  "welcome": "Welcome, {name}!",
  "@welcome": {
    "description": "Greeting shown on the home header",
    "placeholders": {
      "name": {
        "type": "String",
        "example": "Chirag"
      }
    }
  },
  "profileCard": "{firstName} {lastName} ({role})",
  "@profileCard": {
    "description": "User card title with name and assigned role",
    "placeholders": {
      "firstName": {
        "type": "String"
      },
      "lastName": {
        "type": "String"
      },
      "role": {
        "type": "String"
      }
    }
  },
  "dontTouch": "Don''t touch this item",
  "@dontTouch": {
    "description": "Warning message with escaped apostrophe"
  },
  "codeSample": "To define a set, write '{'value'}' in Dart.",
  "@codeSample": {
    "description": "Technical instruction demonstrating literal escaped braces"
  },
  "itemCount": "{count, plural, =0{No items} =1{1 item} other{{count} items}}",
  "@itemCount": {
    "description": "Plural counter with explicit zero, one, and fallback",
    "placeholders": {
      "count": {
        "type": "num",
        "format": "compact"
      }
    }
  },
  "genderGreeting": "{gender, select, female{Hello Ms. {name}} male{Hello Mr. {name}} other{Hello {name}}}",
  "@genderGreeting": {
    "description": "Select statement branching on gender with required fallback",
    "placeholders": {
      "gender": {
        "type": "String"
      },
      "name": {
        "type": "String"
      }
    }
  },
  "notifications": "{role, select, admin{{count, plural, =0{Admin: zero alerts} =1{Admin: 1 alert} other{Admin: {count} alerts}}} other{{count, plural, =0{No alerts} other{{count} alerts}}}}",
  "@notifications": {
    "description": "Nested select containing plural branches with required fallbacks at all levels",
    "placeholders": {
      "role": {
        "type": "String"
      },
      "count": {
        "type": "num"
      }
    }
  }
}

Target ARB Bundle (Translation)

7 keys

Matching Keys6

Valid Reordered1

Missing Keys0

Extra Keys0

Fallback Errors0

Unsupported ICU0

Registered Flutter Template PreviewLive CanvasKit Engine

Scale:

ℹ️Scoped Template Scope: Demonstrates registered widgets (Profile Card, Plural Counter, Gender Select, Notifications) with active ARB messages. Covers this registered template, not every screen in an uploaded app.

R08 • R10 • R38

Key Parity & Placeholder Diagnostics

7 messages

welcomesrc:L4tgt:L3

Source:Welcome, {name}!

Target:¡Bienvenido, {name}!

Matching▼

profileCardsrc:L14tgt:L4

Source:{firstName} {lastName} ({role})

Target:{lastName}, {firstName} ({role})

Reordered (Valid)▼

dontTouchsrc:L29tgt:L5

Source:Don''t touch this item

Target:No toques este elemento

Matching▼

codeSamplesrc:L33tgt:L6

Source:To define a set, write '{'value'}' in Dart.

Target:Para definir un conjunto, escribe '{'valor'}' en Dart.

Matching▼

itemCountsrc:L37tgt:L7

Source:{count, plural, =0{No items} =1{1 item} other{{count} items}}

Target:{count, plural, =0{Ningún artículo} =1{1 artículo} other{{count} artículos}}

Matching▼

genderGreetingsrc:L47tgt:L8

Source:{gender, select, female{Hello Ms. {name}} male{Hello Mr. {name}} other{Hello {name}}}

Target:{gender, select, female{Hola Sra. {name}} male{Hola Sr. {name}} other{Hola {name}}}

Matching▼

notificationssrc:L59tgt:L9

Source:{role, select, admin{{count, plural, =0{Admin: zero alerts} =1{Admin: 1 alert} other{Admin: {count} alerts}}} other{{count, plural, =0{No alerts} other{{count} alerts}}}}

Target:{role, select, admin{{count, plural, =0{Admin: cero alertas} =1{Admin: 1 alerta} other{Admin: {count} alertas}}} other{{count, plural, =0{Sin alertas} other{{count} alertas}}}}

Matching▼

Local Report & Export

Download your analyzed ARB files or an authoritative Markdown diagnostic report for pair programming or CI checks.

Local Privacy & Flutter ICU Subset Guarantees (Release R3 Deliverable)

Validation runs locally in your browser memory using an AST recursive-descent parser. Enforces mandatory other fallback branches on plurals and selects, allows reordered placeholders in translations, and strictly separates screen text direction (LTR vs RTL) from translation quality checks.

Tool Specification: Tasks, Realistic Inputs, Outputs & Local Data Handling

Complete operational details, supported ICU syntax subsets, validation error taxonomies, and local privacy guarantees for the Flutter Localization Helper.

1. Task It Solves & Why It Matters

Internationalizing Flutter apps using flutter gen-l10n requires strict adherence to the Application Resource Bundle (.arb) JSON specification. Common errors — such as missing mandatory other fallback branches on ICU plurals, misspelled placeholder parameters, or mismatched variables between base and translated bundles — break code generation builds and cause runtime crashes.

This tool parses base reference bundles (app_en.arb) and target translations (app_es.arb, app_ar.arb), verifies placeholder variable parity, validates ICU syntax, tests RTL text directionality with live CanvasKit widgets, and non-destructively synthesizes repaired bundles.

2. Realistic Example Inputs & Outputs

Source Input: Reference app_en.arb with plurals ({count, plural, =0{No items} other{{count} items}}) and gender selects ({gender, select, female{...} other{...}}).
Target Input: Translation bundle with reordered placeholder tokens ({lastName}, {firstName}). Validated as legal because natural language word order differs between cultures.
Findings Table: Granular rows with status badges (Matching, Reordered (Valid), Missing Fallback).
Downloads: Client-side downloads for formatted app_en.arb, translated app_[locale].arb, repaired bundles, and Markdown diagnostic reports.

3. Input Validation, Actions & Error States

The validator parses ARB bundles using an in-memory recursive descent parser that validates both standard JSON and nested ICU expressions.

Missing Fallback Error: Omitting the mandatory other branch triggers an immediate red error badge warning that flutter gen-l10n will reject the file.
Unsupported ICU: Flags advanced date/time skeletons or custom currency patterns outside Flutter's official supported ICU subset.
Copy & Download Actions: Direct copy and download actions for both source and target bundles, plus one-click synthesis of clean repaired ARB files.
Reset Action: Clicking Reset in the preset bar restores clean reference EN ↔ ES presets.

4. Limitations & Data Handling

Limitations: Focuses strictly on Flutter's official supported ICU subset (flutter gen-l10n). Does not evaluate dynamic date formatting or runtime locale plural rule databases beyond standard ICU syntax.

Data Handling: All ARB parsing, placeholder comparison, AST tree generation, and repair synthesis runs in client browser memory. The tool itself never sends your ARB files to a server. Like every page on this site, it loads Google AdSense, which uses cookies as described in our privacy policy. Proprietary product copy never leaves your browser.

Flutter Internationalization Architecture: ARB Bundles & Bidirectional Layouts

Building truly global Flutter applications requires more than string substitution. Correctly handling pluralization rules, grammatical genders, and bidirectional mirroring prevents awkward translations and broken layouts.

1. The Application Resource Bundle (ARB) Specification

Flutter standardizes on the ARB format — a localized JSON dialect where each translatable string key is accompanied by an optional metadata key prefixed with an at-sign (@key_name).

The metadata entry declares the translator description and placeholder parameter types (such as int, String, or DateTime). Running flutter gen-l10n reads these ARB files to generate type-safe Dart localization classes (AppLocalizations.of(context)).

2. ICU MessageFormat Plural Categories Across Languages

English has only two plural categories (one and other). However, other languages enforce significantly more complex grammatical rules:

Arabic: Uses 6 plural forms: zero, one, two, few (3–10), many (11–99), and other.
Russian / Polish: Plural rules depend on the last digit (e.g. 21 books vs 22 books vs 25 books).
Mandarin / Japanese: Grammatical numbers do not change based on count; single other branch suffices.
The "other" Rule: The ICU standard requires the other branch in all plurals as a mandatory fallback.

3. RTL Text Directionality & Screen Mirroring

When displaying Right-to-Left (RTL) languages such as Arabic, Hebrew, or Persian, Flutter checks Directionality.of(context).

Hardcoded layout coordinates break RTL screens. Always use directional primitives: replace EdgeInsets.only(left: 16) with EdgeInsetsDirectional.only(start: 16), and use AlignmentDirectional.centerStart instead of Alignment.centerLeft.

4. Production Workflow: l10n.yaml Configuration

Add an l10n.yaml file to your Flutter repository root to automate localization generation during build:

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

Enabling synthetic-package: true ensures localized getters update instantly during development without git pollution.