【问题标题】:Flutter Log Out & Replace Stack BeautifullyFlutter 注销并漂亮地替换堆栈
【发布时间】:2019-08-30 08:32:52
【问题描述】:

在我的 Flutter 应用程序的任意深度,用户可以通过点击按钮退出应用程序。如何用身份验证/登录屏幕替换当前的屏幕堆栈并为过渡制作“漂亮”的动画?

我目前正在执行以下操作,但动画一点也不漂亮。在 iOS 上,堆栈上的屏幕向右滑出,而身份验证屏幕从右侧滑入。滑动太多。

NavigatorState navigatorState = Navigator.of(this.context);
while (navigatorState.canPop()) {
  navigatorState.pop();
}

Navigator.pushReplacement(
  context,
  MaterialPageRoute(builder: (BuildContext context) {
    return AuthScreen();
  }),
);

我宁愿让身份验证屏幕在 iOS 上从底部向上滑动,并让身份验证屏幕与 Android 上的正常动画一起出现。然后移除堆栈中较低的所有屏幕。我找不到在 Flutter 中以这种方式操作堆栈的方法。

【问题讨论】:

    标签: flutter


    【解决方案1】:

    试试这个。

      Navigator.pushAndRemoveUntil(
          context,
          PageRouteBuilder(pageBuilder: (BuildContext context, Animation animation,
              Animation secondaryAnimation) {
            return AuthScreen();
          }, transitionsBuilder: (BuildContext context, Animation<double> animation,
              Animation<double> secondaryAnimation, Widget child) {
            return new SlideTransition(
              position: new Tween<Offset>(
                begin: const Offset(1.0, 0.0),
                end: Offset.zero,
              ).animate(animation),
              child: child,
            );
          }),
          (Route route) => false);
    

    这里pushAndRemoveUntil 将清除堆栈并推送新屏幕。

    PageRouteBuilder 允许您为屏幕过渡设置动画。您可以通过返回FadeTransition 或任何您喜欢的方式来使用它。这样就可以实现动画过渡了。

    【讨论】:

      【解决方案2】:

      如果你在你的 MaterialApp 中声明路由就好了。

      MaterialApp(
        home: new Screen1(),
        routes: <String, WidgetBuilder> {
          '/AuthScreen': (BuildContext context) => new AuthScreen()
        },
      )
      

      你可以使用

      Navigator.of(context).pushNamedAndRemoveUntil('/AuthScreen', (Route<dynamic> route) => false);
      

      Source of information

      【讨论】:

      • 好答案!你能解释一下这个论点是什么吗? (路线 路线) => 假
      猜你喜欢
      • 1970-01-01
      • 2013-10-11
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2010-11-30
      • 2019-05-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多