微信交流群

老孟公众号

# AnimatedSize

AnimatedSize是一个动画组件,当指定子组件的尺寸发生变化时,它就会在给定的时间内自动变换其尺寸。

用法如下:

class _WidgetsDemo extends State<WidgetsDemo>
    with SingleTickerProviderStateMixin {
  var _height = 100.0;
  var _width = 100.0;
  var _color = Colors.red;

  
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          RaisedButton(
            onPressed: () {
              setState(() {
                _height = 200.0;
                _width = 200.0;
                _color = Colors.blue;
              });
            },
          ),
          AnimatedSize(
            vsync: this,
            duration: Duration(seconds: 1),
            child: Container(
              height: _height,
              width: _width,
              color: _color,
            ),
          )
        ],
      ),
    );
  }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

效果如下: