CupertinoTabBar 阻止当前 Tab 底部部分如何避免这种情况还是默认行为

cip*_*nat 3 dart flutter flutter-layout

我改变了我BottomNavigatorBarCupertinoTabBar,它不会压缩当前的Tab

换句话说,我将无法显示当前选项卡底部的一些信息,因为CupertinoTabBar它会阻止它。

我不知道这是Cupertino样式的默认行为,但我需要解决它。我尝试用CupertinoTabView和/或包装我的页面CupertinoPageScaffold,两者都不起作用。

你有什么建议吗?

在此处输入图片说明 在此处输入图片说明

这是我的相关代码:

    return CupertinoTabScaffold(
      tabBar: CupertinoTabBar(currentIndex: 2, items: [
        BottomNavigationBarItem(
            icon: Icon(Icons.explore), title: Text('Explore')),
        BottomNavigationBarItem(
            icon: Icon(Icons.card_travel), title: Text('Adventure')),
        BottomNavigationBarItem(
            icon: Icon(Icons.search), title: Text('Search')),
        BottomNavigationBarItem(
            icon: Icon(Icons.map), title: Text('Create Tour')),
        BottomNavigationBarItem(
            icon: Icon(Icons.person), title: Text('Profile')),
      ]),
      tabBuilder: (context, index) {
        switch (index) {
          case 0:
            return CupertinoTabView(
              builder: (context) => ExplorePage(),
            );
            break;
          case 1:
            return AdventurePage();
            break;
          case 2:
            return CupertinoTabView(
              builder: (context) => SearchTourPage(),
            );
            break;
          case 3:
            return BasicRouteInfoForm();
            break;
          case 4:
            return ProfilePage();
            break;
          default:
            return SearchTourPage();
        }
      },
    );

Run Code Online (Sandbox Code Playgroud)

jib*_*iel 6

只提供backgroundColor不透明的,即不透明度为 1.0(不透明度默认小于 1.0):

return CupertinoTabScaffold(
  tabBar: CupertinoTabBar(
    backgroundColor: CupertinoTheme.of(context).barBackgroundColor.withOpacity(1.0),
    items: const <BottomNavigationBarItem>[
      BottomNavigationBarItem(
 // ...
Run Code Online (Sandbox Code Playgroud)

它实现与以下相同的逻辑CupertinoNavigationBar

如果是半透明的,则主要内容可能会在其后面滑动。否则,主要内容的上边距将被其高度偏移。

文件是不是这个很清楚,可能是因为这是Cupertino的导航控件(共同逻辑CupertinoTabBarCupertinoNavigationBar至少),被认为是直观的。

看起来这个方法会影响主要内容和标签栏的定位:

/// Indicates whether the tab bar is fully opaque or can have contents behind
/// it show through it.
bool opaque(BuildContext context) {
  final Color backgroundColor =
      this.backgroundColor ?? CupertinoTheme.of(context).barBackgroundColor;
  return CupertinoDynamicColor.resolve(backgroundColor, context).alpha == 0xFF;
}
Run Code Online (Sandbox Code Playgroud)