如何自定义NavigatorIOS的右侧？

Question

我想让我的导航栏（NavigatorIOS组件）像Whatsapp的栏一样。在栏的右侧必须有旁边的个人资料图片和一个呼叫按钮。

我该怎么做？我应该使用哪个属性？

或者我应该使用Navigator组件吗？

Answer 1

您好，您可以通过不同方式实现这一目标，您可以使用导航器并构建自己的工具栏（左键，标题，右键）。

所以你可以为工具栏提供一个模板，比如这个

let routeMapper = {
  LeftButton: (route, navigator, index, navState) =>
    { return (<Text>Cancel</Text>); },
  RightButton: (route, navigator, index, navState) =>
        { return (<Text>Done</Text>); },
  Title: (route, navigator, index, navState) =>
        { return (<Text>Awesome Nav Bar</Text>); },
}

请注意，您可以为“右键”部分提供模板。

然后你需要将routeMapper传递给Navigator组件

navigationBar={
    <Navigator.NavigationBar
        routeMapper={routeMapper}
        style={{backgroundColor: 'gray'}}
    />
 }

你也可以尝试 react-native-router-flux ，可能会增加复杂性，但它非常值得。

https://github.com/aksonov/react-native-router-flux