Flutter: flutter_page_transition with multiple named routes doesn't work

Question

I need to transition between my screens with named routes. But when I use more than 1 route it transitions with the default transition and not the one from the flutter_page_transitions library.

This doesn't work:

      initialRoute: '/first',
      routes: {
        '/first': (context) => First(),
        '/second': (context) => Second(),
        '/third': (context) => Third(),
      },
      onGenerateRoute: (settings) {
        switch (settings.name) {
          case '/first': {
              return PageTransition(
                  child: First(), type: PageTransitionType.fade);
          }
          break;

          case '/second': {
              return PageTransition(
                  child: Second(), type: PageTransitionType.fade);
          }
          break;

          case '/third': {
              return PageTransition(
                  child: Third(), type: PageTransitionType.fade);
          }
          break;

          default: {
            return null;
          }
        }
      },

This works

      onGenerateRoute: (settings) {
        switch (settings.name) {
          case '/first': {
              return PageTransition(
                  child: First(), type: PageTransitionType.fade);
          }
          break;

          default: {
            return null;
          }
        }
      },

Answer 1

You shouldn't have the same route in both routes: and onGenerateRoute. They are mutually exclusive. So choose which code block you want to process your route.

OnGenerateRoute picks up routes that are not specified in routes: