画面遷移時のアニメーションを指定する
from React Navigation v5
https://reactnavigation.org/docs/stack-navigator/
NavigatorとScreenのどっちのはなししてるのかわかりにくくね???mrsekut.icon
https://callstack.com/blog/custom-screen-transitions-in-react-navigation/
StackNavigator
mode
modal, cardなど
画面遷移時のアニメーション
headerMode
float, screen, noneなど
画面遷移時のヘッダーのアニメーション
例えばscreenなら、画面遷移時にheader自体も入れ替わる
Screen
gestureDirection
transitionSpec
timing
spring #??
ex. open: TransitionSpecs.TransitionIOSSpec
headerStyleInterpolator
ex. HeaderStyleInterpolators.forFade
cardStyleInterpolator
ex. CardStyleInterpolators.forFadeFromBottomAndroid
縦アニメーションの仕方は複数あるので逆にややこしい
mode='modal'
https://medium.com/async-la/custom-transitions-in-react-navigation-2f759408a053
https://stackoverflow.com/questions/56034095/how-to-change-default-navigation-animation-in-react-native
https://callstack.com/blog/custom-screen-transitions-in-react-navigation/
できないこと
setOptions内でアニメーションの変更はできない
StackNavigationOptions型の中にそれらしきpropertyが見当たらない
#やりたいこと
同一のページだが、右から出すことと、下から出すこととあるものがある
paramか何かの値を見て切り替えたい
別名にして同じコンポーネントをStackツリーの別のところに置くとかかなーmrsekut.icon
以下の3つの種類がある
普通のページ
ページ上に表示するモーダル
下から出てくるページ
#??
「ページ上に表示するモーダル」はどこに置くべきか
再描画などの問題でかなり頭の方に置くべきなのだが、
Navigtionが使える範囲にいないとページ遷移ができない
これと同じノリで、モーダル用のNavigator、screenを一つ用意し、その中に複数のモーダルを入れるとか
無理だった
storeは変化してもnavigationが感知しないので表示されない
これみたいに透明のfull screen modalを作るとか