AnimatedSplashScreen PageTransitionType 错误

Question

我在使用

AnimatedSplashScreen

时遇到问题，在我添加

pageTransitionType

时一切正常。然后我得到一个错误：

构建 AnimatedBuilder(animation: Listenable.merge([kAlwaysCompleteAnimation➩ProxyAnimation, kAlwaysDismissedAnimation➩ProxyAnimation]), dirty, state: _AnimatedState#bd6f7) 时抛出以下 _CastError： 对空值使用空检查运算符

这是一个产生该问题的简单应用程序：

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();
  }
}

我尝试运行许多命令，例如 flutter pub get 等。

此外，

pubspec.yaml

中的依赖项运行顺利：

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

Answer 1

我遇到了同样的问题并且可以重新创建它。 据我了解，您正在尝试使用 pageTransitionType 的属性“scale”，例如：

pageTransitionType: PageTransitionType.scale,

如果您想使用缩放，则必须在 PageTransition 中使用（例如）Navigator.push()，如下所示：

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

要使用 .scale 作为 TransitionType，您需要一个“对齐”，如我的示例中所示。

更多信息：
https://github.com/kalismeras61/flutter_page_transition/issues/53#issuecomment-983511302
https://pub.dev/packages/page_transition/example

Answer 2

其实这么多年，我自己已经找到了答案。

问题是，

Animated Splash Screen

小部件实际上有两个不同的参数。一个用于 Splash 动画的过渡

splashTransition

，一个用于下一屏幕过渡

pageTransistionType

。

因此，解决了所提出的问题并允许使用比例转换的简单应用程序将如下所示：

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: const Icon(Icons.person),
          splashTransition: SplashTransition.scaleTransition,
          pageTransitionType: PageTransitionType.fade, //with that line commented there is no error
          nextScreen: HomePage()
      ),
    );
  }
}

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

Answer 3

不知道具体如何解决缩放问题，但你可以将过渡类型更改为另一种，例如，

pageTransitionType: PageTransitionType.fade

Answer 4

import 'package:page_transition/page_transition.dart';

Answer 5

显然，我们必须添加 page_transition 作为依赖项。

有一个 youtube 视频 https://www.youtube.com/watch?v=q-e5t3qnB_M&t=1s

这是包含文档的 GitHub https://github.com/kalismeras61/flutter_page_transition

希望这对您有帮助。

Answer 6

我是这样解决的：

pageTransitionType: (PageTransitionType.fade)