Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

cannot change colour of label in <DrawerItem> react-native

enter image description here

As given in the code, I have tried and I wanted if the "Home" displaying in Drawer can become white by chance?

<Drawer.Section style={{backgroundColor:"green"}}>
            <DrawerItem 
              icon={({ color, size }) => (
                <Icon name="home-outline" color={"white"} size={size}/>
              )}
              label="Home"
              color="white" //as this is not working
              onPress={() => {
                props.navigation.navigate("Home");
              }}
            />
    </Drawer.Section>
like image 478
itsrankit Avatar asked Dec 23 '22 17:12

itsrankit


2 Answers

There is no property for color, you have the below props to style your DrawerItem

  • activeTintColor: Color for the icon and label when the item is active.
  • inactiveTintColor: Color for the icon and label when the item is inactive.
  • activeBackgroundColor: Background color for item when it's active.
  • inactiveBackgroundColor: Background color for item when it's inactive.
  • labelStyle: Style object for the label Text.
  • style: Style object for the wrapper View.
like image 109
Guruparan Giritharan Avatar answered Feb 11 '23 17:02

Guruparan Giritharan


We can change Drawer.Section title color using this

            <Drawer.Section
              title={
                <Text style={{color: colors.textColor}}>Preferences</Text>
              }>
like image 29
Mitesh K Avatar answered Feb 11 '23 17:02

Mitesh K