如何从另一个 dart 文件触发一个/多个 dart 文件的动画?

问题描述 投票:0回答:1

所以基本上我一直在尝试实现动画。还使用 flutter_animate 4.2.0+1 包。 首先让我向您展示代码:

Animate(
     effects: [
         SlideEffect(
              end: Offset(0, 1),
              delay: Duration(milliseconds: 400),
              duration: Duration(milliseconds: 800),
              curve: Curves.ease,
              ),
            ],
           child: authBox(),
         )

这会带来 authbox 关闭动画。

登录按钮:

                    onTap: () {
                        Future.delayed(
                          Duration(milliseconds: 100),
                          () {
                            showGeneralDialog(
                              barrierDismissible: true,
                              barrierLabel: 'Login',
                              context: context,
                              transitionDuration:
                                  Duration(milliseconds: 400),
                              transitionBuilder: (context, animation,
                                  secondaryAnimation, child) {
                                Tween<Offset> tween;
                                tween = Tween(
                                  begin: Offset(0, -1),
                                  end: Offset.zero,
                                );
                                return SlideTransition(
                                  position: tween.animate(
                                    CurvedAnimation(
                                        parent: animation,
                                        curve: Curves.bounceIn),
                                  ),
                                  child: child,
                                );
                              },
                              pageBuilder: (context, _, __) {
                                return Center(
                                  child: Container(
                                    height: size.height / 2.5,
                                    width: size.width / 1.2,
                                    color: Colors.white,
                                    child: Center(
                                      child: Text(
                                        'Login',
                                        style: TextStyle(
                                          fontFamily: 'SFProDisplay',
                                          fontStyle: FontStyle.normal,
                                        ),
                                      ),
                                    ),
                                  ),
                                );
                              },
                            );
                          },
                        );
                      },

这会从顶部显示登录对话框。

我希望这两个动画同步运行。

就像退出对话框和退出授权框一样。在

dismissed
上,对话返回并且授权框返回。

flutter dart animation flutter-animation
1个回答
0
投票

如果你想同时运行两个动画,你可以在代码中声明一个新的bool,例如:

bool isButtonPressed=false;

然后,在 onTap 处理程序中,在开头添加以下内容:

setState(() {
              isButtonPressed = true;
            });

在 showGeneralDialog 之后添加以下内容:

.then((value) {
                  setState(() {
                    isButtonPressed = false;
                  });
                })

这是您的 Animate Widget 的代码,其中包含 authbox:

isButtonPressed
          ? Animate(
              effects: [
                SlideEffect(
                  end: Offset(0, 1),
                  delay: Duration(milliseconds: 400),
                  duration: Duration(milliseconds: 800),
                  curve: Curves.ease,
                ),
              ],
              child: authbox(),
            )
          : authbox()

简单的解决方案,但它有效。 如果还有什么问题可以在评论里提问。

© www.soinside.com 2019 - 2024. All rights reserved.