Flutter i18n: Un Solo Codebase, Ogni Lingua, Ogni Piattaforma
Flutter utilizza i file ARB (Application Resource Bundle) e il pacchetto intl per gestire la localizzazione su iOS, Android, web e desktop da un unico codebase. Lo strumento gen-l10n genera codice Dart type-safe dai vostri template ARB, offrendo sicurezza in fase di compilazione e completamento automatico nell'IDE per ogni chiave di traduzione.
Get started in 4 steps
Enable generation
Add the generate flag to your pubspec.yaml to enable localization code generation.
# pubspec.yaml
dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
intl: any
flutter:
generate: trueConfigure l10n.yaml
Create l10n.yaml in your project root to configure the localization generator.
# l10n.yaml arb-dir: lib/l10n template-arb-file: app_en.arb output-localization-file: app_localizations.dart
Create ARB template
Add your source language ARB file with translation keys and metadata.
{
"@@locale": "en",
"welcome": "Welcome to {appName}",
"@welcome": {
"placeholders": {
"appName": { "type": "String" }
}
},
"itemCount": "{count, plural, =0{No items} =1{1 item} other{{count} items}}",
"@itemCount": {
"placeholders": {
"count": { "type": "int" }
}
}
}Use in your app
Wrap your app with localization delegates and use AppLocalizations.of(context) in widgets.
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context)!;
return Text(l10n.welcome('Flutter'));
}
}Funzionalità di Localizzazione Flutter
La localizzazione di Flutter nella pratica
Utilizzate AppLocalizations.of(context) per accedere ai metodi di traduzione generati nei vostri widget, con supporto completo per la pluralizzazione e la formattazione delle date.
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
class ProductPage extends StatelessWidget {
final int itemCount;
const ProductPage({required this.itemCount});
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context)!;
return Column(
children: [
Text(l10n.welcome('My Store')),
Text(l10n.itemCount(itemCount)),
// Date formatting respects locale
Text(DateFormat.yMMMd(
Localizations.localeOf(context).toString()
).format(DateTime.now())),
],
);
}
}Guide Correlate
Android Localization
Confrontate la localizzazione Flutter con i pattern nativi Android strings.xml e i qualificatori di risorse.
iOS Localization
Scoprite come iOS gestisce la localizzazione con String Catalogs e SwiftUI per un confronto specifico alla piattaforma.
Confronto TMS
Confrontate le piattaforme di gestione delle traduzioni per trovare la soluzione più adatta al vostro progetto Flutter.
Semplifica Oggi la Localizzazione Flutter
Gestite le vostre traduzioni ARB con flussi di lavoro basati sull'intelligenza artificiale, la sincronizzazione CLI con il vostro progetto Flutter e la distribuzione via CDN in meno di 50ms.