
Celovit vodnik po lokalizaciji Flutterja
Od datotek ARB do podpore za RTL: lokalizirajte svojo aplikacijo Flutter z easy_localization, obravnavajte množinske oblike za vse jezike in avtomatizirajte prevode z umetno inteligenco.
Namestite easy_localization
Dodajte paket easy_localization v datoteko pubspec.yaml. To je najbolj priljubljen paket Flutter za i18n s podporo za datoteke ARB/JSON, množinske oblike in razširitve konteksta. Iz kompleta SDK dodajte tudi flutter_localizations za oblikovanje datumov in števil glede na področne nastavitve ter ustrezno smer besedila.
dependencies:
easy_localization: ^3.0.7
flutter_localizations:
sdk: flutterUstvarite prevodne datoteke ARB
Datoteke Application Resource Bundle (ARB) so standardna oblika zapisa za lokalizacijo Flutterja. Vsaka datoteka vsebuje pare ključ–vrednost in neobvezne metapodatke, ki opisujejo označbe mest, množinska pravila ter kontekst za prevajalce. V imeniku assets/translations ustvarite po eno datoteko za vsako področno nastavitev.
{
"@@locale": "en",
"appTitle": "My App",
"@appTitle": {
"description": "The title of the application"
},
"greeting": "Hello, {name}!",
"@greeting": {
"description": "Greeting with user name",
"placeholders": {
"name": {
"type": "String",
"example": "Alice"
}
}
},
"itemCount": "{count, plural, =0{No items} =1{1 item} other{{count} items}}",
"@itemCount": {
"description": "Number of items in the cart",
"placeholders": {
"count": {
"type": "num",
"format": "compact"
}
}
}
}Konfigurirajte aplikacijo
Aplikacijo ovijte z gradnikom EasyLocalization. Ta upravlja stanje področne nastavitve, nalaga prevode iz datotek virov in zagotavlja delegate področnih nastavitev, ki jih potrebuje MaterialApp. Tri obvezne lastnosti delegatov so localizationsDelegates, supportedLocales in locale — vse so na voljo prek razširitev konteksta.
import 'package:flutter/material.dart';
import 'package:easy_localization/easy_localization.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await EasyLocalization.ensureInitialized();
runApp(
EasyLocalization(
supportedLocales: [
Locale('en'),
Locale('ar'),
Locale('ja'),
Locale('de'),
],
path: 'assets/translations', // Path to your ARB/JSON files
fallbackLocale: Locale('en'),
child: MyApp(),
),
);
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
localizationsDelegates: context.localizationDelegates,
supportedLocales: context.supportedLocales,
locale: context.locale,
home: HomePage(),
);
}
}Prevedite gradnike
Za pridobivanje prevedenega besedila v katerem koli gradniku uporabite razširitveno metodo .tr() na ključih nizov. Za množinske oblike uporabite .plural() z vrednostjo števila. easy_localization ponuja tako skladnjo razširitve niza ('key'.tr()) kot skladnjo metode konteksta (context.tr('key')).
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('appTitle'.tr()), // Simple key
),
body: Column(
children: [
// String with variable interpolation
Text('greeting'.tr(args: ['Alice'])),
// Named arguments
Text('greeting'.tr(namedArgs: {'name': 'Alice'})),
// Plural form
Text('itemCount'.plural(3)),
],
),
);
}
}Obravnavajte množinske oblike in spremenljivke
Flutter za množinske oblike uporablja ICU MessageFormat — isti standard kot iOS, Android in splet. Množinske oblike v datotekah ARB določite s skladnjo {count, plural, ...}. Vsak jezik potrebuje lasten nabor oblik na podlagi množinskih pravil CLDR. Arabščina ima 6 oblik, ruščina 4, japonščina pa 1.
// English: 3 useful forms (=0, =1, other)
"itemCount": "{count, plural, =0{No items} =1{1 item} other{{count} items}}"
// Arabic: 6 forms (=0, =1, =2, few, many, other)
"itemCount": "{count, plural, =0{لا عناصر} =1{عنصر واحد} =2{عنصران} few{{count} عناصر} many{{count} عنصرًا} other{{count} عنصر}}"
// Japanese: 1 form (other)
"itemCount": "{count, plural, other{{count}個のアイテム}}"
// German: 2 forms (=1, other)
"itemCount": "{count, plural, =1{1 Artikel} other{{count} Artikel}}"
// Russian: 3 forms (one, few, many)
"itemCount": "{count, plural, =0{Нет товаров} one{{count} товар} few{{count} товара} many{{count} товаров} other{{count} товаров}}"// Simple variable
"welcome": "Welcome, {name}!"
// Multiple variables
"orderStatus": "Order #{orderId} — {status}"
// Variable in plural context
"unreadMessages": "{count, plural, =0{No unread messages} =1{1 unread message from {sender}} other{{count} unread messages}}"
// In widgets:
Text('welcome'.tr(namedArgs: {'name': userName}));
Text('orderStatus'.tr(namedArgs: {'orderId': '1234', 'status': 'Shipped'}));
Text('unreadMessages'.plural(count, namedArgs: {'sender': senderName}));Podprite jezike RTL
Flutter samodejno prezrcali celotno postavitev, kadar je področno nastavljen jezik pisan od desne proti levi (arabščina, hebrejščina, perzijščina ali urdujščina). Vendar mora Vaša koda uporabljati gradnike in lastnosti, ki upoštevajo smer, da prezrcaljenje deluje pravilno. Neposredno določeni levi/desni položaj zamenjajte z ustreznikoma začetek/konec.
import 'package:flutter/material.dart';
class AdaptiveLayout extends StatelessWidget {
@override
Widget build(BuildContext context) {
final isRtl = Directionality.of(context) == TextDirection.rtl;
return Scaffold(
body: Row(
children: [
// Use start/end instead of left/right
Expanded(
child: Padding(
padding: EdgeInsetsDirectional.only(
start: 16.0, // Leading edge (left in LTR, right in RTL)
end: 8.0, // Trailing edge
),
child: Text('content'.tr()),
),
),
// Flip icons for RTL
Icon(
isRtl ? Icons.arrow_back : Icons.arrow_forward,
),
],
),
);
}
}// Use Directional widgets for RTL-aware layouts
EdgeInsetsDirectional.only(start: 16, end: 8) // Not EdgeInsets.only(left: 16, right: 8)
AlignmentDirectional.centerStart // Not Alignment.centerLeft
BorderRadiusDirectional.only(topStart: Radius.circular(8))
// Automatically mirrors when locale changes to Arabic, Hebrew, etc.
// No conditional logic needed — Flutter handles text direction from localePametne verige nadomestnih področnih nastavitev
Ko prevod pt-BR manjka, Flutter privzeto preklopi neposredno na angleščino — pri tem pa preskoči povsem ustrezne prevode pt-PT. Paket locale_chain to odpravi z nastavljivimi verigami nadomestnih področnih nastavitev. Potrebujete eno vrstico za nastavitev in nobene selitve — Vaši obstoječi klici .tr() preprosto delujejo.
import 'package:locale_chain/locale_chain.dart';
import 'package:locale_chain/easy_localization.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await EasyLocalization.ensureInitialized();
LocaleChain.configure(); // Enable smart fallback chains
runApp(
EasyLocalization(
supportedLocales: [
Locale('en'),
Locale('pt', 'BR'),
Locale('pt', 'PT'),
Locale('es'),
Locale('es', 'MX'),
],
path: 'assets/translations',
assetLoader: LocaleChainAssetLoader( // Swap in the chain loader
baseLoader: RootBundleAssetLoader(),
),
fallbackLocale: Locale('en'),
child: MyApp(),
),
);
}
// Result: pt-BR user sees pt-PT translations when pt-BR keys are missing,
// instead of falling back directly to English.// Override specific chains while keeping built-in defaults
LocaleChain.configure(
fallbacks: {
'pt-BR': ['pt-PT', 'pt'], // pt-BR → pt-PT → pt → en
'es-MX': ['es-419', 'es'], // es-MX → es-419 → es → en
'fr-CA': ['fr'], // fr-CA → fr → en
},
);
// Or replace all defaults with your own chains
LocaleChain.configure(
fallbacks: {
'zh-Hant-HK': ['zh-Hant-TW', 'zh-Hans'],
'pt-BR': ['pt-PT', 'pt'],
},
mergeDefaults: false, // Only your chains, no built-in defaults
);Avtomatizirajte prevode
Ko je nastavitev lokalizacije dokončana, prevedite datoteke ARB z umetno inteligenco. V svojem integriranem razvojnem okolju prosite pomočnika z umetno inteligenco, naj prevede izvorno datoteko ARB, ali pa v cevovodu CI/CD uporabite vmesnik ukazne vrstice i18n Agent. Metapodatki ARB (označbe mest in opisi) zagotavljajo kontekst, ki izboljša kakovost prevodov.
# In your IDE, ask your AI assistant:
> Translate assets/translations/en.arb to Arabic, Japanese, and German
✓ ar.arb created (1.4s)
✓ ja.arb created (1.2s)
✓ de.arb created (1.1s)
# Or use the CLI in CI/CD:
npx i18n-agent translate assets/translations/en.arb --lang ar,ja,deAvtomatizirajte zagotavljanje kakovosti prevodov
Pogoste pasti
Prevodnih datotek med izvajanjem ni mogoče najti
Neveljavna skladnja datoteke ARB
Spremembe prevodov se po vročem ponovnem nalaganju ne prikažejo
Neposredno določena leva/desna stran pokvari RTL
Priporočena struktura datotek
my_flutter_app/
├── assets/
│ └── translations/
│ ├── en.arb # Source language (English)
│ ├── ar.arb # Arabic (with 6 plural forms)
│ ├── de.arb # German
│ ├── ja.arb # Japanese
│ ├── pt-BR.arb # Brazilian Portuguese
│ └── pt-PT.arb # European Portuguese
├── lib/
│ ├── main.dart # App entry with EasyLocalization
│ ├── app.dart # MaterialApp with locale delegates
│ └── widgets/
│ └── language_switcher.dart
├── pubspec.yaml # Dependencies
└── analysis_options.yamlPreizkusite i18n Agent zdaj
Spustite prevajalsko datoteko sem
JSON, YAML, PO, XML, CSV, Markdown, Properties
ali kliknite za izbiro
Ciljni jeziki
Nadomestne področne nastavitve z locale_chain
Ko v regionalni področni nastavitvi, kot je pt-BR, manjka prevodni ključ, Flutter preklopi neposredno na jezik predloge, namesto da bi najprej preveril nadrejeno področno nastavitev pt.
flutter pub add locale_chainimport 'package:locale_chain/locale_chain.dart';
LocaleChain.configure(fallbacks: {
'pt-BR': ['pt', 'en'],
'zh-Hant-HK': ['zh-Hant', 'zh', 'en'],
});
LocaleChainAssetLoader(baseLoader: RootBundleAssetLoader());V našem vodniku po nadomestnih področnih nastavitvah si oglejte celoten seznam podprtih ogrodij in 75 vgrajenih verig. Learn more →