I've read a lot of comments about it, but I didn't resolve my problem. So my navigation code looks like this
export function pushScreens() { Navigation.setRoot({ root: { sideMenu: { id: 'sideMenu', left: { visible: true, component: { id: 'Drawer', name: SIDE_DRAWER, }, }, center: { bottomTabs: { children: [{ stack: { children: [{ component: { name: HOME_SCREEN, passProps: { text: 'Home' }, } }], options: { bottomTab: { text: 'Home', icon: HomeIcon, testID: 'FIRST_TAB_BAR_BUTTON' }, } } }, { component: { name: PROFILE_SCREEN, passProps: { text: 'Profile' }, options: { bottomTab: { text: 'Profile', icon: HomeIcon, testID: 'SECOND_TAB_BAR_BUTTON' }, } } }, { component: { name: POSTS_SCREEN, passProps: { text: 'Posts' }, options: { bottomTab: { text: 'Posts', icon: HomeIcon, testID: 'SECOND_TAB_BAR_BUTTON' } } } }] } } } } }); }
I can pull the drawer from the left side of the screen by default, but how I could add the icon for that?
On the view that you wish to have the hamburger button, add:
static get options() {
topBar: {
leftButtons: [
{
color: colors.white,
id: TOOLBAR_HUMBERGER_BUTTON_ID,
icon: require("../resources/hamburger_topBar_button.png")
}
]
};
return topBar;
}
and then handle it like every other button of topBar:
navigationButtonPressed({ buttonId }) {
if (buttonId == TOOLBAR_HUMBERGER_BUTTON_ID) {
Navigation.mergeOptions(SIDEMENU_ID, {
sideMenu: {
left: {
visible: true
}
}
});
}
}