scroll_app_bar_fork_height

Description:

scroll app bar fork height

ScrollAppBar #
Hide or show app bar while scrolling. This package works without custom scroll views and slivers. So, you can use this widget in a scaffold widget, that turns your code more simple.



Simple scroll
Snap behavior









Roadmap #
This is currently our roadmap, please feel free to request additions/changes.



Feature
Progress




Simple scroll
✅


Snap behavior
✅


Pin/unpin
✅


Gradient background
✅


Transparent background
✅




NOTE: Try use this package with scroll_bottom_navigation_bar package to a better user experience. See an example.

Usage #
Getting started #
Add scroll_app_bar_fork_height package to your project.
Basic implementation #
First, you need a ScrollController instance.
final controller = ScrollController();
copied to clipboard
This controller is required in order to get the main functionality of this package.
You need to pass it on ScrollAppBar's controller and inside your ListView, also in
controller property. Without this, you'll get an ordinary App Bar.
Now, you can use the ScrollAppBar widget in a Scaffold widget, and attach ScrollController instance in your scrollable main widget.

NOTE: Showing only essencial code. See example section to a complete implementation.

@override
Widget build(BuildContext context) {
Scaffold(
appBar: ScrollAppBar(
controller: controller, // Note the controller here
title: Text("App Bar"),
height: 100 // default kToolbarHeight
),
body: ListView.builder(
controller: controller, // Controller is also here
itemBuilder: ...,
),
);
}
copied to clipboard
Snap behavior #
To enable the snap behavior, you need just wrap the main scrollable widget with a Snap widget and attach controller.
@override
Widget build(BuildContext context) {
Scaffold(
appBar: ScrollAppBar(
controller: controller, // Note the controller here
title: Text("App Bar"),
height: 100 // default kToolbarHeight
),
body: Snap(
controller: controller.appBar,
child: ListView.builder(
controller: controller, // Controller is also here
itemBuilder: ...,
),
),
);
}
copied to clipboard
Example #
See a complete example.
API Reference #
// Returns the total height of the bar
controller.appBar.height;

// Notifier of the visible height factor of bar
controller.appBar.heightNotifier;

// Notifier of the pin state changes
controller.appBar.isPinned;

// Returns [true] if the bar is pinned or [false] if the bar is not pinned
controller.appBar.pinNotifier;

// Set a new pin state
controller.appBar.setPinState(state);

// Toogle the pin state
controller.appBar.tooglePinState();

// Discards resource
controller.appBar.dispose();
copied to clipboard
Change log #
Please see CHANGELOG for more information on what has changed recently.
Troubleshooting #
My AppBar doesn't move like intended #
Have you assigned the ScrollController to the controller property of ScrollAppBar and inside
your ListView? This is required in order to get the main functionality.
Contributing #
Please send feature requests and bugs at the issue tracker.
Credits #

Edson Onildo
All Contributors

License #
BSD 3-Clause License. Please see License File for more information.