Ошибка изменения размера заголовка на вашей второй и третьей странице в (реактивная панель навигации)?

Question

Размер заголовка на первой странице правильный, но нежелательные изменения размера заголовка происходят на второй и третьей страницах?

Странная вещь, если Вы поворачиваете телефон, все будет правильно.

Возможно, это связано с тем, что он находится в их домашних книгах или его следует добавить в файлы проекта фрагмента кода Java. Эта проблема возникает только в react-native-cli проекте. Не в Expo CLI

Код этой страницы

import React, { Component } from 'react';
import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
import { Container, Content } from 'native-base'; 
import { createAppContainer } from 'react-navigation';
import { createDrawerNavigator, DrawerItems } from 'react-navigation-drawer';
import { createStackNavigator } from 'react-navigation-stack'; 
  

const styles = StyleSheet.create({
    MainContainer: {
        flex: 1,
        paddingTop: 20,
        alignItems: 'center',
        marginTop: 50,
        justifyContent: 'center',
    },
    container: {
        flex: 1,
        justifyContent: 'center',
        backgroundColor: '#424242'
    },
    text: {
        color: '#fff',
        fontSize: 14,
        marginTop: 5
    },    
    drawerBody: {
        padding: 15,
        height: 130,
        width: 300,
        flex: 1,
        flexDirection: 'column',
        alignItems: 'center',
        backgroundColor: "#517da2",
    },
    icon: {
        tintColor: '#F50057'
    }
});

class SimplyScreen extends Component { 
    render() {
      return (
        <View style={styles.MainContainer}>
          <Text style={{ fontSize: 23 }}> Simply Screen </Text>
        </View>
      );
    }
}

const CustomDrawerContentComponent = (props) => (
    <Container> 
        <Content>
            <DrawerItems {...props} />
        </Content>
    </Container>
);


class NavigationDrawerStructure extends Component {
    toggleDrawer = () => { 
        this.props.navigationProps.toggleDrawer();
    };
    render() {
        return (
            <View style={{ flexDirection: 'row'}}>
                <TouchableOpacity onPress={this.toggleDrawer.bind(this)} style={{ marginRight: 20 }}> 
                    <Text style={{ color:'white' }}> Menu </Text> 
                </TouchableOpacity>
            </View>
        );
    }
}


const FirstActivity_StackNavigator = createStackNavigator({ 
    First: {
        screen: SimplyScreen,
        navigationOptions: ({ navigation }) => ({
            title: 'Demo Screen 1 Onl',
            headerLeft: () => <NavigationDrawerStructure navigationProps={navigation} />,
            headerStyle: {
                backgroundColor: '#517da2',
            },
            headerTintColor: '#fff',
        }),
    }
});


const Screen2_StackNavigator = createStackNavigator({ 
    Second: {
        screen: SimplyScreen,
        navigationOptions: ({ navigation }) => ({
            title: 'Demo Screen 2',
            headerLeft: () => <NavigationDrawerStructure navigationProps={navigation} />,
            headerStyle: {
                backgroundColor: '#517da2',
            },
            headerTintColor: '#fff',
        }),
    }
});


const Screen3_StackNavigator = createStackNavigator({ 
    Third: {
        screen: SimplyScreen,
        navigationOptions: ({ navigation }) => ({
            title: 'Demo Screen 3',
            headerLeft: () => <NavigationDrawerStructure navigationProps={navigation} />,
            headerStyle: {
                backgroundColor: '#517da2'
            },
            headerTintColor: '#fff',
        }),
    }
});


const DrawerNavigatorMain = createDrawerNavigator({
    Screen1: {
        screen: FirstActivity_StackNavigator,
        navigationOptions: {
            drawerLabel: 'Demo Screen 1',
            safeAreaInsets: { top: 0 }
        }
    },

    Screen2: {
        screen: Screen2_StackNavigator,
        navigationOptions: {
            drawerLabel: 'Demo Screen 2',
            safeAreaInsets: { top: 0 }
        },
    },

    Screen3: {
        screen: Screen3_StackNavigator,
        navigationOptions: {
            drawerLabel: 'Demo Screen 3',
            safeAreaInsets: { top: 0 }
        },
    }
},{
    contentOptions: {
        headerStyle: {
            backgroundColor: '#f4511e',
        },
        headerTintColor: '#fff',
        headerTitleStyle: {
            color: 'white',
        } 
    },
    drawerWidth: 300, 
    drawerBackgroundColor: '#262A2C',  
    contentComponent: CustomDrawerContentComponent
});

export default createAppContainer(DrawerNavigatorMain);