AnimatedSplashScreen PageTransitionType error

Viewed 1007

I have a problem using AnimatedSplashScreen, everything works fine to the moment I add a pageTransitionType. Then I get an error:

The following _CastError was thrown building AnimatedBuilder(animation: Listenable.merge([kAlwaysCompleteAnimation➩ProxyAnimation, kAlwaysDismissedAnimation➩ProxyAnimation]), dirty, state: _AnimatedState#bd6f7): Null check operator used on a null value

This is a simple app which generates that problem:

import 'package:animated_splash_screen/animated_splash_screen.dart';
import 'package:flutter/material.dart';
import 'package:page_transition/page_transition.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: AnimatedSplashScreen(
        splash: Icon(Icons.person),
        pageTransitionType: PageTransitionType.scale, //with that line commented there is no error
        nextScreen: HomePage()
      ),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

I have tried running many commands like flutter pub get etc.

Also, dependencies in pubspec.yaml are running smoothly:

animated_splash_screen: ^1.1.0
page_transition: ^2.0.1-nullsafety.0
2 Answers

I had the same problem and could recreate it. As I understood, you are trying to use the Property 'scale' for the pageTransitionType, like:

pageTransitionType: PageTransitionType.scale,

If you want to use scale, you will have to use (for example) a Navigator.push() within a PageTransition like this:

ElevatedButton(
    child: Text('Scale Transition Second Page'),
        onPressed: () {
        Navigator.push(
            context,
            PageTransition(
            curve: Curves.linear,
            type: PageTransitionType.scale,
            alignment: Alignment.topCenter,
            child: SecondPage(),
            ),
        );
    },
),

For using .scale as TransitionType you'll need an 'alignment' like it's shown in my example.

Further information:
https://github.com/kalismeras61/flutter_page_transition/issues/53#issuecomment-983511302
https://pub.dev/packages/page_transition/example

Not sure how to solve the scale problem specifically, but you can change the transition type to another kind, for instance,

pageTransitionType: PageTransitionType.fade
Related