How do we use the transitionsBuilder property?

[NasirKhalid24]

Shown below is a snippet of my code, it does not execute the appropriate transition but instead gets stuck on the splash screen.

home: SplashScreen.navigate(
        name: 'assets/splash.flr',
        next: HomePage(),
        until: () => Future.delayed(Duration(seconds: 2)),
        startAnimation: 'SplashScreen',
        backgroundColor: Color(0xff211E25),
        transitionsBuilder: (context, a, a2) {
          return FadeTransition(
            opacity: a,
          );
        }
      ),

Instead of desired output i get the following error message

I/flutter ( 4023): NAME SplashScreen
I/flutter ( 4023): ══╡ EXCEPTION CAUGHT BY SCHEDULER LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter ( 4023): The following assertion was thrown during a scheduler callback:
I/flutter ( 4023): type '(BuildContext, Animation<double>, Animation<double>) => FadeTransition' is not a subtype of
I/flutter ( 4023): type '(BuildContext, Animation<double>, Animation<double>, Widget) => Widget'

Could someone please explain how transitionsBuilder is supposed to be used here

[NasirKhalid24]

As a follow up to this, the syntax is incorrect because there is no child property for the animation. A child property also cannot be added because it returns an error. The issue seems to be in flare_splash_screen.dart of the library. In line 19 we have the following code

final RoutePageBuilder transitionsBuilder;

In the flutter API documentation for transitionsBuilder here, the implementation of transitionsBuilder is

final RouteTransitionsBuilder transitionsBuilder

Therefore I believe the type definition in the library is incorrect and so it needs to be changed. The incorrect type definition also repeats in line 35 as

RoutePageBuilder transitionsBuilder,

and in line 68 as

RoutePageBuilder transitionsBuilder,

All 3 cases need to be changed so that the type definition is RouteTransitionsBuilder

[NasirKhalid24]

After changing the type in the above pull request the following code now works to implement a slide transition

home: SplashScreen.navigate(
        name: 'assets/splash.flr',
        next: HomePage(),
        until: () => Future.delayed(Duration(seconds: 2)),
        startAnimation: 'SplashScreen',
        backgroundColor: Color(0xff211E25),
        transitionsBuilder: (c, a, a1, child) {
          return SlideTransition(
                position: Tween<Offset>(
                  begin: const Offset(-1, 0),
                  end: Offset.zero,
                ).animate(a),
                child: child,
              );
        },
      ), 

[jaumard]

Published in 2.1.2!
Thanks for your help !