Skip to content

IOS - sidemenu visible: true/false doesn't work when sidemenu has width set #8068

@robmcilroy1992

Description

@robmcilroy1992

What happened?

We use the below when creating the sidemenu

Navigation.setRoot({
    root: {
      sideMenu: {
        options: {
          popGesture: false,
          sideMenu: {
            left: {
              enabled: false,
              width: calculateSideBarWidth(),
              openMode: "aboveContent",
            },
      ....
});

Then when hiding the sidemenu

   Navigation.mergeOptions(componentId, {
        sideMenu: {
          left: {
            visible: false,
          },
        },
      });

But this causes the below.

From

Image

To

Image

What was the expected behaviour?

I expect the sidemenu visible: true/false to be respected regardless of width being set or not.

Note we have a workaround to width to 1 when visible: false but causes a janky animation on close, not as smooth as android.

Was it tested on latest react-native-navigation?

  • I have tested this issue on the latest react-native-navigation release and it still reproduces.

Help us reproduce this issue!

No response

In what environment did this happen?

React Native Navigation version: 0.8.1
React Native version: 0.77.2
Has Fabric (React Native's new rendering system) enabled: (yes/no) Yes
Node version: 20.2
Device model: IPhone 16 Pro Simulator
iOS version: 18.4

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions