CODEWITHSUNDEEP
dartflutter
David
David

Reputation: 1231

How to implement swipe to previous page in Flutter?

Go back feature works only on the edge of the screen on iPhone. How can I swipe to previous page from anywhere on the screen?

Upvotes: 18

Views: 23498

Answers (6)

Muhammad Hassan Razzaq
Muhammad Hassan Razzaq

Reputation: 9

In materialApp simply set in theme

theme: ThemeData(
    primarySwatch: Colors.green,
    pageTransitionsTheme: const PageTransitionsTheme(
      builders: {
        TargetPlatform.android: CupertinoPageTransitionsBuilder(),
      },
    ),
  ),

and where you are routing use CupertinoPageRoute instead of MaterialPageRoute it will work in right way .

Upvotes: 1

hexwhyzet
hexwhyzet

Reputation: 21

Another solution is to use swipeable_page_rout. It has specific parameter onlySwipeFromEdge: false.

Upvotes: 0

DJafari
DJafari

Reputation: 13545

correct way is :

MaterialApp(
  .
  .
  .
  theme: ThemeData(
    pageTransitionsTheme: PageTransitionsTheme(
      builders: {
        TargetPlatform.android: CupertinoPageTransitionsBuilder(),
        TargetPlatform.iOS: CupertinoPageTransitionsBuilder(),
      }
    )
  ),
  .
  .
  .
);

Upvotes: 37

Valentin
Valentin

Reputation: 31

If I understood correctly the problem is how to set custom width of the iOS back swipe gesture area? So one of the possible solutions is to use this package: cupertino_back_gesture.

Explanation from authors of package:

To change width of area where the user can start back swipe for the whole app:

  • Wrap your MaterialApp with BackGestureWidthTheme with desired backGestureWidth
  • set iOS builder of pageTransitionsTheme to CupertinoPageTransitionsBuilderCustomBackGestureWidth 
import 'package:cupertino_back_gesture/cupertino_back_gesture.dart';

BackGestureWidthTheme(   backGestureWidth: BackGestureWidth.fraction(1 / 2),   child: MaterialApp(
    theme: ThemeData(
      pageTransitionsTheme: PageTransitionsTheme(
        builders: {
          TargetPlatform.android: FadeUpwardsPageTransitionsBuilder(),
          TargetPlatform.iOS: CupertinoPageTransitionsBuilderCustomBackGestureWidth(),
        },
      ),
    ),
    home: MainPage(),   
  ), 
)

Example app can be found on github.com

Upvotes: 1

najeira
najeira

Reputation: 3253

Use CupertinoPageRoute to make it work on Android.

Upvotes: 2

Rémi Rousselet
Rémi Rousselet

Reputation: 277577

You are most likely looking for PageView which allows swip to go next/previous page gesture.

Upvotes: -1

Related Questions