我正在开发一个移动应用程序,我想用一些很酷的对话框动画来改善用户体验,我不想只使用一个简单的弹出对话框。
基本上我想要的结果是这样的:
我在网上搜索了一下,也发现了类似的问题:Animation with hero and showDialog in flutter.
我试着发展一些东西,这是结果:
我不知道如何重现容器中的东西。也许在正确的动画(第一张图片),他们把一个看不见的小对话框,一旦按钮被按下,它出现的动画?
我应该在哪里输入对话框的信息?
这是我使用的代码:
Stack(
children: [
Positioned(
child: GoogleMap(
initialCameraPosition: CameraPosition(
target: LatLng(10, 10),
),
),
),
Positioned(
child: Container(
height: 100,
width: w,
color: Colors.white,
),
),
Positioned(
child: Padding(
padding: const EdgeInsets.only(top: 50),
child: Align(
alignment: Alignment.topCenter,
child: GestureDetector(
child: AnimatedContainer(
height: _h,
width: _w,
color: Colors.lightGreen,
duration: Duration(seconds: 1),
child: Center(
child: Text(
'Title',
),
),
),
onTap: () {
setState(() {
_h = 200;
_w = w * 0.9;
});
},
),
),
),
),
],
),
3条答案
按热度按时间5lwkijsr1#
我建议你使用来自官方动画包https://pub.dev/packages/animations的容器转换过渡模式
预览:https://github.com/flutter/packages/raw/master/packages/animations/example/demo_gifs/container_transform_lineup.gif
v09wglhw2#
在
showDialog
的builder
上使用ScaleTransition
也可以产生类似的效果。builder
将返回StatefulWidget
它会被用来
测试小部件:
mnemlml83#
我有个解决办法: