React-native-navigation: [v2] is there a way to set width of sideMenu??

[NweThazin]

Issue Description

I'm trying to set the width of sidemenu in default options.
(https://github.com/wix/react-native-navigation/issues/197)]

Steps to Reproduce / Code Snippets / Screenshots

Navigation.setDefaultOptions({
sideMenu: {
right: {
width:300
}
}
});

---

Environment

• React Native Navigation version:"^2.0.2556"
• React Native version: "0.55.4"
• Platform(s) (iOS, Android, or both?): both
• Device info (Simulator/Device? OS version? Debug/Release?): all

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you believe the issue is still relevant, please test on the latest Detox and report back. Thank you for your contributions.

[denieler]

yeah, it looks like, check this one - https://wix.github.io/react-native-navigation/#/docs/styling?id=common-options

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you believe the issue is still relevant, please test on the latest Detox and report back. Thank you for your contributions.

[byonghun]

Has this issue been figured out?
Currently, setting width to sideMenu is not working on Android. On iOS, it works fine but on Android the width is always set to about 80%.

I tried setting
`
static options(props) {
sideMenu: {
left: {
width: SCREEN_WIDTH
}
}
}

`

[stale[bot]]

The issue has been closed for inactivity.

[guyca]

@byonghun Which RNN version are you using? afaik this works as expected on Android.

[wmoore98]

I'm having the same issue as @byonghun using:
React-native-navigation: "^2.7.1"
React-native: "^0.57.8"

I have tried using default options (Navigation.setDefaultOptions) and setting options in the layout. In both places, changes to bottomTabs and bottomTab took effect, but not sideMenu.

Update:
I finally managed to find one way to get the side menu width set using Navigation.setRoot. Here's the truncated version. The main issue seems to be setting the right property at the right level.

    Navigation.setRoot({
      root: {
        sideMenu: {
          left: {...
          },
          center: {...
          },
          options: {
            sideMenu: {
              left: {
                width: 200
              }
            }
          }
        }
      }
    });

[flikQ]

@wmoore98 this currently cause a black screen in place of the sidemenu in all versions above 2.8.0 :(

[zabojad]

@flikQ for me it works with version 2.17.0.

@wmoore98 good catch!

@guyca @ItsNoHax we have a bug here. This setting (sidemenu>left>width) is ignored on Android (not on iOS) when set via default options but is correctly set when passed in the setRoot call... Could that be at least tagged as bug for a later fix?

[rishabhSmartdata]

@NweThazin @denieler @byonghun @guyca
When i am set the custom width for sidemenu then my sidemenu is going to black

Navigation.setRoot({

root: {
sideMenu: {
left: {
visible:true,
component: {
id: "sideDrawer",
name: "SideMenu",

    },
  },
  center: {
    stack: {
      id:'CENTER_STACK',
      children: [{
        component: {
          name:"NewCard",
        },

      }]
    },

  },
  options: {
    sideMenu: {
      left: {
        width: Platform.OS === 'ios'? Platform.isPad ?500:310:null,           
      },
    }
  }


}

}

[lethehoang]

Duplicate of #