flutter 如何创建从右到左 (rtl) 应用程序

Question

我使用 GetX 在 Flutter 中启动了一个应用程序。我想创建一个 rtl 应用程序，我使用 flutter_localizations 包作为 .

这是我的 main() 代码

void main() => runApp(
      GetMaterialApp(
        localizationsDelegates: [
          GlobalMaterialLocalizations.delegate,
          GlobalWidgetsLocalizations.delegate,
          GlobalCupertinoLocalizations.delegate,
        ],
        supportedLocales: [
          Locale('fa', 'IR'),
        ],
        locale: Locale('fa', 'IR'),
        home: HomeScreen(),
      ),
    );

这是我的主屏幕代码

return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: Text(
          "Some Text",
          style: TextStyle(
            color: Colors.black,
            fontSize: 20,
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
    );

正如您在这张图片中看到的那样，调试横幅已移至左侧，但文本 steel 位于左侧

Answer 1

使用textDirection属性并设置为TextDirection.rtl

本地文本方向

Text(
  "Some Text",
  textDirection: TextDirection.rtl,
),

全局文本方向

MaterialApp(
      home: Directionality(
        textDirection: TextDirection.rtl, 
        child: UserDetailsScreen(),
      ),
    ),

完整示例：

void main() => runApp(
      MaterialApp(
        home: Directionality(
            // add this
            textDirection: TextDirection.rtl,
            child: HomeScreen()),
      ),
    );

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: Text(
          "ہائے میں فلاں دنیا ہوں !!! امید ہے کہ آپ اچھا کر رہے ہیں۔ کوڈنگ مبارک ہو :)",
          style: TextStyle(
            color: Colors.black,
            fontSize: 20,
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
    );
  }
}

输出：

Answer 2

该应用程序已经是 rtl。只是 safeArea 下的小部件以最小尺寸将小部件放在左侧，我不知道为什么会这样 尝试用一行或一个容器包装您的文本小部件并给出它是一个宽度然后你可以看到默认值现在是在右边而不是左边。

Answer 3

您的应用是正确的 rtl，您的问题是当前 body 小部件，请将其作为 body 小部件进行测试：

body: SafeArea(
  child: Row(
    mainAxisSize: MainAxisSize.max,
    children: [
      Text("Some Text"),
    ],
  ),
),

flutter 如何创建从右到左 (rtl) 应用程序

flutter how to Create right to left (rtl) App

flutter

localization

right-to-left

flutter-getx