无法在 React Native Paper 中更改卡片标题文本的颜色

Posted

技术标签:

【中文标题】无法在 React Native Paper 中更改卡片标题文本的颜色【英文标题】:Can't change color of Card Title text in React Native Paper 【发布时间】:2021-01-30 19:54:41 【问题描述】:

我刚刚开始使用 React Native 并将 Paper 用于 UI 元素。我正在为当前屏幕使用卡片布局:

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>
    )
)

我正在尝试将标题部分的颜色更改为绿色,将文本的颜色更改为白色。所以我有以下风格:

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

奇怪的是背景颜色按预期改变,但文本颜色仍然是黑色。谁能提出为什么会这样?

【问题讨论】:

【参考方案1】:

您可以使用 titleStyle 设置标题react-native-paper

【讨论】:

【参考方案2】:

按照 Nooruddin 的建议,但带有代码示例:

titleStyle= color: "#f00" 

【讨论】:

以上是关于无法在 React Native Paper 中更改卡片标题文本的颜色的主要内容,如果未能解决你的问题,请参考以下文章

npm install react-native-paper 期间的问题

React Native 更改 let 值不会在子组件中更改为道具

聚焦时如何摆脱React Native Paper TextInput的底部边框

减少 react-native-paper TextInput 的高度和垂直填充

React Native:图像 URI 不适用于发布 apk

React Native Paper 按钮不会触发 onpress