如何以波纹效果方式改变背景颜色?

时间:2020-05-28 11:50:53

标签: flutter dart flutter-layout

double _size = 0;
Color _color = Colors.white;

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(),
    floatingActionButton: FloatingActionButton(
      child: Icon(Icons.refresh),
      onPressed: () {
        Timer.periodic(Duration(milliseconds: 10), (timer) {
          if (timer.tick > 100) timer.cancel();
          if (timer.tick == 1) _color = Colors.blue;
          setState(() => _size += 20);
        });
      },
    ),
    body: Stack(
      children: [
        AnimatedContainer(
          duration: Duration(seconds: 5),
          width: _size,
          height: _size,
          alignment: Alignment.center,
          decoration: BoxDecoration(color: _color, shape: BoxShape.circle),
        ),
        Placeholder(),
      ],
    ),
  );
}

当前输出:

enter image description here

预期输出:

enter image description here

谁能告诉我该怎么做,我是Flutter的新手。也许我的方法不正确,应该使用backgroundColor的{​​{1}}属性还是其他?

0 个答案:

没有答案