Using a SliverFillRemaining with a CustomScrollView and SliverList

For anyone that is looking for an answer to this, I have a solution that has been working well whenever I needed something similar.

This is how I’ve managed it:

class ScrollOrFitBottom extends StatelessWidget {
  final Widget scrollableContent;
  final Widget bottomContent;

  ScrollOrFitBottom({this.scrollableContent, this.bottomContent});

  @override
  Widget build(BuildContext context) {
    return CustomScrollView(
      slivers: <Widget>[
        SliverFillRemaining(
          hasScrollBody: false,
          child: Column(
            children: <Widget>[
              Expanded(child: scrollableContent),
              bottomContent
            ],
          ),
        ),
      ],
    );
  }
}

As the name says, it will scroll if there is too much content, or have something pushed to the bottom otherwise.

I think it is simple and self-explanatory, but let me know if you have any questions

Example: https://codepen.io/lazarohcm/pen/xxdWJxb

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)