react-native-router-flux小技巧
2018-01-03 本文已影响71人
jay_den
------------ 关闭后退手势-------------
如果只是关闭某个界面的手势只需要再某个界面中添加 panHandlers={null}
<Scene key="MeTest" component={Me} panHandlers={null}/>
如果想关闭全部界面就只需要再根视图中添加
<Scene key="root" panHandlers={null}>
-------------显示左边文字-------------
方法一:
<Scene
component={Test}
key="Test"
modal={true}
leftTitle="关闭"
onLeft={Actions.pop}
/>
或者
左边文字
方法二:
<Scene
component={Test}
key="Test"
modal={true}
// leftTitle="关闭"
onLeft={ Actions.pop}
/>
static onEnter = () => {
Actions.refresh({
leftTitle:'左边文字',
onLeft: () => {
alert('点击')
Actions.pop()
},
});
};
-----------------过渡动画的选择-------------------
如果全部界面都是同一种过渡动画那么可以在根视图中设置一种:
<Stack key="root"
titleStyle={{ alignSelf: 'center' }}
transitionConfig={() => ({ screenInterpolator: CardStackStyleInterpolator.forHorizontal })}
>
如果某个界面要有不同的效果,需要把设置改一下
<Stack key="root"
titleStyle={{ alignSelf: 'center' }}
//过渡动画
transitionConfig={() => ({
screenInterpolator: (props) => {
const { scene } = props
switch (scene.route.routeName) {
/* case yourKeyScene:
return theAnimationYouWant(props)*/
case 'groups':
return CardStackStyleInterpolator.forVertical(props)
case 'home':
return CardStackStyleInterpolator.forHorizontal(props)
case 'inbox':
return CardStackStyleInterpolator.forFade(props)
default:
return CardStackStyleInterpolator.forHorizontal(props)
}
}})}
>