Flutter将AppBar返回按钮对齐到右侧。

huangapple go评论51阅读模式
英文:

Flutter align AppBar back button to right side

问题

我在 `MaterialApp` 上使用了 `textDirection: TextDirection.rtl`:

```dart
return const MaterialApp(
      debugShowCheckedModeBanner: false,
      title: appTitle,
      home: Directionality(
        textDirection: TextDirection.rtl,
        child: MyHomePage(title: appTitle),
      ),
    );

所有内容都右对齐,工作得很好,除了 AppBar 的返回按钮。

当你导航到其他页面(具体来说,我在使用 drawer)时,返回按钮会被左对齐而不是右对齐。

Flutter将AppBar返回按钮对齐到右侧。

导航代码:

Navigator.push(
  context,
  MaterialPageRoute(
    builder: (BuildContext context) => const SettingsView(),
  ),
);

"Settings" 页面:

return Scaffold(
      appBar: AppBar(title: Text("Settings"))
    );

如你所见,我没有触及 leading 属性,我以为它应该是自动的...


<details>
<summary>英文:</summary>

I am using `textDirection: TextDirection.rtl` on the `MaterialApp`:

return const MaterialApp(
debugShowCheckedModeBanner: false,
title: appTitle,
home: Directionality(
textDirection: TextDirection.rtl,
child: MyHomePage(title: appTitle),
),
);

Everything is aligned to right and works perfectly, except for the back button of the `AppBar`. 

When you navigate to other pages (specifically I&#39;m using `drawer`) the back button is aligned to the left and not to the right.

[![appbar back button left aligned][1]][1]

Navigation code:

Navigator.push(
context,
MaterialPageRoute(
builder: (BuildContext context) => const SettingsView(),
),
);

&quot;Settings&quot; page:

return Scaffold(
appBar: AppBar(title: Text("Settings"))
);


As you can see I didn&#39;t touch the `leading` property, I thought it should be automatically...

  [1]: https://i.stack.imgur.com/JVJTX.png

</details>


# 答案1
**得分**: 1

```dart
我正在使用`builder`来处理这个。

```dart
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: HomeScreen(),
      builder: (context, child) => Directionality(
        textDirection: TextDirection.rtl,
        child: child ?? const SizedBox.shrink(),
      ),
    );
  }
}

class SettingPage extends StatelessWidget {
  const SettingPage({super.key});

  @override
  Widget build(BuildContext context) {
    print(Directionality.of(context).toString());
    return Scaffold(
      appBar: AppBar(
        title: Text("Settings"),
      ),
    );
  }
}
英文:

I am using builder to handle this.

void main() =&gt; runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: HomeScreen(),
      builder: (context, child) =&gt; Directionality(
        textDirection: TextDirection.rtl,
        child: child ?? const SizedBox.shrink(),
      ),
    );
  }
}

class SettingPage extends StatelessWidget {
  const SettingPage({super.key});

  @override
  Widget build(BuildContext context) {
    print(Directionality.of(context).toString());
    return Scaffold(
      appBar: AppBar(
        title: Text(&quot;Settings&quot;),
      ),
    );
  }
}

huangapple
  • 本文由 发表于 2023年2月13日 22:58:27
  • 转载请务必保留本文链接:https://go.coder-hub.com/75437566.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定