Ignite: Navigate between views and change the left button of the title

[juancabraal]

It is not an error, but there is no documentation talking about that.

What I want to do is: when the user clicks on any sidemenu item he goes to the screen and the left button has to be the menu button again and not the back button.

Can someone help me with this? Please!!!

[skellock]

Do you have a repo available that I could look at? What have you tried so far?

[juancabraal]

Sorry for the later reply skellock,

I tried it:
NavigationActions.usageScreen({initial: true});

And another methods that I can't remember now.

What I want is the back button becomes the menu button when I go to this page

[skellock]

Check out your NavigationRouter.js file.

Inside you'll see a scene for your usage screen.

On that node, place something like this: renderLeftButton={NavItems.hamburgerButton} just like it is for the presentationScreen scene.

Does that work?

[juancabraal]

skellock thanks for the fast reply,

<Scene key='componentExamples' component={AllComponentsScreen} title='Components' />

This is the scene, if I put renderLeftButton={NavItems.hamburgerButton} gives me an error saying
NavItems indefined,

I know I have to create the hamburgerButton on the styles, but what should I have to put there?

[skellock]

See this line:

https://github.com/infinitered/ignite/blob/master/ignite-base/App/Navigation/NavigationRouter.js#L31

Go to your own App/Navigation/NavigationRouter.js file and plug the renderLeftButton={NavItems.hamburgerButton} in there.

That should override the button that you see when you get to that usage screen in your app.

[juancabraal]

Thank you so much skellock,
The button appeared, but the back button still there, look

And when I click on the hamburg button it doesnt open the drawer :(

[skellock]

I see. Ya... the back button is clobbering the hamburger.

See like this is an issue with React Native Router Flux?

https://github.com/aksonov/react-native-router-flux/blob/f541ffb38af879f73e9d34b26a2b3bdb2bbdd573/src/NavBar.js#L472

I wonder if you were also in your scene to also add: renderBackButton={null} would that work?

[skellock]

Or even renderBackButton={() => false} ?

[juancabraal]

renderBackButton={() => false}

Perfect!!!!!!

Doesn't even need to put

renderRightButton={NavItems.hamburgerButton}

The perfect solution skellock, thank you so much

[BipinBhandari]

For me renderBackButton={() => false} didn't work. It only hide the back button. And renderLeftButton also didn't work.

So I solved this issue by using this technique:

Setting this in NavigationRouter.js

<Scene type={ActionConst.REPLACE} key='forex' title='Forex' renderLeftButton={NavItems.hamburgerButton} />

and in DrawerContent.js

  handleCalendarPress = () => {
    this.toggleDrawer({type: ActionConst.RESET})
    NavigationActions.calendar()
  }

Here is the reference: https://github.com/aksonov/react-native-router-flux/blob/master/docs/API_CONFIGURATION.md#actionconst

Hope this would be helpful to someone.

[bhushanjawle]

Thank you @skellock for the snippet to hide back button. Thank you @BipinBhandari for the code snippet, worked for me to get display the hamburger menu after login.