Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Present modally in Flutter?

Tags:

How to do a modal presentation of a route in Flutter?

I figured out how to navigate to a route using the usual "push" transition, but I am struggling to implement a modal transition. See animation attached (done using native iOS). How do I present a screen modally (a screen that itself can be pushed more screens to).

See an example below. The transition I am struggling with is from "A" to "C" (and of course a way to dismiss it and go back to "A").

enter image description here

like image 235
Nikolay Suvandzhiev Avatar asked Oct 05 '18 09:10

Nikolay Suvandzhiev


People also ask

How do you present a page on flutter?

You can push like this: Navigator. of(context). push( CupertinoPageRoute( fullscreenDialog: true, builder: (context) => SomePage(), ), );

What is ModalRoute flutter?

A route that blocks interaction with previous routes. ModalRoutes cover the entire Navigator. They are not necessarily opaque, however; for example, a pop-up menu uses a ModalRoute but only shows the menu in a small box overlapping the previous route. The T type argument is the return value of the route.


1 Answers

You can push like this:

Navigator.of(context).push(         CupertinoPageRoute(                 fullscreenDialog: true,                 builder: (context) => SomePage(),         ), ); 

Hope this helps.

like image 83
Daibaku Avatar answered Sep 21 '22 12:09

Daibaku