firebase - 如何使用提供程序为登录屏幕过渡设置动画？

Question

当 Firebase 身份验证状态更改为provider.

但是屏幕变化没有动画。我已经尝试使用Navigator.of(context).pushReplacementNamed，但这会导致很多错误。

模型中的状态更改时如何为自动屏幕更改设置动画？（我看过，但没有教程涵盖这个。所有的屏幕变化都没有动画）。

感谢帮助！

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      builder: (_) => UserRepository.instance(),
      child: Consumer(
        builder: (context, UserRepository user, _) {
          switch (user.status) {
            case Status.Uninitialized:
              return Splash();
            case Status.Unauthenticated:
            case Status.Authenticating:
              return LoginPage();
            case Status.Authenticated:
              return UserInfoPage(user: user.user);
          }
        },
      ),
    );
  }
}

标签： firebaseflutterdartstate-management

Answer 1

这是我认为 Rémi Rousselet 的建议的代码示例。只要身份验证状态发生变化，Provider.of(...)调用就会触发重建，当前屏幕在 switch 语句中设置，并AnimatedSwitcher使用 aFadeTransition从前一个屏幕动画到当前屏幕。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var authenticationService = Provider.of<AuthenticationService>(context);

    Widget _currentScreen;

    switch (authenticationService.status) {
      case AuthenticationStatus.authenticated:
        _currentScreen = MainScreen();
        break;
      case AuthenticationStatus.uninitialized:
        _currentScreen = SplashScreen();
        break;
      case AuthenticationStatus.authenticating:
        _currentScreen = LoadingScreen();
        break;
      case AuthenticationStatus.unauthenticated:
      default:
        _currentScreen = SignInScreen();
    }

    return MaterialApp(
      title: 'My App',
      home: AnimatedSwitcher(
        duration: Duration(milliseconds: 500),
        child: _currentScreen,
      ),
    );
  }
}