Splitter

[OnsenUI]

A component that enables responsive layout by implementing both a two-column layout and a sliding menu layout. It can be configured to automatically expand into a column layout on large screens and collapse the menu on smaller screens. When the menu is collapsed the user can open it by swiping.

Click here to see the original article

[zabojad]

I do not understand the use of this component when collapse is set to true. The SplitterSide cannot be closed when collapse is true…

[Fran Diox]

@zabojad I’m guess you are passing a string 'true', instead of a boolean true. The example in the tutorial uses a boolean and it can always be closed.

[zabojad]

@Fran-Diox try setting collapse to false (the boolean value, not a string) and you’ll see that the SplitterSide cannot be closed…

  render: function() {
    return (
      <Ons.Splitter>
        <Ons.SplitterSide
          style={{
              boxShadow: '0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23)'
          }}
          side='left'
          width={200}
          collapse={false}
          swipeable={true}
          isOpen={this.state.isOpen}
          onClose={this.hide}
          onOpen={this.show}
        >

IMO, it should make it not overlaying the SplitterContent but still with keeping the possibility to close / swipe it.