Milad-Akarie / auto_route_library

Flutter route generator

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Make route only takes as much space as its children

lukaskurz opened this issue · comments

Hi there.

In my app i have a bottom sheet, in which i want to put a AutoRouter widget. This bottom sheet should take up just as much space as the content inside it i.e. small child wiget -> small bottom sheet, to show more of the content (maps widget) behind the bottom sheet.

When I use a Navigator widget this works just fine (but I cannot use it for other reasons), however the AutoRouter widget seems to the expand to take up as much space as possible, resulting in the bottom sheet maxing out is vertical size, although the actual child widget being rendered is fairly small. Is there any option/workaround, to prevent the AutoRouter from expanding like this ?

@lukaskurz Not sure what'g going on, AutoRouter is not using in sizing widget inside of it.

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions

@lukaskurz Not sure what'g going on, AutoRouter is not using in sizing widget inside of it.

Hi there @Milad-Akarie , sorry for the late reply, but I hotfixed in the meantime with a provider based navigation.
However now that i am refactoring this piece of code, i want to the nested navigation with autoroute another try.

@RoutePage()
class TimeTrackingPage extends ConsumerWidget {
  const TimeTrackingPage({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Scaffold(
      body: Column(
        children: [
          Expanded(child: Container(color: Theme.of(context).primaryColor)),
          ConstrainedBox(
            constraints: BoxConstraints(minHeight: 200, maxHeight: MediaQuery.of(context).size.height - 200),
            child: AutoRouter(
              builder: (context, content) {
                if (context.router.current.name == TimeTrackingStartRoute.page.name) {
                  return TimeTrackingStartPage();
                }

                return content;
              },
            ),
            // child: Text('asd'),
          ),
        ],
      ),
    );
  }
}

@RoutePage()
class TimeTrackingStartPage extends ConsumerWidget {
  const TimeTrackingStartPage({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Text('start');
  }
}

Take a look at this code, specifically the AutoRouter.builder function: If i return the content widget, which is the normal way the route would be rendered, then the AutoRouter grows to the maximum height that is allowed by the constrainedBox, however if were to just return the Text or the TimeTrackingStartPage itself, then this is not the case and the box shrinks to it's smallest size, which leads me to believe that whatever AutoRouter uses to wrap the Page widget, is trying to expand to the maximum size allowed by its parent.

I was able to work arund the problem by using this little trick to dismantle whatever the router does to the routed page

@override
  Widget build(BuildContext context, WidgetRef ref) {
    return Scaffold(
      body: Column(
        children: [
          Expanded(child: Container(color: Theme.of(context).primaryColor)),
          ConstrainedBox(
            constraints: BoxConstraints(minHeight: 200, maxHeight: MediaQuery.of(context).size.height - 200),
            child: AutoRouter(
              builder: (context, content) {
                if (content is AutoRouteNavigator) {
                  return content.router.topPage!.child;
                }
                return content;
              },
            ),
          ),
        ],
      ),
    );
  }