使用本机反应更改屏幕的背景颜色

时间:2017-11-02 09:26:41

标签: reactjs react-native

我使用堆栈导航器导航到一个视图。新屏幕有不同的背景颜色#E9E9EF,我不知道它来自哪里。我发现这个颜色是在react-navigation / lib / views / CardStack / Card.js中设置的。 我试图改变视图背景颜色,但它没有工作

return (
  <View style={{backgroundColor: '#F5FCFF'}}>
  </View>
)

我还试图在StackNavigator中使用此代码更改卡片样式,颜色没有改变

Other: {
    screen: AppOtherContainer,
    cardStyle: {backgroundColor: 'red'},
    navigationOptions: ({navigation}) => ({
      title: navigation.state.params.title
    })
  }

2 个答案:

答案 0 :(得分:0)

尝试将tintColor添加到导航选项

static navigationOptions = {
    title: navigation.state.params.title,
    header: navigation => ({
      titleStyle: {
        color: '#FFFFFF'
      },
      tintColor: '#F5FCFF'
    })
}

答案 1 :(得分:0)

如果您想更改标题颜色,请尝试此操作。

static navigationOptions = {
     title: navigation.state.params.title,
     headerStyle: {backgroundColor:"red"}}

如果要更改渲染的屏幕的背景颜色,请设置

<View style={{backgroundColor: 'red', flex:1}}> </View>