Tradurre un’app Flutter sembra più difficile di quanto sia. Flutter include tutto ciò che ti serve. Tieni i testi in file ARB, uno per lingua, e Flutter li trasforma in una classe Dart che richiami dai tuoi widget. Questa guida ti porta da un’app solo in inglese a una che cambia lingua in base alle impostazioni del telefono. Copre anche ciò che spesso si sbaglia: segnaposto, plurali e lingue da destra a sinistra.
1. Aggiungi i pacchetti
In pubspec.yaml, aggiungi il pacchetto di localizzazione di Flutter e intl, e attiva la generazione del codice:
dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
intl: any
flutter:
generate: trueintl: any lascia che Flutter scelga la versione di intl adatta alla tua versione di Flutter, evitando conflitti di versione.
2. Indica a Flutter dove si trovano i testi
Crea l10n.yaml nella cartella principale del progetto:
arb-dir: lib/l10n
template-arb-file: app_en.arb
output-localization-file: app_localizations.dart
nullable-getter: falseIl file modello è la tua lingua di partenza. Tutte le altre lingue seguono le sue chiavi. L’ultima riga, nullable-getter: false, ti evita di aggiungere ! ogni volta che usi un testo.
3. Scrivi il tuo primo file ARB
Crea lib/l10n/app_en.arb:
{
"@@locale": "en",
"homeTitle": "Welcome back",
"@homeTitle": {
"description": "Title on the home screen"
},
"cartItems": "{count, plural, =0{Your cart is empty} =1{1 item in your cart} other{{count} items in your cart}}",
"@cartItems": {
"placeholders": {
"count": { "type": "num" }
}
},
"greeting": "Hello, {name}!",
"@greeting": {
"placeholders": {
"name": { "type": "String" }
}
}
}Alcune abitudini ripagano più avanti:
- Aggiungi una descrizione a ogni chiave. I traduttori, e gli strumenti di traduzione con IA, vedono solo il testo. "Title on the home screen" dice loro che è un titolo breve e non una frase.
- Non costruire mai frasi unendo stringhe.
"Hello, " + namenon si può tradurre, perché molte lingue mettono il nome altrove. Usa un segnaposto. - Usa i plurali, non gli if. L’inglese ha due forme. L’arabo ne ha sei e il polacco quattro. Il formato dei plurali qui sopra (uno standard chiamato ICU) le gestisce tutte. Quando traduci un plurale, usa le forme che servono all’altra lingua (
zero,one,two,few,many,other), non solo=0e=1dell’inglese.
Ora aggiungi una seconda lingua. Crea lib/l10n/app_es.arb con le stesse chiavi:
{
"@@locale": "es",
"homeTitle": "¡Hola de nuevo!",
"cartItems": "{count, plural, =0{Tu carrito está vacío} =1{1 artículo en tu carrito} other{{count} artículos en tu carrito}}",
"greeting": "¡Hola, {name}!"
}Le descrizioni (le voci con @) servono solo nel file modello.
4. Genera il codice e collegalo alla tua app
Esegui flutter pub get o avvia l’app, e Flutter genera il codice per te. Puoi anche eseguire tu flutter gen-l10n. Le versioni recenti di Flutter scrivono app_localizations.dart accanto ai tuoi file ARB. Quelle più vecchie lo mettevano in un pacchetto nascosto, quindi aggiorna Flutter se l’import qui sotto non funziona.
Poi collegalo in MaterialApp:
import 'package:flutter/material.dart';
import 'l10n/app_localizations.dart';
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
home: const HomeScreen(),
);
}
}localizationsDelegates include anche le traduzioni di Flutter per i widget integrati, come il selettore di date e le etichette del pulsante "Indietro".
5. Usa i testi nei tuoi widget
// Inside a widget's build method:
final l10n = AppLocalizations.of(context);
Text(l10n.homeTitle);
Text(l10n.greeting('Sara'));
Text(l10n.cartItems(3)); // "3 items in your cart"Ogni chiave diventa una proprietà o un metodo Dart, quindi un errore di battitura nel nome di una chiave blocca la build invece di mostrare un’etichetta vuota ai tuoi utenti.
Ora l’app segue la lingua del telefono. Per provarla, cambia la lingua nel simulatore o nell’emulatore, oppure forzane una per un momento con locale: const Locale('es') su MaterialApp.
6. Non dimenticare iOS
Su iOS, l’App Store mostra solo le lingue dichiarate dal tuo progetto Xcode. Apri ios/Runner.xcodeproj in Xcode, seleziona il progetto Runner (sotto Projects, non Targets), apri la scheda Info e aggiungi ogni lingua in Localizations. Xcode crea poi alcuni piccoli file che l’App Store usa per mostrare quali lingue supporta la tua app.
7. Le lingue da destra a sinistra funzionano quasi gratis
Quando la lingua è arabo, ebraico o persiano, MaterialApp inverte per te la direzione del layout. Ciò che non può correggere è il codice che dà per scontati sinistra e destra:
- Usa
EdgeInsetsDirectional.only(start: 16)invece diEdgeInsets.only(left: 16). - Usa
AlignmentDirectional.centerStartinvece diAlignment.centerLeft. - Rispecchia le icone a freccia che puntano "avanti". Le frecce comuni avanti e indietro, come
Icons.arrow_back, si girano già da sole, quindi controlla ogni altra freccia che usi. Icone come un telefono o una fotocamera non vanno rispecchiate.
Prova presto con una vera lingua da destra a sinistra. Inoltre il testo tedesco è spesso molto più lungo dell’inglese e l’arabo richiede più altezza di riga, quindi controlla che i pulsanti non trabocchino.
8. Tieni sincronizzate le traduzioni mentre l’app cresce
I passaggi qui sopra sono la parte facile. Quella difficile comincia con la release successiva, quando aggiungi dodici chiavi, ne modifichi tre e ti servono in tutte le lingue prima di pubblicare. I modi più comuni per gestirla:
- Modificare i file ARB a mano. Va bene per una o due lingue e un’app piccola. Non regge più quando traduce qualcun altro o dimentichi quali chiavi sono cambiate.
- Mandare i file a un traduttore. Esporti
app_en.arb, ricevi le traduzioni e le incolli. Funziona, ma è lento, e devi tenere traccia di cosa è cambiato dall’ultima volta. - Usare uno strumento di gestione delle traduzioni. Carichi il tuo file inglese, traduci le nuove chiavi (a mano, con l’IA o entrambe) e poi scarichi le altre lingue.
litei18n è uno di questi strumenti, pensato per i team piccoli. Puoi importare ed esportare file ARB (nei piani a pagamento, da 9 $ al mese; il piano gratuito funziona con JSON), tradurre con l’IA le chiavi mancanti e rivedere le modifiche prima che vengano pubblicate. litei18n legge la descrizione di ogni nuova chiave dal tuo file ARB e riscrive le descrizioni quando scarichi, così traduttori e IA le vedono. I file scaricati hanno i nomi che Flutter si aspetta, per esempio app_es.arb. Per cambiare una descrizione in seguito, modificala in litei18n, perché ricaricare il file non la aggiorna. Non conserva ancora le impostazioni dei segnaposto, quindi tieni il tuo app_en.arb come sorgente e scarica solo le altre lingue. Se lavori con un assistente di programmazione con IA come Claude o Cursor, può anche aggiungere e tradurre chiavi per te tramite la connessione MCP di litei18n, che permette agli strumenti di IA di lavorare direttamente in litei18n.
9. Aggiornare i testi senza una nuova release dell’app
Flutter compila i file ARB dentro la tua app. Questo significa che correggere un errore in tedesco, o aggiungere una lingua, di solito richiede una nuova build e una revisione su App Store e Google Play.
Se per te è un problema, puoi caricare le traduzioni in fase di esecuzione. Tieni una copia inclusa nell’app per l’uso offline e il primo avvio, poi scarica l’ultima versione da un server all’avvio dell’app. La nostra guida agli aggiornamenti over-the-air per Flutter mostra il codice completo. Sono circa 30 righe e usa una sua piccola classe al posto di AppLocalizations. Questo approccio più semplice gestisce solo testo semplice: segnaposto e plurali richiedono codice in più, quindi è adatto alle app con testi per lo più semplici. Con litei18n, gli aggiornamenti over-the-air sono nei piani a pagamento.
Checklist rapida
flutter_localizationseintlaggiunti, congenerate: truel10n.yamlpunta alla cartella ARB e al modello- Ogni chiave ha una descrizione
- Segnaposto e plurali invece di stringhe unite
- Ogni lingua aggiunta in Localizations in Xcode
- Margini e allineamenti direzionali per le lingue da destra a sinistra
- Un piano per tenere tradotte le nuove chiavi
Non serve altro per far parlare un’app Flutter in più di una lingua. Inizia con una lingua in più. Quando la configurazione funziona, aggiungere la successiva è solo un altro file ARB.
Vuoi gestire i tuoi file ARB in un unico posto e tradurre le nuove chiavi con l’IA? Inizia gratis con litei18n.