为什么我的 flutter_animate 过渡没有发生？

Question

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

在

auth_page.dart

文件中：

class AuthPage extends StatefulWidget {
  const AuthPage({super.key});

  @override
  State<AuthPage> createState() => _AuthPageState();
}

class _AuthPageState extends State<AuthPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Container(
         ...
          child: Column(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
           ////SEE HERE////
              AuthBox().animate(target: authBoxTarget ? 1 : 0).slideY(
                    delay: Duration(milliseconds: 500),
                    duration: Duration(milliseconds: 500),
                    begin: 0,
                    end: 1,
                  ),
             ///////////
                ],
              ),
            ),
          ),
        );
      }
    }

在按钮的

authbox.dart

文件中：

onTap

函数：

      onTap: () {
    setState(() {
      authBoxTarget = true;
    });
    Future.delayed(
      Duration(milliseconds: 100),
      () {
        showGeneralDialog(
                 ...
            transitionBuilder: ... );
            return SlideTransition(
              position: tween.animate(...),
              child: child,
            );
          },
          pageBuilder: (context, _, __) {
            return Center(
              child: Container(...
                child: Center(
                  child: Text(
                    'Login',
                    style: TextStyle(...),
                  ),
                ),
              ),
            );
          },
        ).then((_) {
          setState(() {
            authBoxTarget = false;
          });
        });
      },
    );
  },

这应该有效吗？ - 当出现对话框时，authbox 应该向下滑动，并且在关闭后，authbox 应该重新出现。 但这并没有发生，对话即将到来，但 authbox 没有下降......为什么？？？给我解决方案。

mail.dart

文件：

void main() {
  runApp(
    MyApp(),
  );
  Animate.restartOnHotReload = true;
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData.light(),
      darkTheme: ThemeData.dark(),
      home: const AuthPage(),
    );
  }
}

Answer 1

如果你想同时运行两个动画，你可以在代码中声明一个新的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()

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