0 purchases
snap scroll physics
Snap Scroll Physics #
When building scrollable views, sometimes you would prefer that the scroll stopped at a given offset, or that it avoids to stop inside some area. This package allows you to implement this on any Flutter scroll view.
This kind of behaviour can be seen in any iOS app using the UIKit/SwiftUI Navigation bar, also with custom headers inside some popular apps like Twitter, Chrome, Gmail, Google Photos, Apple Music, Facebook and many more!
physics: SnapScrollPhysics(
snaps: [
Snap(200, distance: 50), // If the scroll offset is expected to stop between 150-250 the scroll will snap to 200,
Snap(200, leadingDistance: 50), // If the scroll offset is expected to stop between 150-200 the scroll will snap to 200,
Snap(200, trailingDistance: 50), // If the scroll offset is expected to stop between 150-200 the scroll will snap to 200,
Snap(200, trailingDistance: 50), // If the scroll offset is expected to stop between 150-200 the scroll will snap to 200,
Snap.avoidZone(0, 200), // If the scroll offset is expected to stop between 0-200, the scroll will snap to 0 if the expected one is between 0-99, and to 200 if it is between 100-200,
Snap.avoidZone(0, 200, delimiter: 50), // If the scroll offset is expected to stop between 0-200, the scroll will snap to 0 if the expected one is between 0-49, and to 200 if it is between 50-200
]
),
copied to clipboard
physics: SnapScrollPhysics.cupertinoAppBar, // Default values for the Cupertino appbar
copied to clipboard
https://user-images.githubusercontent.com/19904063/116775316-b67b8f80-aa62-11eb-9ae1-58da68a381e4.mp4
https://user-images.githubusercontent.com/19904063/116775452-56391d80-aa63-11eb-95ae-f8fd8154cbc9.mp4
IMPORTANT! Sadly ScrollPhysics are not reactivily updated, so if you change the values, they won't be automatically updated. See #80051.
This can be temporaly fixed by this, while is discouraged in production if no changes are needed at runtime:
List<Snap> getSnaps() {
return [
Snap(200), // Hot reload works
];
}
@override
Widget build(BuildContext context) {
return CustomScrollView(
physics: SnapScrollPhysics.builder(getSnaps),
slivers: [
// ....
],
);
}
copied to clipboard
For personal and professional use. You cannot resell or redistribute these repositories in their original state.
There are no reviews.