iOS 上底部导航栏浮动

Question

当我在 iOS 上运行 Flutter 应用程序时，我的底部导航格式错误。好像漂浮着：

我的脚手架看起来像这样：

Scaffold(
  appBar: getAppbar(),
  drawer: getMainDrawer(context),
  floatingActionButton: ...,
  floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
  body: SafeArea(
    top: false,
    bottom: false,
    child: _widgetOptions.elementAt(_selectedIndex),
  ),
  extendBody: true,
  bottomNavigationBar: buildBottomNavigationBar())

我的底部导航如下所示：

Widget buildBottomNavigationBar() {
  return BottomAppBar(
    key: const Key('bottomAppBar'),
    shape: const CircularNotchedRectangle(),
    elevation: 4,
    notchMargin: 8,
    clipBehavior: Clip.antiAlias,
    child: BottomNavigationBar(
      showUnselectedLabels: false,
      showSelectedLabels: false,
      items: const <BottomNavigationBarItem>[
        BottomNavigationBarItem(
          icon: FaIcon(FontAwesomeIcons.dumbbell),
          label: 'Sets',
        ),
        BottomNavigationBarItem(
          icon: FaIcon(FontAwesomeIcons.calendar),
          label: 'Timeline',
        ),
      ],
      currentIndex: _selectedIndex,
      onTap: _onItemTapped,
    ),
  );
}

请注意，底部导航在 Android 上看起来不错。有谁知道iOS上出现这个问题的原因是什么？

Answer 1

像这样删除

BottomAppBar

Widget buildBottomNavigationBar() {
    return BottomNavigationBar(
      showUnselectedLabels: false,
      showSelectedLabels: false,
      items: const <BottomNavigationBarItem>[
        BottomNavigationBarItem(
          icon: Icon(Icons.abc),
          label: 'Sets',
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.abc),
          label: 'Timeline',
        ),
      ],
      currentIndex: _selectedIndex,
      onTap: _onItemTapped(),
    );
  }