dart – Flutter自定义动画对话框

概述我正在尝试在dart中设置自定义对话框的动画,以便在d出它时创建一些动画. Android中有一个带有动画对话框的库,Flutter Sweet Alert Dialog中是否有类似的库 我们怎样才能在颤动中实现相同的功能？ 要创建对话框,可以使用 Overlay或 Dialog类.如果要在给定框架中添加动画,可以使用 AnimationController,如下例所示. CurvedAnimat 我正在尝试在dart中设置自定义对话框的动画,以便在d出它时创建一些动画. Android中有一个带有动画对话框的库,Flutter Sweet Alert Dialog中是否有类似的库

我们怎样才能在颤动中实现相同的功能？

解决方法 要创建对话框,可以使用 Overlay或 Dialog类.如果要在给定框架中添加动画,可以使用 AnimationController,如下例所示. CurvedAnimation类用于创建动画的d跳效果：

你可以复制&将以下代码粘贴到新项目中并进行调整.它可以自己运行.

import 'package:Flutter/material.dart';voID main() => runApp(new MyApp());class MyApp extends StatelessWidget {  @overrIDe  Widget build(BuildContext context) {    return MaterialApp(Title: 'Flutter Demo',theme: themeData(),home: Page());  }}class Page extends StatelessWidget {  @overrIDe  Widget build(BuildContext context) {    return Scaffold(      body: Center(        child: Raisedbutton.icon(            onpressed: () {              Navigator.of(context)                  .overlay                  .insert(OverlayEntry(builder: (BuildContext context) {                return FunkyOverlay();              }));            },icon: Icon(Icons.message),label: Text("PopUp!")),),);  }}class FunkyOverlay extends StatefulWidget {  @overrIDe  State<StatefulWidget> createState() => FunkyOverlayState();}class FunkyOverlayState extends State<FunkyOverlay> with SingleTickerProvIDerStateMixin {  AnimationController controller;  Animation<double> opacityAnimation;  Animation<double> scaleAnimatoin;  @overrIDe  voID initState() {    super.initState();    controller = AnimationController(vsync: this,duration: Duration(milliseconds: 450));    opacityAnimation = Tween<double>(begin: 0.0,end: 0.4).animate(CurvedAnimation(parent: controller,curve: Curves.fastOutSlowIn));    scaleAnimatoin = CurvedAnimation(parent: controller,curve: Curves.elasticInOut);    controller.addListener(() {      setState(() {      });    });    controller.forward();  }  @overrIDe  Widget build(BuildContext context) {    return Material(      color: colors.black.withOpacity(opacityAnimation.value),child: Center(        child: ScaleTransition(          scale: scaleAnimatoin,child: Container(            decoration: Shapedecoration(                color: colors.white,shape: RoundedRectangleborder(                    borderRadius: borderRadius.circular(15.0))),child: padding(              padding: const EdgeInsets.all(50.0),child: Text("Well hello there!"),);  }}

总结

以上是内存溢出为你收集整理的dart – Flutter自定义动画对话框全部内容，希望文章能够帮你解决dart – Flutter自定义动画对话框所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。