Title & program icon are unaligned when using Microsoft.UI.Windowing.AppWindow

[AzAgarampur]

Describe the bug

When Microsoft.UI.Windowing.AppWindow draws the titlebar instead of the DWM, the drawn caption text and program icon are unaligned compared to the normal DWM titlebar.

Steps to reproduce the bug

Create a new windows desktop app (like from a template) Use the AppWindow class and change the background color of the titlebar to any color Run and lookat the unaligned icon & caption text.

Expected behavior

The custom titlebar drawn by the AppWindow class looks identical to the DWM titlebar (no misalignment or anything).

Screenshots

NuGet package version

1.0.3

Packaging type

Unpackaged/Freestanding (using bootstrapper)

Windows version

Insider W11

IDE

VS 2022

Additional context

Not exactly a part of this issue but still worth mentioning:

1. If you set a custom titlebar background color, initially on program launch, the custom color is not drawn behind the program icon. You must interact with the window at least once (click, drag, size, etc.) before it is properly filled in.
2. The DWM window frame's minimize button does not use the new segoe fluent-looking minimize icon, it is still using the one from Windows 10. This should be updated so that it not only looks proper, but also matches how the AppWindow titlebar looks (AppWindow draws the minimize using the segoe fluent-looking icon).
3. The AppWindow caption buttons don't fade between their different states like the DWM titlebar does. Would be nice to see them do the same so the looks align.

[rkarman]

Verified the bug and put it on the backlog to be included in 1.2 planning. Depending on impact of change we will consider servicing the fix to 1.0 and 1.1 respectively. Bug internally tracked through: http://task.ms/39502036

[dotMorten]

I'm seeing this on my high-dpi screens too. Looks pretty terrible.