前言
在多語言適配的時候,波斯語的顯示是從右到左的,需要針對一些控件進行單獨適配。
核心邏輯:根據語言動態設置 Directionality
Widget build(BuildContext context) {final isRtl = Localizations.localeOf(context).languageCode == 'fa';return Directionality(textDirection: isRtl ? TextDirection.rtl : TextDirection.ltr,child: YourMainWidget(),);
}
結合 MaterialApp 自動判斷 Locale 設置方向
class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(localizationsDelegates: const [GlobalMaterialLocalizations.delegate,GlobalWidgetsLocalizations.delegate,GlobalCupertinoLocalizations.delegate,],supportedLocales: const [Locale('en'),Locale('fa'),],builder: (context, child) {final locale = Localizations.localeOf(context);final isRtl = locale.languageCode == 'fa';return Directionality(textDirection: isRtl ? TextDirection.rtl : TextDirection.ltr,child: child!,);},home: HomePage(),);}
}
控制單個組件方向(局部 RTL / LTR)
你可以按需局部設置 TextField、Text、Row 等的方向:
final isRtl = Localizations.localeOf(context).languageCode == 'fa';TextField(textDirection: isRtl ? TextDirection.rtl : TextDirection.ltr,textAlign: isRtl ? TextAlign.right : TextAlign.left,
)
Row(textDirection: isRtl ? TextDirection.rtl : TextDirection.ltr,children: [...],
)
工具函數封裝建議(便于項目統一處理)
你可以寫一個統一函數判斷是否是 RTL 語言:
bool isRtlLanguage(BuildContext context) {final lang = Localizations.localeOf(context).languageCode;return lang == 'fa' || lang == 'ar' || lang == 'he';
}
特別提示
-
TextAlign.start / TextAlign.end 會自動適配方向,不建議用 TextAlign.left/right。
-
推薦使用AlignmentDirectional,不建議使用Alignment。
-
EdgeInsetsDirectional 自動適配左右方向,推薦代替 EdgeInsets.only(left/right)。
-
自動方向適配依賴于你在 MaterialApp 中設置正確的 locale 和 supportedLocales。
-
推薦使用BorderDirectional,不推薦使用Border。
-
推薦使用BorderRadiusDirection,不推薦使用BorderRadius。