[docs] [Windows]How to make the title bar transparent?

[thep0y]

The TitleBarStyle can only be used on macOS.

tauri/core/tauri-utils/src/lib.rs

Lines 171 to 185 in 803c3a7

	pub enum TitleBarStyle {
	/// A normal title bar.
	Visible,
	/// Makes the title bar transparent, so the window background color is shown instead.
	///
	/// Useful if you don't need to have actual HTML under the title bar. This lets you avoid the caveats of using `TitleBarStyle::Overlay`. Will be more useful when Tauri lets you set a custom window background color.
	Transparent,
	/// Shows the title bar as a transparent overlay over the window's content.
	///
	/// Keep in mind:
	/// - The height of the title bar is different on different OS versions, which can lead to window the controls and title not being where you don't expect.
	/// - You need to define a custom drag region to make your window draggable, however due to a limitation you can't drag the window when it's not in focus <https://github.com/tauri-apps/tauri/issues/4316>.
	/// - The color of the window title depends on the system theme.
	Overlay,
	}

I would like the title bar's color to match the background color, but I haven't found any interface to set the title bar color or make it transparent on the Windows platform.

I have set the window to be transparent, but this does not affect the title bar:

let window = builder.transparent(true).build().unwrap();

I am not sure if this is a documentation issue or a new feature.

[amrbashir]

On Windows, you can't really have a transparent native titlebar, instead, most apps will hide the native titlebar (.decorations(false)) and create a custom one using HTML/CSS/JS.

A few references:
https://tauri.app/v1/guides/features/window-customization/
https://github.com/agmmnn/tauri-controls

[thep0y]

I am currently using the method you mentioned, but I am unable to trigger the hover event for the maximize button.

Like VSCode:

[emipasca]

did you find a solution?

[thep0y]

did you find a solution?

Nope.

Tauri's compatibility with native interfaces across various platforms isn't quite there yet, and I'm unsure whether they have intentions to refine this in the future.

[timwehrle]

did you find a solution?

Nope.

Tauri's compatibility with native interfaces across various platforms isn't quite there yet, and I'm unsure whether they have intentions to refine this in the future.

Absolutely, but can you show your code to make it easier to see where you encounter your problems?

[FabianLars]

and I'm unsure whether they have intentions to refine this in the future.

Our plans don't really matter if the webviews prevent us from doing stuff lol. For the snap overlay we have an idea that is based on the new borderless resizing implementation but that may still take a while. In the meantime there's https://github.com/clearlysid/tauri-plugin-decorum which can open the snap overlay by emitting the Win+Z key combination.