nested_scroll_controller
A widget used to allow for controlling a NestedScrollView like it was a regular scroll view.
This is a small library which empowers you to control the offset of a NestedScrollView just like you would a regular scroll view:
- animate to an offset or an index
- jump to an offset or an index
- add listeners to the total offset
Usage
See example.
To utilize NestedScrollController there are five main steps:
/// 1. Create the [NestedScrollController].
final NestedScrollController nestedScrollController = NestedScrollController();
NestedScrollView(
/// 2. Set the controller of the [NestedScrollView] to the nestedScrollController.
controller: nestedScrollController,
/// 3. Wrap the body of the [NestedScrollView] in a [LayoutBuilder].
///
/// NOTE: if [nestedScrollController.centerScroll] is false (defaults to true),
/// then [constraints] is not needed and a [Builder] can be used instead of
/// the [LayoutBuilder].
body: LayoutBuilder(
builder: (context, constraints) {
/// 4. Enable scrolling and center scrolling.
///
/// NOTE: Only call [enableCenterScroll] if
/// [nestedScrollController.centerScroll] is true (defaults to true).
nestedScrollController.enableScroll(context);
nestedScrollController.enableCenterScroll(constraints);
ListTile(
title: Text('Item $index'),
onTap: () {
/// 5. Use the [NestedScrollController] anywhere (after step 4).
nestedScrollController.nestedAnimateToIndex(
index,
itemExtent: itemExtent,
);
}
);
Ofcourse, you can add/remove listeners just like a regular scroll controller:
nestedScrollController.addListener(() {
print("Outer: ${nestedScrollController.offset}");
print("Inner: ${nestedScrollController.innerOffset}");
print("Total: ${nestedScrollController.totalOffset}");
});
Result
See the example result here.
