React native：createStackNavigator 与实际屏幕内容重叠（Android）答案

【问题标题】：React native: createStackNavigator overlaps on the actual screen contents (Android)React native：createStackNavigator 与实际屏幕内容重叠（Android）
【发布时间】：2018-08-03 13:41:21
【问题描述】：

我正在创建一个带有以下菜单的示例酒店列表应用程序：

export const loggedInMenu = createMaterialBottomTabNavigator(
  {
    Hotels: {
      screen: hotelDetailsScreen,
      navigationOptions: {
        tabBarLabel: "Hotels",
        tabBarIcon: <Icon name="hotel" size={24} />
      }
    },
    HotelsSearch: {
      screen: HotelsSearch,
      navigationOptions: {
        tabBarLabel: "Search",
        tabBarIcon: <Icon name="search" size={24} />
      }
    },
    Favourites: {
      screen: Favourites,
      navigationOptions: {
        tabBarLabel: "Hotels",
        tabBarIcon: <Icon name="favorite" size={24} />
      }
    },
  },
  {
    initialRouteName: 'Hotels'
  }
);

export const hotelDetailsScreen = createStackNavigator(
  {
    Hotels: {screen: Hotels},
    hotelDetails: {screen: hotelDetails},
  },
  {
    initialRouteName: "Hotels",
    headerLayoutPreset: "center",
    navigationOptions: {
      title: "Hotels",
      headerTransparent: true,
      headerStyle: {
        backgroundColor: '#694fad'
      }
    }
  }
);

该代码有效，但有一个例外是初始酒店屏幕标题与视图数据重叠。任何帮助表示赞赏。

检查以下输出：

【问题讨论】：

标签： react-native react-native-navigation

【解决方案1】：

原来docs 具有误导性（至少对我而言）。我指定了headerTransparent: true,，这是不需要的，因为我只想在屏幕上设置背景颜色。我删除了它并开始正常工作。

【讨论】：