Flutter — Slivers and CustomScrollView

How to achieve fast nested scrolling effects with Slivers?

Today we’re going to talk about how to Slivers. Let’s say we want to display a list view or grid view on the screen, we can easily take advantage of ListView or GridView. But what if we want to show them both on the same page and scroll the screen as one page? Slivers comes to save our lives!

Table of Contents

1. What are Slivers?
2. Know about CustomScrollView and Slivers
3. Basic Slivers introduction

1. What are Slivers?

A sliver is a portion of a scrollable area. You can use slivers to achieve custom scrolling effects.

Like the official document says, a Sliver is one of the portions showing in a scrollable area, which should be CustomScrollView. All the scrollable views in Flutter use Slivers, such as ListView or GridView. Because Slivers are lazily build their views when the widgets come into the viewport, it is really useful to show a great number of children without worrying about memory issues. Moreover, we can easily make lots of fantastic scrolling effects by using the Slivers provided by Flutter.