sticky_web_scroll 0.0.2 icon indicating copy to clipboard operation
sticky_web_scroll: ^0.0.2 copied to clipboard

A wrapper to NestedScrollView to enable flexible web scroll and awesome appbars.

sticky_web_scroll #

Use this package if you need more customization on your web scroll displays.

See the install instructions.

Quick reference #

Since customization requires a lot of properties, here is a quick cheatsheet:

PropertyWhat does it do
landingTakes the 5% of the screen height(Customizable), collasp when scrolled vertically.
bodyThe body of the main content.
landingHeightThe height of the landing to stickyAppbar point.
sideNavSide widget(optional).
stickyAppBarImmediate below landing,(Customizable) stick to top when landing collasp .
stickyHeightstickyAppBar, stickyAppBar height.(stickyHeight must not be greater than height of landingHeight)

We are on YouTube! #

You can see a video tutorial here. 1.Awesome Flutter Tutorials tutorial by Flutter Developer's Core

To use this package :

  dependencies:
    flutter:
      sdk: flutter
    sticky_web_scroll: 

Getting Started #

The examples below were updated for version 0.0.1. Changes might have been made. See the changelog.

Screenshot #

sticky_web_scroll Animated

A basic Sticky-Web-Scroll #


class HomePage extends StatelessWidget {
  const HomePage({
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: StickyWebScroll(
        landingHeight: 400,
        stickyHeight: 80,
        landing: Container(
          decoration: BoxDecoration(
            image: DecorationImage(
                image: NetworkImage(
                    'https://images.unsplash.com/photo-1489843704329-b420d20a0b43?ixid=MXwxMjA3fDB8MHxjb2xsZWN0aW9uLXBhZ2V8MXwyMzA0MDE1fHxlbnwwfHx8&ixlib=rb-1.2.1&w=1000&q=80'),
                fit: BoxFit.cover),
          ),
        ),
        stickyAppBar: Container(
          color: Colors.blue,
          width: MediaQuery.of(context).size.width,
          child: Center(
            child: Text('Stick Web Scroll - by Flutter Devs Core',
                style: Theme.of(context).textTheme.headline4),
          ),
        ),
        body: SingleChildScrollView(
          physics: NeverScrollableScrollPhysics(),
          child: Container(
            color: Colors.white,
            width: MediaQuery.of(context).size.width,
            child: Column(
              children: List.generate(
                100,
                (index) => Container(
                  height: 500,
                  width: 500,
                  color: Colors
                      .primaries[Random().nextInt(Colors.primaries.length)],
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

3
likes
110
pub points
57%
popularity

Publisher

unverified uploader

A wrapper to NestedScrollView to enable flexible web scroll and awesome appbars.

Homepage

Documentation

API reference

License

Icon for licenses.MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on sticky_web_scroll