sliver_stretch_header 0.2.0

A sliver that contains a bottom-aligned box child and a stretchy box background. Use it in a CustomScrollView.

sliver_stretch_header

A sliver that contains a bottom-aligned box child and a stretchy box background.

             /--------------/  --
            /              /   /
           /  background  /   /  
          /              /   /
       /-------------/  /   /  stretchable 
      /    child    /  /   /
     /             /  /   /
    /-------------/  /   /
     /--------------/  --

Features

• Accepts one box widget as child.
• Accepts one box widget as a background.
• No other arguments required besides minBlankExtent.
• Can stretch to fill the over-scroll area when the user over-scrolls.

Getting started

In the pubspec.yaml of your flutter project, add the following dependency:

dependencies:
  ...
  sliver_stretch_header:

In your library add the following import:

import 'package:sliver_stretch_header/sliver_stretch_header.dart';

For help getting started with Flutter, view the online documentation.

Usage

You can place your SliverStretchHeader inside a CustomScrollView, Typically this will be the first or the second sliver in a viewport.

SliverStretchHeader(
  minBlankExtent: 100,    
  background: Container(
                color: Colors.red,
              ),
  child: Container(
          color: Colors.green,
          height: 60,
          child: Center(child: Text("Child Widget")),
         ),
),

You can find more details in the Example project.

Thanks

👏 Thanks to flutter_sticky_header for giving me inspiration and encouragement to work in this project.