overlap_snapping_sliver 0.0.2 copy "overlap_snapping_sliver: ^0.0.2" to clipboard
overlap_snapping_sliver: ^0.0.2 copied to clipboard

A simple flutter sliver to handle an overlap state when one mobile part moves on static part with snap feature.

A simple widget which consist of two part:

1- Static part: Static part is the fixed (pinned) part which doesn't move on scroll and always stay on top.

2- Mobile part: The mobile part is the movable and scrollable part which moves by scrolling and it may place on static part.

This type of sliver may use on different scenario.

Getting started #

This widget is easy to use. Just use this widget define your staticPart parameter as simple normal widget (Renderbox) and slivers param as list of arbitary slivers (like SliverList or SliverGrid and so on).

Usage #

For example in following code, we create a view that display an image as static part and display a tone of boxes as slivers. With scrolling the slivers move over static part and because some boxes (boxes with even index) are transparent the static part is visible behind that boxes.

    OverlapSliver(
          clipStatic: true,
          slivers: [
            SliverList(
              delegate: SliverChildBuilderDelegate((ctx, idx) {
                final height = 250;
                return Container(
                  height: height.toDouble(),
                  decoration: BoxDecoration(
                    color: idx % 2 == 0
                        ? Colors.transparent
                        : Color.fromRGBO(Random().nextInt(255),
                            Random().nextInt(255), Random().nextInt(255), 1),
                  ),
                  child: Center(child: Text("$idx")),
                );
              }),
            )
          ],
          staticPart: Image.network(
            'https://www.w3schools.com/w3css/img_snowtops.jpg',
            height: 300,
            fit: BoxFit.cover,
          ),
        ),

Additional information #

If you have problem or need some options, send it in github issues. And i will be happy if you want contribute to improve this package and i will name you in contributors section.

Contributors #

1
likes
140
pub points
0%
popularity

Publisher

unverified uploader

A simple flutter sliver to handle an overlap state when one mobile part moves on static part with snap feature.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on overlap_snapping_sliver