颤振:sliverAppBar硬编码的最小高度

时间:2019-10-25 13:19:33

标签: flutter dart flutter-layout

enter image description here

我的应用中有CustomScrollView,有两个sliverAppBar和一个SliverList

第一个sliverAppBar用于大徽标。

第二个sliverAppBar停留在第一个{<1}}下方,用于顶部菜单栏。

但是有一个问题-我无法设置第二个sliverAppBar的最小高度。

大徽标和菜单栏之间存在巨大的差距,这打破了应用程序的设计。

我认为此最低高度限制是为了防止状态栏被sliverAppBar重叠(如果pinned: true,因为此额外的填充与系统状态栏高度完全相同。

如果我是对的,则此行为是错误的。没有理由限制sliverAppBar的最小高度,因为当向下滚动列表时,当应用程序栏触摸状态栏时,它可以简单地扩展。

enter image description here

@override
Widget build(BuildContext context) {
  return Scaffold(
    backgroundColor: Colors.blue,
    body: CustomScrollView(
      slivers: <Widget>[
        SliverAppBar( // <-- app bar for logo
          expandedHeight: 120,
          floating: false,
          pinned: false,
          elevation: 0.0,
          backgroundColor: Colors.green,
          brightness: Brightness.light,
          flexibleSpace: SafeArea(child:
            FlexibleSpaceBar(
              background: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Image.asset(
                    'assets/images/user.png',
                    fit: BoxFit.cover,
                    width: 120,
                    height: 120,
                  ),
                ],
              ),
            )
          )
        ),
        SliverAppBar( // <-- app bar for custom sticky menu
          floating: false,
          pinned: true,
          backgroundColor: Colors.yellow,
          brightness: Brightness.light,
          elevation: 0.0,
          expandedHeight: 60.0, // <-- doesn't work for minimum height setup
          flexibleSpace: SafeArea(child:
            Container(
              height: 60.0,
              decoration: BoxDecoration(color: Colors.red),
              child: Padding(
                padding: EdgeInsets.only(left: 15.0, right: 15.0),
                child: CustomMenuBar,
              )
            )
          ),
        ),
        SliverList(
          delegate: SliverChildBuilderDelegate(
            (context, index) {
              return CountryList();
            },
            childCount: widget.europeanCountries.length,
          ),
        ),
      ],
    ),);
  }
}

如何在第二个应用栏中删除多余的填充?

0 个答案:

没有答案