Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Prevent crashes during pagination and enable pagination duration configuration in animation style. #280

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -891,6 +891,7 @@ providing an instance of `WoltModalSheetAnimationStyle` class to
WoltModalSheetThemeData(
animationStyle: WoltModalSheetAnimationStyle(
paginationAnimationStyle: WoltModalSheetPaginationAnimationStyle(
paginationDuration = Duration(milliseconds: 250),
mainContentIncomingOpacityCurve: const Interval(
150 / 350,
350 / 350,
Expand Down
120 changes: 63 additions & 57 deletions lib/src/content/wolt_modal_sheet_animated_switcher.dart
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,7 @@ class _WoltModalSheetAnimatedSwitcherState

bool _isForwardMove = true;

bool? _shouldAnimatePagination;
late bool _shouldAnimatePagination;

GlobalKey get _pageTitleKey => _titleKeys[_pageIndex];

Expand Down Expand Up @@ -206,47 +206,45 @@ class _WoltModalSheetAnimatedSwitcherState
final outgoingWidgets = _outgoingPageWidgets;
final animationController = _animationController;
final animatePagination = _shouldAnimatePagination;

return Stack(
alignment: Alignment.bottomCenter,
children: [
if (outgoingWidgets != null)
WoltModalSheetLayout(
paginatingWidgetsGroup: outgoingWidgets,
page: _page,
woltModalType: widget.woltModalType,
showDragHandle: widget.showDragHandle,
),
if (incomingWidgets != null)
WoltModalSheetLayout(
paginatingWidgetsGroup: incomingWidgets,
page: _page,
woltModalType: widget.woltModalType,
showDragHandle: widget.showDragHandle,
),
if (incomingWidgets != null &&
animationController != null &&
animatePagination != null &&
animatePagination &&
animationController.value != 1.0)
Offstage(
child: KeyedSubtree(
key: _incomingOffstagedMainContentKeys[_pageIndex],
child: incomingWidgets.offstagedMainContent,
final isAnimating = animationController != null &&
animatePagination &&
animationController.isAnimating &&
animationController.value != 1.0;
return AbsorbPointer(
absorbing: isAnimating,
child: Stack(
alignment: Alignment.bottomCenter,
children: [
if (outgoingWidgets != null)
WoltModalSheetLayout(
paginatingWidgetsGroup: outgoingWidgets,
page: _page,
woltModalType: widget.woltModalType,
showDragHandle: widget.showDragHandle,
),
),
if (outgoingWidgets != null &&
animationController != null &&
animatePagination != null &&
animatePagination &&
animationController.value != 1.0)
Offstage(
child: KeyedSubtree(
key: _outgoingOffstagedMainContentKeys[_pageIndex],
child: outgoingWidgets.offstagedMainContent,
if (incomingWidgets != null)
WoltModalSheetLayout(
paginatingWidgetsGroup: incomingWidgets,
page: _page,
woltModalType: widget.woltModalType,
showDragHandle: widget.showDragHandle,
),
),
],
if (incomingWidgets != null && isAnimating)
Offstage(
child: KeyedSubtree(
key: _incomingOffstagedMainContentKeys[_pageIndex],
child: incomingWidgets.offstagedMainContent,
),
),
if (outgoingWidgets != null && isAnimating)
Offstage(
child: KeyedSubtree(
key: _outgoingOffstagedMainContentKeys[_pageIndex],
child: outgoingWidgets.offstagedMainContent,
),
),
],
),
);
}

Expand All @@ -270,27 +268,23 @@ class _WoltModalSheetAnimatedSwitcherState
// We set the _shouldAnimatePagination to animate, which dictates whether the new page transition will be animated.
_shouldAnimatePagination = animate;

final themeData = Theme.of(context).extension<WoltModalSheetThemeData>();
final defaultThemeData = WoltModalSheetDefaultThemeData(context);
final WoltModalSheetAnimationStyle animationStyle =
themeData?.animationStyle ?? defaultThemeData.animationStyle;
// An AnimationController is created and attached to this State object (with 'this' as the vsync).
_animationController = AnimationController(
duration: const Duration(
milliseconds: defaultWoltModalTransitionAnimationDuration),
duration: animationStyle.paginationAnimationStyle.paginationDuration,
vsync: this,
)
// We also attach a status listener to the animation controller. When the animation is completed, it will trigger a state change.
..addStatusListener((status) {
)..addStatusListener((status) {
if (status == AnimationStatus.completed) {
setState(() {
_shouldAnimatePagination = null;
// We clear the _outgoingPageWidgets, which was storing the "outgoing" page (the page we're transitioning from)
_outgoingPageWidgets = null;
// We ensure that the animation controller's value is set to its upper bound (which should be 1.0)
_animationController?.value =
_animationController?.upperBound ?? 1.0;
// We dispose of the animation controller to free up resources as we're done with this animation
_animationController?.dispose();
// We also set the animation controller reference to null as it's no longer needed.
_animationController = null;
});
// If the widget is disposed while the animation is still running calling setState
// will throw an exception.
if (context.mounted) {
setState(() => _onPaginationAnimationComplete());
} else {
_onPaginationAnimationComplete();
}
}
});

Expand All @@ -317,6 +311,18 @@ class _WoltModalSheetAnimatedSwitcherState
}
}

void _onPaginationAnimationComplete() {
_shouldAnimatePagination = false;
// We clear the _outgoingPageWidgets, which was storing the "outgoing" page (the page we're transitioning from)
_outgoingPageWidgets = null;
// We ensure that the animation controller's value is set to its upper bound (which should be 1.0)
_animationController?.value = _animationController?.upperBound ?? 1.0;
// We dispose of the animation controller to free up resources as we're done with this animation
_animationController?.dispose();
// We also set the animation controller reference to null as it's no longer needed.
_animationController = null;
}

PaginatingWidgetsGroup _createIncomingWidgets(
AnimationController animationController) {
final themeData = Theme.of(context).extension<WoltModalSheetThemeData>();
Expand Down
4 changes: 4 additions & 0 deletions lib/src/theme/wolt_modal_sheet_animation_style.dart
Original file line number Diff line number Diff line change
Expand Up @@ -194,6 +194,9 @@ class WoltModalSheetPaginationAnimationStyle {
/// Determines the final off-screen position of the exiting content, controlling its exit trajectory.
final Offset? outgoingMainContentSlideEndOffset;

/// The duration of the pagination transition.
final Duration paginationDuration;

/// Constructs a [WoltModalSheetPaginationAnimationStyle] with customizable animation curves
/// and offsets for different components during page transitions. Allows for detailed control
/// over the appearance and behavior of modal sheet pagination animations, enabling developers
Expand All @@ -202,6 +205,7 @@ class WoltModalSheetPaginationAnimationStyle {
/// Default values for curves and offsets are provided, but all can be overridden to achieve
/// custom animation effects tailored to specific design requirements.
const WoltModalSheetPaginationAnimationStyle({
this.paginationDuration = const Duration(milliseconds: 350),
this.incomingMainContentSlideBeginOffset,
this.incomingMainContentSlideEndOffset = Offset.zero,
this.outgoingMainContentSlideBeginOffset = Offset.zero,
Expand Down
2 changes: 0 additions & 2 deletions lib/src/wolt_modal_sheet.dart
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,6 @@ import 'package:wolt_modal_sheet/src/widgets/wolt_animated_modal_barrier.dart';
import 'package:wolt_modal_sheet/src/widgets/wolt_modal_sheet_content_gesture_detector.dart';
import 'package:wolt_modal_sheet/wolt_modal_sheet.dart';

const int defaultWoltModalTransitionAnimationDuration = 350;

/// Signature for a function that builds a list of [SliverWoltModalSheetPage] based on the given [BuildContext].
typedef WoltModalSheetPageListBuilder = List<SliverWoltModalSheetPage> Function(
BuildContext context,
Expand Down