The control buttons and shadow of a window with custom title bar is so weird

Describe the bug

This is how a window with default system title bar looks like:

This is how a window with ExtendsContentIntoTitleBar=true looks like:

You can observe that the size (and the shape) of control buttons is not consistent:

Also, the depth of shadow of the window is not identical:

Steps to reproduce the bug

1. Create a new blank WinUI 3 app with WASDK 1.1-preview3
2. Set ExtendsContentIntoTitleBar to true

Expected behavior

The control buttons as well as shadow of the window should be identical both with system title bar and custom title bar.

NuGet package version

WinUI 3 - Windows App SDK 1.1 Preview 3: 1.1.0-preview3

Windows app type

• UWP
• Win32

Device form factor

Desktop

Windows version

Windows Insider Build (22621)

[rkarman]

Thanks for the ping here @riverar, I was not aware of this issue being logged.

@marb2000 / @MikeHillberg can one of you move this issue over to WinAppSDK so we can assign the proper owners and track this with the windowing team?

[RGarrido03]

Ensure this is invoked after you .Activate() your window :

(stumbled over this in WinUI Git Hub example)

internal class Win32Ex
{
    private const int WAINACTIVE = 0x00;
    private const int WAACTIVE = 0x01;
    private const int WMACTIVATE = 0x0006;

    [DllImport("user32.dll")]
    private static extern IntPtr GetActiveWindow();

    [DllImport("user32.dll", CharSet = CharSet.Auto)]
    private static extern IntPtr SendMessage(IntPtr hWnd, int msg, int wParam, IntPtr lParam);

    public static void UpdateTitleBar(UIElement shell)
    {
        if (shell is FrameworkElement frameworkElement)
        {
            UpdateTitleBar(frameworkElement.RequestedTheme);
        }
        else
        {
            throw new ArgumentException($"Unable to update application title bar: {shell.GetType()}");
        }
    }

    public static void UpdateTitleBar(ElementTheme theme)
    {
        if (App.Window.ExtendsContentIntoTitleBar)
        {
            if (theme != ElementTheme.Default)
            {
                Application.Current.Resources["WindowCaptionForeground"] = theme switch
                {
                    ElementTheme.Dark => new SolidColorBrush(Colors.White),
                    ElementTheme.Light => new SolidColorBrush(Colors.Black),
                    _ => new SolidColorBrush(Colors.Transparent)
                };

                Application.Current.Resources["WindowCaptionForegroundDisabled"] = theme switch
                {
                    ElementTheme.Dark => new SolidColorBrush(Color.FromArgb(0x66, 0xFF, 0xFF, 0xFF)),
                    ElementTheme.Light => new SolidColorBrush(Color.FromArgb(0x66, 0x00, 0x00, 0x00)),
                    _ => new SolidColorBrush(Colors.Transparent)
                };

                Application.Current.Resources["WindowCaptionButtonBackgroundPointerOver"] = theme switch
                {
                    ElementTheme.Dark => new SolidColorBrush(Color.FromArgb(0x33, 0xFF, 0xFF, 0xFF)),
                    ElementTheme.Light => new SolidColorBrush(Color.FromArgb(0x33, 0x00, 0x00, 0x00)),
                    _ => new SolidColorBrush(Colors.Transparent)
                };

                Application.Current.Resources["WindowCaptionButtonBackgroundPressed"] = theme switch
                {
                    ElementTheme.Dark => new SolidColorBrush(Color.FromArgb(0x66, 0xFF, 0xFF, 0xFF)),
                    ElementTheme.Light => new SolidColorBrush(Color.FromArgb(0x66, 0x00, 0x00, 0x00)),
                    _ => new SolidColorBrush(Colors.Transparent)
                };

                Application.Current.Resources["WindowCaptionButtonStrokePointerOver"] = theme switch
                {
                    ElementTheme.Dark => new SolidColorBrush(Colors.White),
                    ElementTheme.Light => new SolidColorBrush(Colors.Black),
                    _ => new SolidColorBrush(Colors.Transparent)
                };

                Application.Current.Resources["WindowCaptionButtonStrokePressed"] = theme switch
                {
                    ElementTheme.Dark => new SolidColorBrush(Colors.White),
                    ElementTheme.Light => new SolidColorBrush(Colors.Black),
                    _ => new SolidColorBrush(Colors.Transparent)
                };
            }

            Application.Current.Resources["WindowCaptionBackground"] = new SolidColorBrush(Colors.Transparent);
            Application.Current.Resources["WindowCaptionBackgroundDisabled"] = new SolidColorBrush(Colors.Transparent);

            var hwnd = WinRT.Interop.WindowNative.GetWindowHandle(App.Window);

            if (hwnd == GetActiveWindow())
            {
                SendMessage(hwnd, WMACTIVATE, WAINACTIVE, IntPtr.Zero);
                SendMessage(hwnd, WMACTIVATE, WAACTIVE, IntPtr.Zero);
            }
            else
            {
                SendMessage(hwnd, WMACTIVATE, WAACTIVE, IntPtr.Zero);
                SendMessage(hwnd, WMACTIVATE, WAINACTIVE, IntPtr.Zero);
            }
        }
    }
}

Thank you very much!! I’ll try that later today 😃