アプリを開発していると以下の機能を実装したい時がある。
Containerのプロパティ変化をアニメーションで表示したい
このような場合AnimatedContainerを用いると簡単にアニメーションが作成できる。
AnimatedContainer使用例
動作画像とコードを示す。
使用しているプロパティは「各プロパティ」のセクションで説明する。
簡単に説明すると、GestureDetectorでAnimatedContainerをラップしており、ウィジェットをタップするごとにAnimatedContainerに渡されるプロパティをランダムに変化させている。
各プロパティ
duration
必須プロパティ。アニメーションを表示させる時間を指定する。渡す値はDurationクラスのインスタンス。
curve
アニメーションのイージングを指定する。渡す値はCurveクラスのインスタンス。
イージングについては以下の記事などを参照。
height
ウィジェットの高さを指定する。
width
ウィジェットの幅を指定する。
color
ウィジェットの背景色を指定する。
decoration
ウィジェットの色や角の丸さ、影を指定する。
このプロパティで色を指定している場合、colorプロパティは使えない。
