LayoutAnimation 使うと楽しい
ReactNativeで LayoutAnimation
を使うと、要素が消えたり表示したりする時に
勝手にいい感じのアニメーションを付けてくれるから便利
import { LayoutAnimation, } from 'react-native';
ボタンを押すとメニューが出てくる仕様があったとして、それにアニメーションを付けたい場合、
トリガーになる onPress()
なんかの一番最初に LayoutAnimation.spring()
を書くだけで勝手にアニメーションしてくれます。
spring()
はバネみたいなアニメーションで、他にはeaseInEaseOut ()
と linear ()
がデフォルトで用意されています。
サクッと確認したい場合は、ここを見るとウェブ上で実行できるサンプルがあるので、それを編集すれば良さそうです。
http://facebook.github.io/react-native/releases/0.45/docs/animations.html#layoutanimation-api
自分で動きをカスタマイズも出来ます。
こんな感じ
componentWillUpdate()
で LayoutAnimation
を実行すれば、とにかく画面が変更される度にアニメーションがかかるようになります。
LayoutAnimation
は難しい設定なしで、かってにアニメーションをいい感じにしてくれる良い子です。
ぜひ使ってみて下さい。
ドキュメント http://facebook.github.io/react-native/releases/0.45/docs/layoutanimation.html#layoutanimation