
Kapsamlı Flutter yerelleştirme rehberi
ARB dosyalarından RTL desteğine kadar Flutter uygulamanızı easy_localization ile yerelleştirin, her dilin çoğullarını yönetin ve çevirileri yapay zeka ile otomatikleştirin.
easy_localization'ı yükleyin
easy_localization paketini pubspec.yaml dosyanıza ekleyin. Bu paket; ARB/JSON dosyaları, çoğullar ve bağlam uzantıları desteği sunan en popüler Flutter i18n paketidir. Tarihlerin, sayıların ve metin yönünün yerel ayara uygun biçimlendirilmesi için SDK'daki flutter_localizations paketini de ekleyin.
dependencies:
easy_localization: ^3.0.7
flutter_localizations:
sdk: flutterARB çeviri dosyalarını oluşturun
Application Resource Bundle (ARB) dosyaları, Flutter'ın standart yerelleştirme biçimidir. Her dosya; yer tutucuları, çoğul kurallarını ve çevirmen bağlamını açıklayan isteğe bağlı meta verilerle birlikte anahtar-değer çiftleri içerir. assets/translations klasörünüzde her yerel ayar için bir dosya oluşturun.
{
"@@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"
}
}
}
}Uygulamayı yapılandırın
Uygulamanızı EasyLocalization parçacığıyla sarmalayın. Bu parçacık yerel ayar durumunu yönetir, çevirileri varlık dosyalarınızdan yükler ve MaterialApp'in gereksinim duyduğu yerel ayar temsilcilerini sağlar. Gerekli üç temsilci özelliği localizationsDelegates, supportedLocales ve locale'dir; tümüne bağlam uzantıları aracılığıyla erişebilirsiniz.
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(),
);
}
}Parçacıkları çevirin
Herhangi bir parçacıkta çevrilmiş metni almak için dize anahtarlarında .tr() uzantı yöntemini kullanın. Çoğullar için sayım değeriyle .plural() yöntemini kullanın. easy_localization hem dize uzantısı söz dizimini ('key'.tr()) hem de bağlam yöntemi söz dizimini (context.tr('key')) sağlar.
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)),
],
),
);
}
}Çoğulları ve değişkenleri yönetin
Flutter, çoğullar için iOS, Android ve web tarafından da kullanılan ICU MessageFormat standardını kullanır. ARB dosyalarınızda çoğul biçimlerini {count, plural, ...} söz dizimiyle tanımlayın. Her dil, CLDR çoğul kurallarına göre kendi biçim kümesini gerektirir. Arapçada 6, Rusçada 4, Japoncada 1 biçim vardır.
// 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}));RTL dillerini destekleyin
Yerel ayar sağdan sola yazılan bir dile (Arapça, İbranice, Farsça, Urduca) ait olduğunda Flutter tüm düzeni otomatik olarak yansıtır. Ancak yansıtmanın doğru çalışması için kodunuz yönü dikkate alan parçacıkları ve özellikleri kullanmalıdır. Doğrudan kodlanmış left/right değerlerini start/end eşdeğerleriyle değiştirin.
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 localeAkıllı yerel ayar geri dönüş zincirleri
Varsayılan olarak bir pt-BR çevirisi eksik olduğunda Flutter, kullanılabilir pt-PT çevirilerini atlayarak doğrudan İngilizceye döner. locale_chain paketi, yapılandırılabilir geri dönüş zincirleriyle bu sorunu giderir. Tek satırlık kurulumla ve geçiş gerektirmeden mevcut .tr() çağrılarınız çalışmayı sürdürür.
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
);Çevirileri otomatikleştirin
Yerelleştirme kurulumunuzu tamamladıktan sonra ARB dosyalarınızı yapay zeka kullanarak çevirin. IDE'nizde yapay zeka yardımcınızdan kaynak ARB dosyanızı çevirmesini isteyin veya CI/CD işlem hattınızda i18n Agent CLI'ı kullanın. ARB meta verileri (yer tutucular, açıklamalar) çeviri kalitesini artıran bağlamı sağlar.
# 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,deÇeviri kalitesini otomatikleştirin
Yaygın sorunlar
Çeviri dosyaları çalışma zamanında bulunamıyor
Geçersiz ARB dosyası söz dizimi
Çeviri değişiklikleri hot reload sonrasında görünmüyor
Doğrudan kodlanmış sol/sağ değerleri RTL düzenini bozuyor
Önerilen dosya yapısı
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.yamli18n Agent'ı şimdi deneyin
Çeviri dosyanızı buraya bırakın
JSON, YAML, PO, XML, CSV, Markdown, Properties
veya göz atmak için tıklayın
Hedef diller
locale_chain ile yerel ayar geri dönüşü
pt-BR gibi bölgesel bir yerel ayarda çeviri anahtarı eksik olduğunda Flutter, önce üst yerel ayar pt'yi denetlemek yerine doğrudan şablon diline geçer.
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());Desteklenen çerçevelerin tam listesi ve yerleşik 75 zincir için Yerel Ayar Geri Dönüşü Rehberimize bakın. Learn more →