C++/WinRT - unpackaged - Customized title bar controls not clickable & SetDragRectangle displays default titlebar

[yki5000]

Describe the bug

Controls of customized titlebar are not clickable and only by setting "SetDragRectangle" the default titlebar appears and covers the customized titlebar.

As described in this post, the issue should be fixed in Windows App SDK 1.2 Preview 1 (at least in C#, in C++ it doesn't work).
I had 1.1.5 installed before.
#2574

Steps to reproduce the bug

Create an unpackaged WinUI 3 app.
Add the customized titlebar with controls and set "SetDragRectangle".

See my example (code in MainWindow.xaml.cpp):
https://github.com/yki5000/WinUI3_Unpackaged_CPP

See 2 example videos which show you the errors:
yki5000/WinUI3_Unpackaged_CPP#1

Expected behavior

Added titlebar controls should be usable by user input and SetDragRectangle shouldn't let the default titlebar appear (?!).

Screenshots

NuGet package version

1.1.5

Packaging type

Unpackaged

Windows version

Windows 11 version 22H2 (22621, 2022 Update)

IDE

Visual Studio 2022

Additional context

[DarranRowe]

Just to be sure, have you tried doing this kind of thing without involving WinUI 3.

Don't forget, when you set a custom titlebar, this is set using Microsoft.UI.Xaml.Window, which is a different component to the AppWindowTitleBar used to remove the system title bar and set the drag regions.

It is possible that the AppWindowTitleBar is setting everything correctly, but the Xaml host is misbehaving.

[yki5000]

@DarranRowe
I think I only partially understand what you're getting at. You mean it's maybe more a WinUI 3 issue and I should create an issue at the official Microsoft-UI-Xaml repository? (https://github.com/microsoft/WindowsAppSDK/issues)

I posted it originally in the MSDN forum and Castorix gave me the advice to post it in WindowsAppSDK repository, I'm a beginner in C++:
https://learn.microsoft.com/en-us/answers/questions/1104852/winui-3-controls-in-the-title-bar-are-not-clickabl.html

[bpulliam]

I would first try to add the compatibility section to your app.manifest., similar to #2969
This is needed in both packaged and unpackaged apps, to allow the drag window to be created correctly.

[DarranRowe]

@yki5000

It was more along the lines of asking if it possible to get a test case which tests the titlebar independent of WinUI.
I know that there have been previous reports where there have been titlebar problems reported, but when the titlebar was customised in a way that didn't use WinUI, then the title bar actually worked as expected. Basically, this is trying to narrow down the root of the problem.

However, if you are not that experienced, that may be difficult since it would mean writing an application using the desktop Windows API.

[castorix]

I would first try to add the compatibility section to your app.manifest., similar to #2969 This is needed in both packaged and unpackaged apps, to allow the drag window to be created correctly.

He added it in app.manifest

[yki5000]

@DarranRowe
Indeed, testing it in WinApi (?!) would be too expensive since I’m not that experienced.
(Oh man, WinUI 3 is an incredibly fantastic idea, especially for C++ but it also really get you down. 🫣)

[castorix]

@DarranRowe Indeed, testing it in WinApi (?!) would be too expensive since I’m not that experienced. (Oh man, WinUI 3 is an incredibly fantastic idea, especially for C++ but it also really get you down. 🫣)

With Win32 APIs, it is done like in the MSDN sample Custom Window Frame Using DWM
It works fine in C++/Win32 or C#/VB + P/Invoke, but I had tried to mix DwmExtendFrameIntoClientArea and so on with WinUI 3 and I could not get correct results (with Windows App SDK 1.1.0) (I met problems with the child Composition window (DesktopChildSiteBridge class))

[DarranRowe]

@castorix
No, the titlebar customisation works with regular desktop applications. You can get an AppWindow associated with a HWND, the method of using Microsoft.UI.GetWindowIdFromWindow to get the window id, and then obtaining the AppWindow using Microsoft.UI.Windowing.AppWindow.GetFromWindowId is supported.
For Windows 11, and IIRC Windows 10 with 1.2, you can then use AppWindowTitleBar.ExtendsContentIntoTitleBar to enable full titlebar customisation.
You can't set Xaml elements as the titlebar, so you need to use some other means to do this, but that was the whole point. Having the drag rectangles set in such a way that the clicks can go through to the underlying window without Xaml being enabled.

[DarranRowe]

Well, I managed to put a little time into this and got a small Windows API application together that uses ExtendsContentIntoTitleBar for the title bar customisation.

2022-12-16.12-07-26.mp4

It seems to be properly clickable and there is no displaying of the default titlebar. It is still only a simple drag rectangle though, but I will be adding in some composition using Windows.UI.Composition to add a sprite visual where the title bar clickable region is.

--Edit--
A quick update in an edit.
I did update this sample to have a more complex drag region and the sprite visual. The sprite visual has a gap which is where the control should be. The draggable region does properly follow the sprite visual and the clicks do seem to go through to the window below.
This doesn't seem to be a problem with just AppWindowTitleBar, the problem seems to require WinUI 3 to be active in a window.

[yki5000]

@DarranRowe , @castorix
OK,
If I understand it correctly, this is the wrong place and it should be posted on the WinUI 3 page?!
(You don't know of a workaround?)

[yki5000]

I keep checking back here and looking for solutions and after 1000 times I saw that WinUI3 is probably not supposed to support it?!

https://learn.microsoft.com/en-us/windows/apps/develop/title-bar?tabs=winui3

(As described in the article, it works with the keyboard, but somehow it doesn't make much sense. Don't know where the border is between Windows App SDK and WinUI3)

But another error would still exist. If you place a combo box below the title bar and the combo box dropdown opens upwards, then the part that protrudes above the title bar is no longer clickable. There is probably no workaround for this problem that the dropdown only opens downwards.

(I tried again with a Rectangle UIElement in the Xaml and it seems to work partially when I set "this->SetTitleBar(myRectangle())" inside the title bar. MyRectangle responds as a drag region, but seems to only pay attention to the non-draggable region to the left.)

[pratikone]

WinUI 3 and Appwindow titlebar now use the same implementation now and hence support the same features. The interactive titlebar can be created using InputNonClientPointerSource apis. I recently added an example in WinUI gallery on how to do it. You can follow it : microsoft/WinUI-Gallery#1360 . It will work for both packaged and unpackaged.

Do open a new issue if you still face some issue. Given this issue is fixed, I am closing this.