in ,

Flutter Sticky Headers into any scrollable content

Flutter Sticky Headers

With the popularity of social media, scrolling has become a must-have feature for discovery interfaces. When the user searches for something specific, they are able to browse through a large number of items to find the one thing they like. People visit sites for content first, with everything else secondary. And scrolling helps people access the content they need. To develop this function, Flutter Sticky headers into any scrollable content allows you to place headers on scrollable content that will stick to the top of the container whilst the content is scrolled.


The first step for you.

You can place a StickyHeader or StickyHeaderBuilder
inside any scrollable content, such as: ListViewGridViewCustomScrollView,
SingleChildScrollView or similar.

Depend on it:

  sticky_headers: "^0.1.7"

Import it:

import 'package:sticky_headers/sticky_headers.dart';

Use it:

class Example extends StatelessWidget {
  Widget build(BuildContext context) {
    return new ListView.builder(itemBuilder: (context, index) {
      return new StickyHeader(
        header: new Container(
          height: 50.0,
          color: Colors.blueGrey[700],
          padding: new EdgeInsets.symmetric(horizontal: 16.0),
          alignment: Alignment.centerLeft,
          child: new Text('Header #$index',
            style: const TextStyle(color: Colors.white),
        content: new Container(
          child: new, fit: BoxFit.cover,
            width: double.infinity, height: 200.0),


Here are some particular examples displayed to you.

Example 1 – Headers and Content


Example 2 – Animated Headers with Content


Example 3 – Headers overlapping the Content



Finally, if you run into any issues, please submit a support ticket. Please submit a ticket on Github if you believe the library is lacking a feature, and I’ll investigate.
All requests are also welcome, requests for a pull are also appreciated.


Written by James

Display simple blurry dialog popup for flutter

ListView with items that can be scrolled infinitely in both directions