波纹动画颤动

本文介绍了波纹动画颤动的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我想使用颤动创建涟漪动画。我已经知道涟漪效应，但这不是我想要的，我想要的是

AnimationController _controller; @override void initState（）{ super.initState（）; _controller = AnimationController（ vsync：this， lowerBound：0.5， duration：Duration（seconds：3），）.. repeat（）; } @override 小部件构建（BuildContext上下文）{ return Scaffold（ appBar：AppBar（title：Text（ Title）） ，正文：_buildBody（），）; } 小部件_buildBody（）{ return AnimatedBuilder（动画：CurvedAnimation（父级：_controller，曲线：Curves.fastOutSlowIn），构建器： （上下文，子项）{ return Stack（alignment：Alignment.center，子项：< Widget> [ _buildContainer（150 * _controller.value）， _buildContainer（200 * _controller.value）， _buildContainer（250 * _controller.value）， _buildContainer（300 * _controller.value）， _buildContainer（350 * _controller.value）， Align（child：Icon（Icons.phone_android，size：44，）），]，）; }，）; } 小部件_buildContainer（double radius）{ return Container（ width：radius， height：radius，装饰：BoxDecoration （形状：BoxShape.circle，颜色：Colors.blue.withOpacity（1-_controller.value），），）； }

I want to create ripple animation using flutter. I already know ripple effect but this is not what I want , I want something which is here in the link

解决方案

Output

AnimationController _controller; @override void initState() { super.initState(); _controller = AnimationController( vsync: this, lowerBound: 0.5, duration: Duration(seconds: 3), )..repeat(); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text("Title")), body: _buildBody(), ); } Widget _buildBody() { return AnimatedBuilder( animation: CurvedAnimation(parent: _controller, curve: Curves.fastOutSlowIn), builder: (context, child) { return Stack( alignment: Alignment.center, children: <Widget>[ _buildContainer(150 * _controller.value), _buildContainer(200 * _controller.value), _buildContainer(250 * _controller.value), _buildContainer(300 * _controller.value), _buildContainer(350 * _controller.value), Align(child: Icon(Icons.phone_android, size: 44,)), ], ); }, ); } Widget _buildContainer(double radius) { return Container( width: radius, height: radius, decoration: BoxDecoration( shape: BoxShape.circle, color: Colors.blue.withOpacity(1 - _controller.value), ), ); }