WinUI 3 - Use extended title bar by default with complete icon and title

[JaiganeshKumaran]

Today WinUI 3 uses the default Win32 title bar which has a few issues as I highlighted in #5486 and doesn't look modern. When you extended content into title bar, there's nice modern caption buttons with Fluent tooltip. I think that should be the default even if ExtendsContentIntoTitleBar is false but WinUI should provide a default drag region with app's icon from the manifest and window title as well. When you set ExtendsContentIntoTitleBar as true, you'll have the same caption buttons however the default drag region with icon and title will be removed and you can set your own.

[mdtauk]

I don't think it should be the default, but it should certainly be an option in the templates - where it will pre-add the UI elements with their correct padding and margins.

[JaiganeshKumaran]

I don't think it should be the default, but it should certainly be an option in the templates - where it will pre-add the UI elements with their correct padding and margins.

It should be the default because developers who don't customize much will get modern UI by default.

[mdtauk]

I don't think it should be the default, but it should certainly be an option in the templates - where it will pre-add the UI elements with their correct padding and margins.

It should be the default because developers who don't customize much will get modern UI by default.

Developers need to be aware of the curves and pitfalls for using an extended titlebar - the default titlebar is actually the simplest option.

If having an extended titlebar were easier to work with, then I would argue the default templates should include it.

[JaiganeshKumaran]

@mdtauk Why can't the default title bar a modern one? To the default, it will appear as the default and ExtendsContentIntoTitleBar will be fase but actually a customized from the system point of view. The UWP default title bar is already technically extended but it's not customizable by the developer unless they opt-in to the fake extend option. WinUI will display app's icon and title just like the Win32 one but with modern visuals like tooltips and context menus. This way the caption buttons will remain consistent whether you extend or not because it's always using the same instead of using Win32 one when not extended.

[mdtauk]

@mdtauk Why can't the default title bar a modern one? To the default, it will appear as the default and ExtendsContentIntoTitleBar will be fase but actually a customized from the system point of view. The UWP default title bar is already technically extended but it's not customizable by the developer unless they opt-in to the fake extend option.

WinUI 3 is being designed to work with existing custom chrome windows, such as Office etc. Where as the UWP core windows are an entirely new concept.

I would like all apps to update to a new modern design, including the Titlebars, but when a default setting/option could end up breaking existing apps, and changing metrics - this is going to be hated by developers, and Microsoft needs them on board with as little friction as possible.

But I think there should be templates that include everything needed for functional and beautiful custom Titlebars. How it currently works, it would either need to be it's own Item/Project Template - or an option you turn on when creating a new project.

[JaiganeshKumaran]

@mdtauk Why can't the default title bar a modern one? To the default, it will appear as the default and ExtendsContentIntoTitleBar will be fase but actually a customized from the system point of view. The UWP default title bar is already technically extended but it's not customizable by the developer unless they opt-in to the fake extend option.

WinUI 3 is being designed to work with existing custom chrome windows, such as Office etc. Where as the UWP core windows are an entirely new concept.

I would like all apps to update to a new modern design, including the Titlebars, but when a default setting/option could end up breaking existing apps, and changing metrics - this is going to be hated by developers, and Microsoft needs them on board with as little friction as possible.

But I think there should be templates that include everything needed for functional and beautiful custom Titlebars. How it currently works, it would either need to be it's own Item/Project Template - or an option you turn on when creating a new project.

Many app developers who build simple apps won't bother creating a beautiful modern experience. The default always should always be the best that works for most apps. Apps can customize if they wanted but the default should be modern enough. Also WinUI 3 apps are new apps so it won't break as long as they always used the defaults.

[JaiganeshKumaran]

Take a look at what the Office Hub app has done. Before they just used the default UWP title bar which worked for them (after all the entire app is just a web view) but now since WinUI 3 has ugly Win32 one, they have tried to replicate the UWP but has failed badly. They can fix it however they just wanted the default to be great. Not all apps need title bar customisation yet now just to get the modern style, developers need to customise. While putting it in the template may seem great, it should be the default implicitly and the Win32 old title bar shouldn't be there.

[mdtauk]

Many app developers who build simple apps won't bother creating a beautiful modern experience. The default always should always be the best that works for most apps. Apps can customize if they wanted but the default should be modern enough. Also WinUI 3 apps are new apps so it won't break as long as they always used the defaults.

Those who won't bother creating a nice looking app, will not care to ensure their by default extended titlebar will work well with content behind it, or function properly with the proper application of Transparent materials, button colours, and handling inactive states.

How you handle the extended titlebar, also differs depending on the UI layout and structure you use. The NavigationView, Main Menu, and TabView patterns all need to do different things with their titlebars to make them good. There is no one-size fits all approach, except for the current default, which handles inactive states, and ensures the correct font sizes and contrast safe colours are used.

[JaiganeshKumaran]

Many app developers who build simple apps won't bother creating a beautiful modern experience. The default always should always be the best that works for most apps. Apps can customize if they wanted but the default should be modern enough. Also WinUI 3 apps are new apps so it won't break as long as they always used the defaults.

Those who won't bother creating a nice looking app, will not care to ensure their by default extended titlebar will work well with content behind it, or function properly with the proper application of Transparent materials, button colours, and handling inactive states.

How you handle the extended titlebar, also differs depending on the UI layout and structure you use. The NavigationView, Main Menu, and TabView patterns all need to do different things with their titlebars to make them good. There is no one-size fits all approach, except for the current default, which handles inactive states, and ensures the correct font sizes and contrast safe colours are used.

I'm asking for the current default to be upgraded and have the same caption buttons that shows up when extended in WinUI 3 with modern tooltip instead of some old one.

[niels9001]

I agree with @Jaiganeshkumaran . The default WinUI titlebar should look like a modern window, especially since it's the default on Windows 11 with all inbox apps adopting it.

To me it doesn't make sense that a new, modern UI framework requires additional work (which you know, some devs won't do) to look like a "default/modern" windows app. I get that there might be some technicalities to be ironed out as @mdtauk mentions, but still would be great to have that.

[JaiganeshKumaran]

In addition to WinUI 3, the default title bar for UWP apps (non-extended) should be updated to include the app icon. I did propose in Reunion about this but got closed: https://github.com/microsoft/WindowsAppSDK/issues/1123. The problem with UWP apps displaying the icon on an extended title bar is that they don't display the menu when clicked which is fine however it creates inconsistency.

[ghost]

I opened a discussion that talks about this in microsoft/WindowsAppSDK#1293.

To summarize, there would be a new titlebar used by all Windows 11 and WindowsAppSDK apps, even if you don't extend the app content.

[StephenLPeters]

@pratikone and @marb2000 FYI

[fredemmott]

Those who won't bother creating a nice looking app, will not care to ensure their by default extended titlebar will work well with content behind it, or function properly with the proper application of Transparent materials, button colours, and handling inactive states.

It feels notable that the WinUI 3 Controls Gallery app appears to have not felt that this is worth the work.

[pratikone]

the newly released WinUI3 controls gallery have WinUI Titlebar control which people can try out.

[EpsiRho]

Why is this still not implemented and still unreasonable stupid in what is supposed to be considered ready for production? Using workarounds instead of fixing missing components is not the right answer.

[Dealman]

For what it's worth, I was initially also struggling with the TitleBar being an absolute headache to work with. I have since started using the Template Studio extension for Visual Studio as promoted by the WinUI Gallery app.

It sets it all up for you and haven't had any issues with the TitleBar since. It even sets up a nice solution for MVVM which is a nice benefit if you like.

• It's properly extended and transparent
• Resizing works as expected
• The little VisualTree helper thingymajigger at the titlebar is interactable again
• Support for icon and title text from the get-go

I highly recommend the template studio if you're new to the WinUI framework like me, it sets up most of the soul draining stuff for you.

[TekuSP]

@Dealman That works for new projects, but my project is when it was called Project Reunion two years ago. I hoped there is one centralized taskbar, rather than custom solution, even if pre-generated.

[pratikone]

With WinAppSDK 1.4, winui 3 custom titlebar is getting a big overhaul and merging with appwindow titlebar. That leads to better defaults on using custom titlebar and it works well with all low level apis. The icon part is still not default but it is easier to create due to new api. Template Studio and Community Toolkit will fill this gap and create good ready to use customization around custom titlebar.

Since this issue is already 2 years old and already has bunch of outdated comments/suggestions which are no longer applicable, I am closing it. Feel free to open a new one for a more specific issue.

[mdtauk]

With WinAppSDK 1.4, winui 3 custom titlebar is getting a big overhaul and merging with appwindow titlebar. That leads to better defaults on using custom titlebar and it works well with all low level apis. The icon part is still not default but it is easier to create due to new api. Template Studio and Community Toolkit will fill this gap and create good ready to use customization around custom titlebar.

Since this issue is already 2 years old and already has bunch of outdated comments/suggestions which are no longer applicable, I am closing it. Feel free to open a new one for a more specific issue.

@pratikone Do you know if this will also start to add support to the taller 40 and 48px high Titlebar, marked in the design kit as Future Tall - and as used by the Office apps.

[pratikone]

I am not aware of any discussions related to it so no. This release is aimed at just beahvior parity between old winui3 custom titlebar and the new one merged with appwindow titlebar while providing some good defaults. For any more features, future releases can be aimed