[feat] Custom Titlebar with navite Window-Controls (like in Electron)

[Captainpast]

Describe the problem

May modern apps have content on the same level as the Window-Controls, like in GNOME or Windwos 11.

GNOME Settings:

Windwos 11 file explorer;

Describe the solution you'd like

A good solution already exists in ElectronJS with the Window-Controls-Overlay-API for JavaScript and the CSS-Environment-Variables
https://github.com/WICG/window-controls-overlay/blob/main/explainer.md
https://www.electronjs.org/docs/latest/api/browser-window#winsettitlebaroverlayoptions-windows-linux

Alternatives considered

There is already tauri-controls, but this just native-looking Window-Controls and not change with the GTK-Theme

Additional context

No response

[Captainpast]

With GTK in Linux/Unix the use of gtk::WindowControls (docs.gtk.org) could be a solution, but this is only existed since GTK4 and tao must first ported from GTK3 to 4.

[yemikudaisi]

For what it's worth, I followed this tutorials for a custom title bar and it worked fine. See screenshot below.

[Captainpast]

@yemikudaisi my problem with this solution is, the Window-Controls does not follow the system Theme on Linux and other platforms.
As I mentioned, tauri-controls is there for easier native-looking Window-Controls, but their also problems with it on Windows (agmmnn/tauri-controls#26)

[jorgedanisc]

Would be neat to have a custom title bar with the native behaviour without a complete workaround on each OS just like Electron provides.

[Captainpast]

It's also ok to just have the same behavior as the native once, but it should use the system theme on Linux and other platforms.
If you can, easy use the native Window-Controls like in GTK4 (on Linux) or WinUI 3 (on Windows) it should be used so you don't have to re implement the system natives functionality, like the snap layout menu on Windows.

And it should be an official implementation like in Electron

[brilliantnz]

#12319

[metkm]

Can this be implemented now? I've found this in the docs

https://learn.microsoft.com/en-us/microsoft-edge/webview2/reference/winrt/microsoft_web_webview2_core/corewebview2windowcontrolsoverlay?view=webview2-winrt-1.0.3415-prerelease&preserve-view=true

Oh, it's prerelease.

[keytrap-x86]

For now you can use https://github.com/Eatham532/tauri-controls-v2