Add hamburger button to React Native Navigation

NoxiousFox1102 picture NoxiousFox1102 · May 16, 2017 · Viewed 20.9k times · Source

I'm very new to React-Native so I definitely may be missing something. But all I want to do is add a hamburger type button to a settings page in the main Navigation bar. I have set up a link in the main part of that works the way I want hamburger button to work. Screenshot

Answer

Andreyco picture Andreyco · May 16, 2017

Having this, you're very close to solution.

static navigationOptions = {
  title: 'Welcome',
  headerLeft: <Button onPress={ WHAT GOES HERE?? } title= "=" />
};

Little know fact is navigationOptions accept function which return navigation options. That function accept some props, navigation one of them. Know this, adjust your code a little.

static navigationOptions = function(props) {
  return {
    title: 'Welcome',
    headerLeft: <Button onPress={() => props.navigation.navigate('DrawerOpen')} title= "=" />
  }
};