在 React-native 中，如何更改 NavigatorIOS 的样式

Posted 2023-03-15

【中文标题】在 React-native 中，如何更改 NavigatorIOS 的样式

【英文标题】：in React-native, How to change the styles of NavigatorIOS

【发布时间】：2015-04-13 08:22:41

【问题描述】：

在react-native中，如何改变Navigatorios的样式，比如backgroundColor？谢谢！

var speedNews = React.createClass(
  render: function() 
    return (
      <NavigatorIOS style=styles.container 
      initialRoute= 
        title: 'SpeedNews',
        component: ViewList
      />
    );
  
);

var styles = StyleSheet.create(
  container: 
    flex: 1,
    backgroundColor : 'red', // it do nothing
    color : '#ffffff' // it do nothing
  
);

【参考方案1】：

据我所知，您只能更改以下属性：

barTintColor

：栏的背景颜色。

titleTextColor

：字体颜色。

tintColor

：按钮的颜色。

<NavigatorIOS
  barTintColor='#000'
  titleTextColor='#fff'
  tintColor='#fff'
  initialRoute=
    title: 'SpeedNews',
    component: ViewList
   />

【讨论】：

出于好奇，如何将运营商、时间和电池图标的字体改为白色？

@JoshPinter 有一个 StatusBar 组件：。在此处查看更多信息：facebook.github.io/react-native/docs/statusbar.html

@alfred 感谢您的跟进。

【参考方案2】：

也许我们可以使用“react-native-router”

【讨论】：

这不是一个真正的答案。如果您使用 React Native Router lib 成功编辑了导航组件的样式，请编辑您的答案并发布代码来执行此操作。但如果没有，您应该考虑编辑您的问题，添加此链接作为一种试验方式。