flutter / samples

A collection of Flutter examples and demos

Home Page:https://flutter.github.io/samples/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Photo Search: Menu items have rounded corners

timsneath opened this issue · comments

On Windows 11, the photo search app menus have rounded corners:
image

Use DwmSetWindowAttribute to set rectangular windows, as follows:

final attr = DWMWINDOWATTRIBUTE.DWMWA_WINDOW_CORNER_PREFERENCE;
final pref = calloc<Uint32>()
  ..value = DWM_WINDOW_CORNER_PREFERENCE.DWMWCP_DONOTROUND;

DwmSetWindowAttribute(hwnd, attr, pref, sizeOf<Uint32>());

calloc.free(pref);

What is the exact issue and how to reproduce it?

Thanks for the report @timsneath. This almost feels like something we should be fixing in the win32 runner, not the sample code.

Thoughts @csells?

Can we fix it in the sample until we have it fixed in the embedding?

fyi @cbracken @gspencergoog

@timsneath Can you give guidance on where I need to make this modification? I'm guessing since this is a change to hwnd, and I'm guessing the menu drop downs are individual windows, I'm guessing the fix has to be added to https://github.com/google/flutter-desktop-embedding/tree/master/plugins/menubar/windows?

/cc @stuartmorgan who probably knows a thing or two about this.

menubar is creating the menus using standard Win32 APIs for creating menus. It never interacts directly with the underlying HWNDs.

Why is this a bug? Isn't this just how Windows 11 works?

I just tried to replicate using the Windows 11 developer image, and this is what I'm seeing:

Untitled

@timsneath can you explain how to replicate what you are seeing on a clean windows 11 install?

Hmm... is your window maximized, @domesticmouse? What does winver report for your version?

I'm running the Windows Insider builds, haven't knowingly changed any defaults. But it's possible that there's something weird about the current build in this regard.

Here are the instructions on what to do with menus, @stuartmorgan:
https://docs.microsoft.com/en-us/windows/apps/desktop/modernize/apply-rounded-corners#example-4--rounding-the-corners-of-a-menu-with-a-small-radius---c

If we're doing that (or that's being done automatically), then perhaps we're good?

Here are the instructions on what to do with menus, @stuartmorgan: https://docs.microsoft.com/en-us/windows/apps/desktop/modernize/apply-rounded-corners#example-4--rounding-the-corners-of-a-menu-with-a-small-radius---c

That's about making custom menus:

By default, menus are pop-up windows, which do not get rounded. If your app creates a custom menu and you want it to follow the rounding policy of other standard menus [...]

It explains how to make a menu that's not made using normal menu APIs look rounded in order to match those that are made using normal menu APIs.

menubar is, as I said above, using standard menus. And it's already rounded in your screenshot.

If we're doing that (or that's being done automatically), then perhaps we're good?

My confusions here is your bug report is that we are getting the standard behavior (which is apparently now rounded). I still don't understand why that's a bug.

From Apply rounded corners in desktop apps for Windows 11:

Note

By design, apps are not rounded when maximized, snapped, running in a Virtual Machine (VM), running on a Windows Virtual Desktop (WVD), or running as a Windows Defender Application Guard (WDAG) window.

Looks like I need to upgrade my machine, instead of using the Developer VM. Yay.

But yeah, this might be by design, which is Stuart's point.

Now that I have upgraded my desktop to Windows 11, I can safely say that some apps have rounded menus. Windows Terminal and Google Chrome both show rounded menus, while VSCode and GitHub desktop tooling do not.

It looks like rounded menus on Win11 is going to be a hot mess. At this point I'm closing this as WAI.