реагировать на родной - изменить направление навигации (то есть справа налево) - PullRequest
Новая
       19

реагировать на родной - изменить направление навигации (то есть справа налево)

0 голосов
/ 31 августа 2018

Я использую реагирующую навигацию для перехода с одного экрана на другой. Кстати, я использую createStackNavigator.

Я использую код ниже для навигации между экранами. 

<Button onPress={()=>this.props.navigation.navigate('ScreenTwo')}>button-></Button>

Работает нормально, но я хочу изменить направление анимации. В настоящее время, когда я нажимаю кнопку, просто выскакивает ScreenTwo, вместо этого я хочу, чтобы экран скользил справа налево.

Можно ли изменить направление анимации при навигации?

1 Ответ

0 голосов
/ 31 августа 2018

Вам необходимо использовать пользовательские переходы экрана в сторону ваших конфигураций навигации. Попробуйте следующий код (убедитесь, что вы импортировали Easing, Animated из'act-native ') 

const yourStack = createStackNavigator(
  {
    One: ScreenOne,
    Two: DetailsTwo,
  },
  {
    initialRouteName: 'One',
    transitionConfig: () => ({
      transitionSpec: {
        duration: 300,
        easing: Easing.out(Easing.poly(4)),
        timing: Animated.timing,
      },
      screenInterpolator: sceneProps => {
                const {layout, position, scene} = sceneProps;
                const {index} = scene;

                const width = layout.initWidth;
                const translateX = position.interpolate({
                    inputRange: [index - 1, index, index + 1],
                    outputRange: [width, 0, 0],
                });

                const opacity = position.interpolate({
                    inputRange: [index - 1, index - 0.99, index],
                    outputRange: [0, 1, 1],
                });

                return {opacity, transform: [{translateX: translateX}]};
            },
    })
  }
);
...