CODEWITHSUNDEEP
react-nativereact-navigation
herd
herd

Reputation: 195

Duplicated top header using react-navigation

I'm starting this little project with three tabs.

The title is showing correctly on each one of the tab items, but the header is duplicated on the views.

If I put the below code in the screen, the duplicated header is gone, but the title is not showing anymore.

static navigationOptions = {
header: null,
};

If I put this code, the title is not shown, the title is only showing when I put the title on creation of the createStackNavigator.

static navigationOptions = {
title:  'Some Title'
};

Here is the full code and some screenshots of the problem.

Code: https://gist.github.com/alanPTK/7c3de2d7cecea38cf64df1525fd6b3d2

Screenshots: https://i.sstatic.net/dybgJ.jpg

Upvotes: 0

Views: 743

Answers (1)

crodev
crodev

Reputation: 1491

Try setting

headerMode: 'none',
navigationOptions: {
    headerVisible: false,
}

in your StackNavigators navigationOptions, it will remove the top header which will leave the bottom header on each screen, so you can set title on each screen with 

static navigationOptions = {
   title: "Your title"
}

Upvotes: 1

Related Questions