如何自定义NavigatorIOS的右侧？

Question

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

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

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

Answer 1

嗨，你可以用不同的方式达到这个目的，你可以使用RN Navigator和建立自己的工具栏（左按钮，标题，右边的按钮）。

，所以你可以为工具栏上的模板，像这样

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传递到导航组件

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

您也可以尝试反应本地路由器通量，可能会增加复杂性，但它是如此值得。

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