[React Navigation] A defaultStackNavigatorConfig with transparent container styles setting up a screenInterpolator without shadow offset.

defaultStackNavigatorConfig.js

import { I18nManager } from 'react-native';
import CardStackStyleInterpolator from 'react-navigation/src/views/StackView/StackViewStyleInterpolator';
import getSceneIndicesForInterpolationInputRange from 'react-navigation/src/utils/getSceneIndicesForInterpolationInputRange';

// a new own screenInterpolator with only a small change to CardStackStyleInterpolator.forHorizontal
const forHorizontalWithoutOffset = (props) => {
  const { layout, position, scene } = props;

  if (!layout.isMeasured) {
    return CardStackStyleInterpolator.forInitial;
  }
  const interpolate = getSceneIndicesForInterpolationInputRange(props);

  if (!interpolate) return { opacity: 0 };

  const { first, last } = interpolate;
  const index = scene.index;
  const opacity = position.interpolate({
    inputRange: [first, first + 0.01, index, last - 0.01, last],
    outputRange: [0, 1, 1, 0.85, 0]
  });

  const width = layout.initWidth;
  const translateX = position.interpolate({
    inputRange: [first, index, last],
    // changed the third value to 0 to have no offset
    outputRange: I18nManager.isRTL ? [-width, 0, 0] : [width, 0, 0]
  });
  const translateY = 0;

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

export const defaultStackNavigatorConfig = (initialRouteName, headerMode = 'float') => {
  return {
    initialRouteName,
    cardStyle: { shadowOpacity: 0, backgroundColor: 'transparent' },
    headerMode: headerMode,
    URIPrefix: 'foobar://',
    transitionConfig: () => ({
      screenInterpolator: (sceneProps) => {
        return headerMode === 'none'
          ? forHorizontalWithoutOffset(sceneProps)
          : CardStackStyleInterpolator.forHorizontal(sceneProps);
      },
      containerStyle: {
        backgroundColor: 'transparent'
      }
    })
  };
};