import React from 'react';
import { View, Text, Button, DrawerLayout } from 'react-native';

const HomeScreen = () => {
  return (
    <View>
      <Text>Home Screen</Text>
      <Button title="Open Drawer" onPress={() => this.drawerLayout.openDrawer()} />
    </View>
  );
};

const OtherScreen = () => {
  return (
    <View>
      <Text>Other Screen</Text>
    </View>
  );
};

const App = () => {
  return (
    <DrawerLayout
      drawerWidth={300}
      drawerPosition={DrawerLayout.DrawerPosition.left}
      ref={(ref) => { this.drawerLayout = ref; }}
      renderNavigationView={() => (
        <View style={{ flex: 1, backgroundColor: '#fff' }}>
          <Text>Drawer Content</Text>
          <Button title="Close Drawer" onPress={() => this.drawerLayout.closeDrawer()} />
        </View>
      )}
    >
      <NavigationContainer>
        <Stack.Navigator>
          <Stack.Screen name="Home" component={HomeScreen} />
          <Stack.Screen name="Other" component={OtherScreen} options={{ drawerVisible: false }} />
        </Stack.Navigator>
      </NavigationContainer>
    </DrawerLayout>
  );
};