Milad-Akarie / auto_route_library

Flutter route generator
MIT License
1.56k stars 394 forks source link

Hero animation not working on ShellRoutes? #1873

Open ismailcaakir opened 6 months ago

ismailcaakir commented 6 months ago

Greetings,

I've been using auto_route for a long time. I'm tired of getting the same error in every project. Is there a solution?

If I add a route with children like accountshellroute in the breakdown, the hero tag does not work. I will show you the example with video.

In part 1 the hero animation is not working because there is a shell route in between, if I go to the commission setting the hero animations will work.

Also "leading" does not appear on the account page.

Note: If I go to account_setting, if I go to the add_account route under it, the hero tag works. you can see it clearly in the video.

 /// ROUTER SETTING
  AutoRoute(page: SettingShellRoute.page, children: [
    AutoRoute(page: SettingRoute.page),
    AutoRoute(page: CommissionSettingRoute.page),
    AutoRoute(
      page: AccountShellRoute.page,
      children: [
        AutoRoute(page: AccountSettingRoute.page),
        AutoRoute(page: AddAccountRoute.page),
      ],
    ),
  ]),

  /// SHELL ROUTE
  @RoutePage(name: 'AccountShellRoute')
  class AccountShellView extends AutoRouter {
    const AccountShellView({super.key});
  }

https://github.com/Milad-Akarie/auto_route_library/assets/8665190/5d06505e-6f97-48f8-8395-c40130c0f888

lucamenor commented 6 months ago

You need use HeroControllerScope

@RoutePage(name: 'AccountShellRoute')
class AccountShellView extends StatelessWidget {
  const AccountShellView({super.key});

  @override
  Widget build(BuildContext context) {
    return HeroControllerScope(
      controller: HeroController(),
      child: const AutoRouter(),
    );
  }
}
ismailcaakir commented 6 months ago

You need use HeroControllerScope

@RoutePage(name: 'AccountShellRoute')
class AccountShellView extends StatelessWidget {
  const AccountShellView({super.key});

  @override
  Widget build(BuildContext context) {
    return HeroControllerScope(
      controller: HeroController(),
      child: const AutoRouter(),
    );
  }
}

Thanks for the answer @lucamenor , But my problem persists, your solution did not work for me.