CupertinoWillPopScope

pub package

Note: This package can be used on any platform, and is not specific to iOS. ConditionalWillPopScope and CupertinoWillPopScopePageTransionsBuilder can each be used seprately.


CupertinoWillPopScopePageTransionsBuilder

The key to this package is a modified version of Flutter's CupertinoPageRoute, which has been enhanced with the following:

  • Visual feedback when users attempt to "swipe to go back" - the screen is allowed to be dragged a bit before it is snapped back to place.
  • If an enclosing route has willPop callbacks, they are triggered once the screen is snapped back to place.

ConditionalWillPopScope

When using this widget, be sure to update shouldAddCallbacks based on the state of your screen, and only set it to true when the screen should not be allowed to pop. Additionally, the onWillPop property should not be changed once set.


A working app using this package can be found in the example folder.

Usage

To use this package, add cupertino_will_pop_scope as a dependency in your pubspec.yaml file.

Example

Import the library

// main.dart
import 'package:decorated_icon/cupertino_will_pop_scope.dart';

Configure page transitions

Set the transition builder of the desired platform to CupertinoWillPopScopePageTransionsBuilder in your theme configuration.

// main.dart
theme = ThemeData(
  ...
  pageTransitionsTheme: PageTransitionsTheme(
    builders: {
      TargetPlatform.android: ZoomPageTransitionsBuilder(),
      TargetPlatform.iOS: CupertinoWillPopScopePageTransionsBuilder(),
    },
  ),
);
Make sure the theme is applied to the app.
// main.dart
MaterialApp(
  ...
  theme: theme,
  home: HomeScreen(),
);

Wrap your screen

Using the included ConditionalWillPopScope widget, or Flutter's WillPopScope widget, wrap your screen and define an onWillPop callback for it.

Note that onWillPop should always return a bool. See the Flutter Docs for more.
Using ConditionalWillPopScope:
// my_screen.dart
@override
Widget build(BuildContext context) {
  return ConditionalWillPopScope(
    child: _MyScreenContent(),
    onWillPop: _onWillPop,
    shouldAddCallbacks: _hasChanges,
  );
}
Using WillPopScope:
// my_screen.dart
@override
Widget build(BuildContext context) {
  return WillPopScope(
    child: _MyScreenContent(),
    onWillPop: _hasChanges ? _onWillPop : null,
  );
}

:warning: When using Flutter's WillPopScope widget, the onWillPop must be set conditionally. Otherwise, the "swipe to go back" gesture will be cancelled. In the example above, this is achieved by using _hasChanges as the condition.