如何自定義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