反应导航过渡阴影

Question

我正在尝试进行这样的过渡https://youtu.be/yU9D_JnQsZc

但是我到了https://youtu.be/2fR4ojsjYdA

我怎么能像Facebook一样留下阴影？

我的AppNavigator：

export const AppNavigator = createStackNavigator({
    HomeStack,
    MessageForm: {
      screen: MessageForm,
      navigationOptions: () => ({
        gesturesEnabled: true,
      }),
    },
  },
  {
    initialRouteName: "HomeStack",
    mode: Platform.OS === "ios" ? "modal" : "card",
    headerMode: "none",
    cardStyle: {
      backgroundColor: "rgba(0, 0, 0, 0.4)",
      opacity: 1,
    },
    transitionConfig: TransitionConfiguration,
  },
);

我的自定义过渡：

function forVertical(props: any) {
  const { layout, position, scene } = props;

  const index: number = scene.index;
  const height: number = layout.initHeight;

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

  return {
    transform: [{ translateX }, { translateY }],
  };
}

const TransitionConfiguration = () => {
  return {
    transitionSpec: {
      duration: 350,
      easing: Easing.out(Easing.poly(4)),
      timing: Animated.timing,
      useNativeDriver: true,
    },
    screenInterpolator: forVertical,
    containerStyle: {
      backgroundColor: "transparent",
    },
  };
};