topBar isn't showing in iOS (can't test in Android because of a build issue). I have the side menu working fine.
I have tried to set the topBar options using:
static get options() {
return {
topBar: {
title: 'Collapse',
textColor: 'black',
textFontSize: 16,
backgroundColor: 'red',
hidden: false,
drawUnder: false
}
}
}
and
componentDidMount() {
Navigation.setOptions(this.props.componentId, {
topBar: {
title: 'Collapse',
textColor: 'black',
textFontSize: 16,
backgroundColor: 'red',
hidden: false,
drawUnder: false
}
});
}
Also:
function start() {
registerScreens();
Navigation.events().onAppLaunched(() => {
Navigation.setRoot({
sideMenu: {
left: {
component: {
name: 'navigation.SideMenuScreen'
}
},
center: {
component: {
name: 'navigation.HomeScreen'
}
}
}
});
});
}
Solved this by putting the center component into a stack (undocumented).. Which is required for when using the topBar.
Navigation.setRoot({
sideMenu: {
left: {
component: {
name: 'navigation.SideMenuScreen'
}
},
center: {
stack: {
children: [
{
component: {
name: 'navigation.HomeScreen',
}
}
],
options: {
topBar: {
title: 'Collapse',
textColor: 'black',
textFontSize: 16,
backgroundColor: 'red',
hidden: false,
drawUnder: false
}
}
}
}
}
});
Most helpful comment
Solved this by putting the center component into a stack (undocumented).. Which is required for when using the topBar.