CODEWITHSUNDEEP
react-nativereact-navigation
JunMa
JunMa

Reputation: 1

How to custom my Navigation in react-navigation

OK, I choose react-navigation , so I write a demo

  1. create a sample screen named PageScreen

  2. create a TabNavigator 

    export const MainScreenNavigator = TabNavigator({
    PageScreen: {screen: PageScreen, navigationOptions: { title: 'page1' }},
    PageScreen1: {screen: PageScreen, navigationOptions: { title: 'page2' }}
})

  3. this is the result:

    (result TabNavigator fill Horizontal)

  4. my questions is :

    A: if my two screen links the same page , but I want to use a params to differentiate. for example if page1 ,PageScreen show page1 ,if page2 show page2. I don't find the method to pass param

    B: in some apps , navigation not fill Horizontal navigation is short not fill-x

How to modify navigation's style ?

Upvotes: 0

Views: 296

Answers (1)

Tyreal Gray
Tyreal Gray

Reputation: 373

You should custom your navigation according to here: https://reactnavigation.org/docs/navigators/custom

then you could have you own tab view style which fit your requirement

If you are looking for example you could check the official example code in github: https://github.com/react-community/react-navigation/blob/master/examples/NavigationPlayground/js/CustomTabs.js

Upvotes: 1

Related Questions