如何通过react导航4+使用自定义屏幕到屏幕的过渡？

通过react导航4+使用自定义屏幕到屏幕的过渡，可以通过以下步骤实现：

首先，确保你已经安装了React Navigation 4+的依赖包，并且已经在你的项目中进行了配置。
创建自定义的过渡动画组件。你可以使用React Native的Animated API来实现自定义的过渡效果。例如，你可以创建一个名为CustomTransition的组件，使用Animated.View来包裹你的屏幕组件，并在componentDidMount生命周期方法中定义你的过渡动画。

import React, { Component } from 'react';
import { Animated } from 'react-native';

class CustomTransition extends Component {
  constructor(props) {
    super(props);
    this.state = {
      transition: new Animated.Value(0),
    };
  }

  componentDidMount() {
    Animated.timing(this.state.transition, {
      toValue: 1,
      duration: 500,
      useNativeDriver: true,
    }).start();
  }

  render() {
    const { transition } = this.state;
    const { children } = this.props;

    return (
      <Animated.View style={{ opacity: transition }}>
        {children}
      </Animated.View>
    );
  }
}

export default CustomTransition;

在你的导航器中使用自定义的过渡动画组件。在你的导航器配置中，使用createStackNavigator创建一个堆栈导航器，并在transitionConfig属性中指定自定义的过渡动画配置。

import { createStackNavigator } from 'react-navigation-stack';
import CustomTransition from './CustomTransition';
import Screen1 from './Screen1';
import Screen2 from './Screen2';

const StackNavigator = createStackNavigator(
  {
    Screen1: {
      screen: Screen1,
    },
    Screen2: {
      screen: Screen2,
    },
  },
  {
    transitionConfig: () => ({
      screenInterpolator: (sceneProps) => {
        const { position, scene } = sceneProps;
        const { index } = scene;

        return CustomTransition;
      },
    }),
  }
);

export default StackNavigator;

在上述代码中，我们将自定义的过渡动画组件CustomTransition作为screenInterpolator的返回值，以实现自定义的屏幕到屏幕过渡效果。

这样，当你在导航器中切换屏幕时，就会使用你定义的自定义过渡动画来实现屏幕之间的过渡效果。

请注意，以上代码仅为示例，你可以根据自己的需求进行修改和扩展。另外，如果你需要更复杂的过渡效果，你可以使用React Native的其他动画组件或第三方库来实现。