Different behaviours of Shell Flyout on macOS vs WinUI

[WisJamison]

Description

Hi, I found some different behaviours of Shell Flyout in Mac catalyst vs WinUI

1. Hamburger button has different locations: Title bar for WinUI vs below TitleBar for Mac Catalyst.

• So when I setting Shell.NavBarIsVisible="False", on macOS, the Hamburger Button will disappear, while on Windows, it will still there

2. When I set Shell.FlyoutBehavior="Disabled"

• If I clicked outside of the Flyout, Flyout will be closed on Windows while still open on macOS

3. When I set Shell.FlyoutBehavior="Flyout"

• If I clicked on a layout (stack layout, grid, etc.) within the Flyout, Flyout will be closed on macOS;
• If I clicked on a button within the Flyout, Flyout still be keep open on macOS;
• While on Windows, the Flyout will keep open both when clicking on a layout and button

Steps to Reproduce

1. Download the sample project;
2. Give different Value to Shell.NavBarIsVisible and Shell.FlyoutBehavior just as I mentioned in Description Section and see different behaviors in macOS and Windows.

Link to public reproduction project repository

https://github.com/WisJamison/Flyout-Behaviour-Sample

Version with bug

7.0.86

Last version that worked well

Unknown/Other

Affected platforms

I was not able test on other platforms

Affected platform versions

macOS Version 13.3.1, Window 10.0.19044.2965

Did you find any workaround?

No.

Relevant log output

No response

[ghost]

We've added this issue to our backlog, and we will work to address it as time and resources allow. If you have any additional information or questions about this issue, please leave a comment. For additional info about issue management, please read our Triage Process.

[PureWeen]

@WisJamison for item one, if you were able to hide the Flyout Button on windows does that give you what you need?

[WisJamison]

@PureWeen Yes, it's my expectation.

[faustmet]

@PureWeen for point 2 what we are looking for is the flyout to close when you click outside of it on Mac, just as it does on Windows. For point 3, the expected behavior is for any click within the flyout to keep the flyout open on Mac, just as it does on Windows. TIA!

[linkaiyu]

I added workaround code to AppShell.xaml and .cs to the repro. please take a look and let me what is missing

[faustmet]

There are 2 more piece of functionality we are looking for with the flyout across BOTH windows and Mac OS- 4. When a user has flyout open, they would like to interact with a window (click button, close window) inside the container and have BOTH the flyout dismiss as well as have the action clicked, fire. 5. I would like to have the ability to close the flyout after clicking a button in the flyout. I think this should be a configurable option we may want to give users in the future. The thought is that after initial setup, users most likely only want to open one tool at a time from the flyout. This behavior is consistent with how the windows Start menu behaves, it closes after a tool is selected. I would also like this option to behave consistently across windows and mac OS when turned ON.

[XamlTest]

Verified this on Visual Studio Enterprise 17.9.0 Preview 1(8.0.3). Results as below: Repro project: Flyout-Behavior.zip

1. Issue 1 does not repro on 8.0.3. When setting Shell.NavBarIsVisible="False", the Hamburger Button disappeared on Windows and MacOS.
2. Issue 2 still repro on 8.0.3. When setting Shell.FlyoutBehavior="Disabled", clicked outside of the Flyout, Flyout will be closed on Windows while still open on macOS.
3. Issue 3 still repro on 8.0.3. When setting Shell.FlyoutBehavior="Flyout", clicked on a Layout Item within the Flyout, Flyout will be closed on macOS while throw an exception "System.NotImplementedException" on Windows. Windows:

[logikonline]

Another variation is if you install an iOS app on a M1 Mac or above, not as a Mac catalyst, but as an iOS app. If the user resizes the window when the Flyout is supposed to collapse - it will lock up and crash the app.

You can see this by using TestFlight and install the iOS app on the Mac.