如何在反应导航中完全改变抽屉的背景颜色

Question

如何完全改变抽屉的背景颜色？我不需要更改抽屉项目就可以完全改变抽屉的背景颜色。默认情况下，它是白色，而我需要使它变成绿色。有没有演示例子？

Answer 1

该电流例如可以帮助你，这是用DrawerContent的DrawerNavigtor，需要改变DrawerContent的风格

const Main = DrawerNavigator({ 
    home: { screen: HomePage }, 
}, { 
    drawerWidth: 250, 
    drawerPosition: 'right', 
    contentComponent: props => <DrawerContent {...props} />, 
}); 

出口默认的主; 您可以通过以下

class DrawerContent extends Component { 
    render() { 
    return (
     <ScrollView style={styles.container}> 
     <View style={{ flex: 1 }}> 
      <Button transparent info onPress={() => { this.handlechange(); }}> 
      <Text style={{ fontSize: 16 }}>Change Email</Text> 
      </Button> 
     </View> 
     </ScrollView> 
    ); 
    } 
} 


const styles = { 
    container: { 
    flex: 1, 
    padding: 20, 
    backgroundColor: 'Green', 
    }, 
}; 

出口默认DrawerContent的这段代码改变风格; 这可以改变背景颜色