flutter appbar 不支持 RTL

问题描述 投票:0回答:1

我正在使用应用程序栏,并且在开头添加了一个图标按钮。 通过使应用程序 RTL,此按钮保留在左侧并且不会出现在右侧。

因为应用程序是多语言的并且应该支持RTL。所有部分都可以工作,但应用栏不行。

// 应用栏

appBar: AppBar(
        // automaticallyImplyLeading: false,
        elevation: 0.5,
        centerTitle: true,
        title: ValueListenableBuilder(
          valueListenable: globals.selectedBarIndex,
          builder: (context, value, Widget? child) {
            return Text(globals.navBarItems[globals.selectedBarIndex.value].text);
          },
        ),
        leading: IconButton(
          onPressed: _handleMenuButtonPressed,
          icon: ValueListenableBuilder<AdvancedDrawerValue>(
            valueListenable: widget.advancedDrawerController,
            builder: (_, value, __) {
              return AnimatedSwitcher(
                duration: const Duration(milliseconds: 250),
                child: Icon(
                  value.visible ? Icons.clear : Icons.menu,
                  key: ValueKey<bool>(value.visible),
                ),
              );
            },
          ),
        ),
      ),

android ios flutter
1个回答
0
投票

要在应用程序的 AppBar 中正确支持 RTL(从右到左)并根据文本方向处理前导 IconButton 的位置,您可以使用 Directionality 小部件。以下是如何修改 AppBar 代码的示例。请检查下面的代码

AppBar(
  elevation: 0.5,
  centerTitle: true,
  title: ValueListenableBuilder(
    valueListenable: globals.selectedBarIndex,
    builder: (context, value, Widget? child) {
      return Text(globals.navBarItems[globals.selectedBarIndex.value].text);
    },
  ),
  leading: Directionality(
    textDirection: TextDirection.rtl, // Set the text direction based on your app's language/locale
    child: IconButton(
      onPressed: _handleMenuButtonPressed,
      icon: ValueListenableBuilder<AdvancedDrawerValue>(
        valueListenable: widget.advancedDrawerController,
        builder: (_, value, __) {
          return AnimatedSwitcher(
            duration: const Duration(milliseconds: 250),
            child: Icon(
              value.visible ? Icons.clear : Icons.menu,
              key: ValueKey<bool>(value.visible),
            ),
          );
        },
      ),
    ),
  ),
),
© www.soinside.com 2019 - 2024. All rights reserved.