Sheet (v1.0.0-pre): Animating between sheet routes with go_router

[DJWassink]

Thanks for this awesome package!

I was wondering if its possible to get the modal with inside navigation animation with go_router

As an example I made an recording of the iOS clock app (notice how the 2nd modal animates in from the right and the titlebar shifts, reverse order for exiting this screen):

https://github.com/jamesblasco/modal_bottom_sheet/assets/1822404/85e8df94-e8a0-497e-8ddf-a759bc29b5a8

[elliotkhd]

Is this what you are looking for

https://github.com/jamesblasco/modal_bottom_sheet/assets/26217279/793a633d-4a5c-4690-b4c8-cbd342680189

[DJWassink]

Is this what you are looking for screen-20230625-151302.2.mp4

That's exactly what I'm look for. Is that some demo app of this library that I missed somehow?

Aah that is the demo app of modal_bottom_sheet not the sheet modal. Maybe I will have a shot at implementing that one instead.

[DJWassink]

Had a look at both the demo apps and it seems this is using inline Navigator. Not sure if this is possible with the go_router package.

[richguma]

Should we use GoRoute and MaterialWithModalsPageRoute ? How ?

[hieupm2096]

I could animate the previous route animation with go_route by doing so

GoRoute( path: HomePage.route, builder: (context, state) { // wrap your page with CupertinoScaffold return const CupertinoScaffold( body: HomePage(), ); }, ),

in the HomePage widget, show the modal bottom sheet:

CupertinoScaffold.showCupertinoModalBottomSheet<dynamic>( context: context, builder: (context) => Container(), );

[agordeev]

I use go_router with generator. sheet works well in my case:

class NewDrugRoute extends GoRouteData {
  const NewDrugRoute();

  @override
  Page<void> buildPage(BuildContext context, GoRouterState state) =>
      MaterialExtendedPage(
        key: state.pageKey,
        fullscreenDialog: true,
        child: const ManageDrugPage(),
      );
}

[itsJoKr]

CupertinoScaffold.showCupertinoModalBottomSheet<dynamic>

As I see this is only way to do it with e.g. go-router, but problem is that using this essentially is not using Navigator 2 and named routes that are needed for web and deep links.