[Flutter] AnimatedContainer

https://youtu.be/yI-8QHpGIP4

AnimatedContainer

特定の属性（色など）で一度ビルドして、別の値で再びビルドすることができる。Flutterが二つの値から自動的にアニメーションの変化を作り、さらに、アニメーションの長さやcurveも指定できるウィジェット

@override
Widget build(buildContext context){
 return AnimatedContainer(
    color:_color,
    duration:_myDuration,
    child:SomeOtherWidget(),
    ),
 );
}

その他プロパティー

return AnimatedContainer(
    color:_color,
    duration:_myDuration,
    curve:Curves.bounceIn,
    child:SomeOtherWidget(),
    ),
 );
}

duration : アニメーションの長さ
curve : エフェクトをカスタマイズ

keyword

下記は AnimatedContainer で変えることの出来るウィジェットの例

borders : 外枠
border radii : 外枠半径
background images : 背景画像
shadows : 影
gradients : グラデーション
shapes : 形
padding : 内側の余白
width : 幅
heigth : 高さ
alinment : 配置
transforms : 変換