Flutter：禁用sliverAppBar填充动画

Question

我想将自定义菜单栏（全角）附加到sliverAppBar小部件，以使其贴在sliverAppBar背景的底部并且始终可见。

为解决此问题，我将Row小部件放入了FlexibleSpaceBar.title参数中，但是现在我遇到了一个意外问题。

当我将FlexibleSpaceBar.title参数中的内容包装到Row小部件中时，它开始为溢出的填充设置动画。它还将Row小部件扩展到屏幕边界之外。那是意想不到的行为。

我不想在SliverList滚动条上缩小标题填充或调整标题大小。

SliverAppBar(
  expandedHeight: 200.0,
  floating: false,
  pinned: true,
  elevation: 0.0,
  flexibleSpace: SafeArea(child: // <-- SafeArea doesn't work for FlexibleSpaceBar.title in this case
    FlexibleSpaceBar(
      background: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Image.asset(
            'assets/images/store.png',
            fit: BoxFit.cover,
            width: 120,
            height: 120,
          ),
        ],
      ),
      collapseMode: CollapseMode.none,
      titlePadding: EdgeInsetsDirectional.only(start: 100, bottom: 0), // <-- have to add 100 to padding to keep in safe area on the screen
      title: Row( // <-- animation enables by default if wrapped in a Row widget
        children: [
          Icon(Icons.menu, size: 40, color: Colors.white,),
        ]
      )
    )
  )
),

如何在sliverAppBar中为FlexibleSpaceBar标题禁用这种收缩，大小和动画？

Answer 1

我刚刚通过添加一个sliverAppBar而不是为此目的而使用FlexibleSpaceBar.title来解决了这个问题。

SliverAppBar( // <-- just hiding logo
  expandedHeight: 200.0,
  floating: false,
  pinned: true,
  elevation: 0.0,
  flexibleSpace: SafeArea(child:
    FlexibleSpaceBar(
      background: Row(
        mainAxisAlignment: MainAxisAlignment.center,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Image.asset(
            'assets/images/store.png',
            fit: BoxFit.cover,
            width: 120,
            height: 120,
          ),
        ],
      ),
    )
  )
),
SliverAppBar( // <-- custom sticky menu bar
  floating: false,
  pinned: true,
  elevation: 0.0,
  flexibleSpace: SafeArea(child:
    FlexibleSpaceBar(
      ...
    )
  )
),