A new, unified titlebar for all apps

[ghost]

There are multiple types of windows using a "default" titlebar, yet they all look and act differently:
UWP

win32 default / dialog box

win32 ToolWindow

I also assume Android apps will have yet another different titlebar.

---

My proposal is to create a new titlebar based on WinUI, and to use it for all window types in Windows 11 and for apps using WindowsAppSDK.
Windows 11 and WindowsAppSDK could share the same titlebar control, to ensure consistency.

It could perhaps be extended even to Linux GUI apps, if they don't draw their own titlebar. From what I know, the caption buttons are still drawn by each distro, so Windows could do the same thing.

The titlebar can still adapt depending on the window type, but this way it will always look consistent.

There were some attempts like this already:

• Windows 10X had a WinUI-based titlebar for UWP apps
• There was also Windows Sets, which effectively achieved a single titlebar for UWP and win32 apps

---

Advantages:

• ensures consistency across all windows using the default titlebar
  • would make all Windows 11 UWP apps have icons by default
• would use the default WinUI styling for buttons and tooltips

This could also allow for new capabilities:

• For the OS:

  • Windows 11 could allow setting all non-extended titlebars to have acrylic or mica
  • the titlebar could automatically adapt for touch input
  • the titlebar control could be easily extended to have tabs, just like with Sets

• For apps:

  • showing and hiding the icon and/or title, regardless of the app content being extended or not.
  • changing the titlebar background, foreground, height
  • changing the button background, foreground, sizes (normal, compact)
  • showing and hiding buttons

Obviously, this depends on the type of app, and would sometimes be done with different APIs. For example, if an Android app sets a custom status bar color, you would instead change the titlebar color on Windows.

I think that WindowsAppSDK should always hide the natural titlebar and use the one it provides (even if the content isn't extended), in order to support all these capabilities. Windows 11 would use this new titlebar as the "default" for all apps, but the APIs can still be exclusive to WindowsAppSDK.

[btueffers]

@rkarman do you have any thoughts on this feature proposal?

[rkarman]

I do. But I think @mevey will have a much more detailed view and deeper insights to share in this space. 😃

[JaiganeshKumaran]

Windows provides an option to use accent colour on the title bar. While it's up to the developer, the default title bar has the accent colour but customised title bar, even ones which are from the system don't as they have extended just to add an icon on the right. I would recommend removing the option entirely as it's not going to be consistent.

[ghost]

There could be an API to extend the content on top of whatever the titlebar has, without replacing it.
This way you could have system-wide acrylic or colored titlebars, and you could add the UI that you need on top of that.

[JaiganeshKumaran]

Not feasible because the content will have its own background colour/brush. This needs to be done framework level, not system level.

[ghost]

It doesn't have to. You can draw that content on top of a transparent background. If you didn't set a background in WinUI apps you would get a white backplate drawn by the window, and with 2.6 I think it's a light gray instead.

[JaiganeshKumaran]

transparent will display the background behind which if it's part of a frame/page or grid is already set. Changing it may break existing UIs.

[ghost]

It would be an API though. If you extended the titlebar normally, you would get that default white/light gray background. But if you choose to keep the titlebar background, you would get that instead.

[ghost]

Here is an example from macOS Mojave. There is a large titlebar with the default horizontal gradient, and it has custom buttons and the default app title/icon.

This is how a developer could achieve this on Windows, with new APIs:

• Extend the content into the titlebar
• Keep the default titlebar background (API)
• Make the titlebar background taller (API)
  • The actual titlebar height, which decides how the caption buttons and title are positioned, would remain the same.
• Keep the default titlebar title and icon (API)