Fix app title bar gap beneath the caption buttons #2051
Conversation
WinUIGallery/MainWindow.xaml
Outdated
| </Window.SystemBackdrop> | ||
| <Grid x:Name="RootGrid" Loaded="RootGrid_Loaded"> | ||
| <Grid.Resources> | ||
| <x:Double x:Key="TitleBarExpandedHeight">46</x:Double> |
There was a problem hiding this comment.
Why was 46 chosen as the value for TitleBarExpandedHeight?
Is this value derived via observation? If yes, then a hardcoded workaround might break under different conditions (e.g., DPI scaling, theme changes, or different Windows versions, resolution settings)
There was a problem hiding this comment.
Hi @Saharsh979! Thanks for pointing that out. I should’ve mentioned that I tested the fix under different DPI, resolutions, and while switching between them on Win 11.
That said, the current title bar already relies on some hardcoded width/height values, so I followed the same approach here. I couldn’t find a more flexible way to address the gap, but I’m definitely open to better alternatives if you have suggestions.
|
/azp run |
There was a problem hiding this comment.
When the window is maximized, there will be a 1px overlap between the title bar buttons and the NavigationView.
I don’t recommend modifying the TitleBarExpandedHeight resource. Instead, adjust the NavigationView’s padding between "0, -1, 0, 0" and "0, -2, 0, 0" depending on whether the window is maximized or restored.
This reverts commit e4162ee.
Added `WindowPresenter` and `CurrentWindowState` properties to track and manage the window's presentation state. Updated the `MainWindow` constructor to initialize these properties and adjust the `NavigationView` margin dynamically. Introduced the `AdjustNavigationViewMargin` method to handle margin adjustments when the window state changes, ensuring proper alignment of the `NavigationView` with the caption buttons.
|
@Zakariathr22 Great catch! Thanks! I followed your suggestion (I guess you meant |
Exactly! |
|
/azp run |
There was a problem hiding this comment.
@AndrewKeepCoding
I recently found out that this problem comes from the default title bar itself, not from the XAML components. So I suggest marking it as a WinAppSDK issue (https://github.com/microsoft/WindowsAppSDK/issues/5947) and not using this workaround. The issue doesn’t break the app, and we would have to remove the workaround later when it’s fixed anyway, because it would then cause another problem with the spacing between the title bar and the NavigationView.
|
@Zakariathr22 Yeah, but we don't know "when/if" this will be addressed, so I think we should adjust it for cleaner look. That said, it's only noticeable when hovering over the caption buttons, so maybe it's not worth the extra effort. 😅 |
3 participants
Description
This PR fixes the app title bar gap beneath the caption buttons.
Motivation and Context
Provides a cleaner, more professional look.
How Has This Been Tested?
Ran the app and confirmed the change under different DPI, resolutions, and switches between them on Win 11.
Screenshots (if appropriate):
Current:
New:
Types of changes