Why is SliverFillRemaining expanding too much?

Question

I'm trying to make a SliverAppBar that reacts to its height, showing different things depending if it's expanded or not.

I've based it on https://medium.com/flutter-community/flutter-sliverappbar-snap-those-headers-544e097248c0, but I'm having an issue:

The empty space at the end of the list is way too long.

Removing SliverFillRemaining is not necessary if the number of items is high, but changing the numberOfItems to e.g. 3 items (instead of 30), the SliverFillRemaining is necessary.

Check out this dartpad for the code: https://dartpad.dev/2c434ddf2d4d1e87bd4b421f0a673c2d

      CustomScrollView(
        physics: AlwaysScrollableScrollPhysics(),
        controller: _controller,
        slivers: [
          SliverAppBar(
            pinned: true,
            backgroundColor: Colors.grey[100],
            stretch: true,
            automaticallyImplyLeading: false,
            flexibleSpace: Header(
              maxHeight: maxHeight,
              minHeight: minHeight,
            ),
            collapsedHeight: minimizedHeight,
            expandedHeight: maxHeight - MediaQuery.of(context).padding.top,
          ),
          SliverList(
            delegate: SliverChildBuilderDelegate(
              (context, index) {
                return _buildCard(index);
              },
              childCount: numberOfItems,
            ),
          ),
          SliverFillRemaining(
              hasScrollBody: true), // ** <-- this will add space, but too much **
        ],
      ),

Answer 1

if you are just adding a certain height of space, i suggest you use SliverToBoxAdapter:

SliverToBoxAdapter(
  child: SizedBox(
    height: 50,
  ),
),

Answer 2

make the hasScrollBody value to be false like this:

     SliverFillRemaining(
        hasScrollBody: false
     ),

Answer 3

This Package does exactly what you are expecting, I've been trying for days now,and finally used this, Its works the same way as the SliverToBoxAdapter but extends enough and does not cause over scroll

  CustomScrollView(
    physics: AlwaysScrollableScrollPhysics(),
    controller: _controller,
    slivers: [
      SliverAppBar(
        pinned: true,
        backgroundColor: Colors.grey[100],
        stretch: true,
        automaticallyImplyLeading: false,
        flexibleSpace: Header(
          maxHeight: maxHeight,
          minHeight: minHeight,
        ),
        collapsedHeight: minimizedHeight,
        expandedHeight: maxHeight - MediaQuery.of(context).padding.top,
      ),
      SliverList(
        delegate: SliverChildBuilderDelegate(
          (context, index) {
            return _buildCard(index);
          },
          childCount: numberOfItems,
        ),
      ),
      SliverFillRemainingBoxAdapter(
          child: // Your content goes here), 
    ],
  ),