​Support Mica/Acrylic on Windows

[Daydreamer-riri]

Description

Electron has just merged a PR that adds support for Windows Mica material. I think AFFiNE can follow up on this feature, and I am willing to assist in its implementation.

It is currently unknown when this feature will be released in Electron, but I will continue to keep an eye on it.

Use case

No response

Anything else?

see:

• https://github.com/electron/electron/blob/main/docs/api/browser-window.md#winsetbackgroundmaterialmaterial-windows
• https://learn.microsoft.com/en-us/windows/apps/design/style/mica

Are you willing to submit a PR?

• Yes I'd like to help by submitting a PR!

[himself65]

/cc @hwangdev97

[pengx17]

AFAIK the change of https://github.com/electron/electron/blob/main/docs/api/browser-window.md#winsetbackgroundmaterialmaterial-windows is pretty new and will land in Electron 26.

Ops, it looks it is already landed in Electron 24 electron/electron#38361 and will probably will be released in this week.

[pengx17]

Yeah, it is now released in https://github.com/electron/electron/releases/tag/v24.4.0
@Daydreamer-riri you can take your time and create a pr for this one.

[Daydreamer-riri]

Sure, I will submit this PR as soon as possible.

[Daydreamer-riri]

Currently, there are still some issues with this feature, it did not achieve the expected effect when titleBarStyle was set to hidden.

I have already provided feedback in the Issue. I will continue to follow up on it.

[Daydreamer-riri]

Personally, I think the default title bar of Win11 looks pretty good 🫠(although there are some details that need to be addressed). However, there is currently a bug where it cannot be resized.

[pengx17]

@hwangdev97 can you provide your feedback in designers' perspective?

[Daydreamer-riri]

I think perhaps we should wait and see how Electron handles this bug.

[hwangdev97]

From a product design perspective, we will provide settings to enable or disable the default title bar, which seems to look good on Windows 11, although some details may need to be improved. I think we can handle this feature after fixing bugs in Electron. Once the new settings are completed, we can provide an option to enable the title bar (while also addressing the details in the screenshot).

[pengx17]

@Daydreamer-riri can you please create a PR so that we can have a look?

[Daydreamer-riri]

@Daydreamer-riri can you please create a PR so that we can have a look?

Currently, I just set the backgroundMaterial and transparent values, no further changes have been made.

I think I need to know whether the transparent attribute needs to be true after electron fix this bug.

[pengx17]

blocked by electron/electron#38454

[affine-issue-bot]

Issue Status: 🙋 Upvoting

🙋 Upvoting

We are currently evaluating demand for the issue and checking whether it requires complicated or risky changes. Please leave a vote or comment if you think it should be prioritized.

^{_{This is an automatic reply by the bot.}}