A page transition which supports drag-down-to-pop gesture. The main source code is copied from the cupertino/route.dart in Flutter SDK with some modifications.
Create a new PageRoute to use this page transiaction.
import 'package:drag_down_to_pop/drag_down_to_pop.dart';
class ImageViewerPageRoute extends MaterialPageRoute {
ImageViewerPageRoute({@required WidgetBuilder builder})
: super(builder: builder);
@override
Widget buildTransitions(BuildContext context, Animation<double> animation,
Animation<double> secondaryAnimation, Widget child) {
return const DragDownToPopPageTransitionsBuilder()
.buildTransitions(this, context, animation, secondaryAnimation, child);
}
}
// Push to a new page using ImageViewerPageRoute
Navigator.push(
context,
ImageViewerPageRoute(builder: (context) => ImageViewerPage()),
);
Run this command:
With Flutter:
$ flutter pub add drag_down_to_pop
This will add a line like this to your package's pubspec.yaml (and run an implicit dart pub get):
dependencies:
drag_down_to_pop: ^1.0.0
Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.
Now in your Dart code, you can use:
import 'package:drag_down_to_pop/drag_down_to_pop.dart';
import 'package:drag_down_to_pop/drag_down_to_pop.dart';
import 'package:flutter/material.dart';
void main() => runApp(
MaterialApp(
home: FirstPage(),
),
);
class FirstPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('First Page'),
),
body: Center(
child: FlatButton(
child: Text('Next page'),
textColor: Colors.white,
color: Colors.blue,
onPressed: () {
Navigator.push(
context,
ImageViewerPageRoute(builder: (context) => SecondPage()),
);
},
),
),
);
}
}
class ImageViewerPageRoute extends MaterialPageRoute {
ImageViewerPageRoute({required WidgetBuilder builder})
: super(builder: builder, maintainState: false);
@override
Widget buildTransitions(BuildContext context, Animation<double> animation,
Animation<double> secondaryAnimation, Widget child) {
return const DragDownToPopPageTransitionsBuilder()
.buildTransitions(this, context, animation, secondaryAnimation, child);
}
@override
bool canTransitionFrom(TransitionRoute previousRoute) {
return false;
}
@override
bool canTransitionTo(TransitionRoute nextRoute) {
return false;
}
}
class SecondPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GestureDetector(
child: Container(
child: Image.network(
'https://ww4.sinaimg.cn/bmiddle/5c9763c0jw1dg9c1if6bjj.jpg',
),
),
onTap: () {
Navigator.maybePop(context);
},
);
}
}