I've been having this problem for a long time and I just can't find an answer for fixing it.
Here is an actual screenshot of what is happening.
The problems are:
1. Back button by default on Newsfeed screen
2. Double header
3. TabBar disappears when navigating to any global screens
The code itself:
routes.js
const RecordScreen = StackNavigator({
Main: { screen: Record },
Choose: { screen: RecordChoose },
Add: { screen: RecordAdd }
})
const NewsfeedScreen = StackNavigator({
Main: { screen: Newsfeed },
Details: { screen: NewsfeedDetails }
})
export const FriendsScreen = StackNavigator({
Main: { screen: Friends },
List: { screen: FriendList }
})
const Tabs = TabNavigator({
Record: { screen: RecordScreen },
Newsfeed: { screen: NewsfeedScreen },
Friends: { screen: FriendsScreen }
})
// is it correct to nest TabNavigator with StackNavigator like this?
export const LoggedIn = StackNavigator({
Main: { screen: Tabs },
// global Screens
Gallery: { screen: Gallery },
Profile: { screen: Profile },
Settings: { screen: Settings }
})
export const LoggedOut = StackNavigator({
Welcome: { screen: Welcome },
SignIn: { screen: SignIn },
SignUp: { screen: SignUp }
})
index.js
import React, { Component } from 'react'
import { LoggedIn, LoggedOut } from '@routes'
class Main extends Component {
// of course is not exactly like this,
// just an example
state = {
loggedIn: true
}
render() {
return this.state.loggedIn
? <LoggedIn />
: <LoggedOut />
}
}
Any help is appreciated! Thank you.
does the following change make things any better?
from:
export const LoggedIn = StackNavigator({
Main: { screen: Tabs },
// global Screens
Gallery: { screen: Gallery },
Profile: { screen: Profile },
Settings: { screen: Settings }
})
to
const doNotShowHeaderOption = {
navigationOptions: {
header: null,
},
};
export const LoggedIn = StackNavigator({
Main: { screen: Tabs, ...doNotShowHeaderOption, },
// global Screens
Gallery: { screen: Gallery },
Profile: { screen: Profile },
Settings: { screen: Settings }
})
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.