Can't change color of Card Title text in React Native Paper

3.7k views Asked by At

I'm just getting started with React Native and using Paper for UI elements. I'm using a card layout for my current screen:

{cardData.map((card, index) => {
    return(
    <Card key={index}>
      <Card.Title title="Card Title" subtitle="Subtitle" style={styles.cardHeader} />
      <Card.Content>
        <Paragraph>{card.content}</Paragraph>
      </Card.Content>
      <Card.Cover source={{ uri: 'https://picsum.photos/700' }} />
      <Card.Actions>
        <Button>Cancel</Button>
        <Button>Ok</Button>
      </Card.Actions>
    </Card>
    )
})}

I'm trying to change the color of the title section to green, an the color of the text to white. So I have the following style:

const styles = StyleSheet.create({
  cardHeader: {
    backgroundColor: '#00bc8c',
    color: '#ffffff'
  }
});

Strangely the background color changes as expected, but the text color remains black. Could anyone suggest why this may be the case?

2

There are 2 answers

0
Nooruddin Lakhani On BEST ANSWER

You can use titleStyle for styling title react-native-paper

0
Daniel Danielecki On

As suggested by Nooruddin, but with a code sample:

titleStyle={{ color: "#f00" }}