4

Is it possible to replicate this navigation bar transition effect using Cupertino Widgets?

enter image description here

I may not be using the widgets correctly.
And looking at some examples, I have not found any that shows exactly this effect.

Arnab
  • 4,216
  • 2
  • 28
  • 50
Dyego Vieira
  • 198
  • 3
  • 13

2 Answers2

4

If you want to have a slide transition like iOS, you use CupertinoPageRoute:

CupertinoPageRoute.
Navigator.push(
    context, CupertinoPageRoute(builder: (context) => Screen2()))

further you can see CupertinoPageRoute

There is also a widget known as PageView you can check. Maybe that would help

Arslan Kaleem
  • 1,410
  • 11
  • 25
  • For me that alone was not enough. I had to embed the first screen into a `CupertinoTabView` to make the navbar transition animation work correctly. – bbjay Apr 01 '22 at 10:46
1

The simple answer is not currently. See this bug - it's something that's being considered by the flutter team but not currently implemented. It's in the Milestone they hope to complete by the 1.0 release (but that could be a while).

That being said, you could do it yourself with a bit of work. You could start with something like the answer here but animate the AppBar instead of the NavigationBar. Not a particularly pretty solution, but it would work.

rmtmckenzie
  • 37,718
  • 9
  • 112
  • 99
  • Oh and BTW if you use the CupertinoPageScaffold, CupertinoNavigationBar & CupertinoPageRoute it will get you everything except the cross-fade on the app bar (i.e. push from side, etc). – rmtmckenzie Apr 05 '18 at 17:34