A Slide Menu inspired from Android for React Native

Ilan Sasportas is giving our React Native Components a bit of contamination coming from Android's UX. Here is his Navigation Drawer for iOS.

react-native-navigation-drawer on GitHub

A slide menu as we can see in Android which permits to route an item from the menu to a view displayed on the front view (check out the example to create your routes).

This Slide Menu comes from the right edge but hopefully it will be possible to choose in a near future. To open it you have to slide from the right border (and not from anywhere on the screen).

var BasicExample = React.createClass({
  getInitialState(fragmentId) {
    return { route: "firstpage" };
  },

  updateFrontView() {
    //routing your pages here, don't forget to add a section in the menu ;)
    switch (this.state.route) {
      case "firstpage":
        return <FirstPage />;
      case "secondpage":
        return <SecondPage />;
    }
  },

  routeFrontView(fragmentId) {
    this.setState({ route: fragmentId });
  },

  render() {
    var fragment = this.updateFrontView();
    return (
      <View style={styles.container}>
        <SlideMenu
          frontView={fragment}
          routeFrontView={this.routeFrontView}
          menu={<Menu />}
        />
      </View>
    );
  },
});

Slide Menu