更改场景标题元素的文本颜色

Question

我正在使用 React Native 和 react-native-router-flux.

创建一个小型 Android 移动应用程序

除了主屏幕的 leftTitle 和 rightTitle 属性，我已经自定义了所有内容。我可以给它们命名，但我不能给它们设计样式。它们保持这种蓝色，如下图所示。

这是该场景的代码：

<Scene
  rightTitle="Add"
  onRight = { () => Actions.employeeCreate() }
  key="employeeList"
  component={EmployeeList}
  title="Employees"
  leftTitle="Log Out"
  onLeft={ () => logUserOut() }
  initial
/>

有谁知道如何更改标题文本的颜色？

谢谢！

Answer 1

在 node modules

react-native-router-flux

导航到 react-native-router-flux > src > NavBar.js
像这样在样式表中编辑颜色样式 barRightButtonText 和 barLeftButtonText

对于右键文本：

 barRightButtonText: {
    color: 'rgb(0, 122, 255)',    //Your rgb color code here
    textAlign: 'right',
    fontSize: 17,
  },

对于左键文字

 barLeftButtonText: {
    color: 'rgb(0, 122, 255)',  //Your rgb color code here
    textAlign: 'left',
    fontSize: 17,
  },

Answer 2

反对@Akila Devinda 所说的道具与样式无关。是的，您可以按照 react-native-router-flux

文档中的说明使用 props 设置导航栏样式

Click here for the documentation 如你所见，我使用道具自己设计了样式

这是代码

const App = () => {
 return(
   <Router navigationBarStyle={{ backgroundColor: '#3F51B5' }}>
    <Scene key="root">
    <Scene key="home" component={ HomeScreen } title="Home"  titleStyle={ { color: 
      "#ffffff" } } initial />
    <Scene key="about" component={ AboutScreen } title="About" titleStyle={ { color: 
         "#ffffff" } } navBarButtonColor="white"/>
   </Scene>
   </Router>
 )
}

在我看来，在定义导航栏特定样式时，这样做而不是直接在 src 文件中设置样式会更好

更改场景标题元素的文本颜色

change text color of title elements for a scene

react-native

react-native-router-flux