Repository: microsoft/WindowsAppSDK

Issue #2574: Customized title bar isn't clickable in some cases (e.g. after decreasing window size)
Created: 2022-06-04T10:21:10Z
Describe the bug
The area which was set by draggable (by method AppWindow.TitleBar.SetDragRectangles) will no longer draggable nor clickable anymore.
In particular, if we do SetDragRectangles with one area and later SetDragRectangles with another for the window we have set AppWindow.TitleBar.ExtendsContentIntoTitleBar as true, the area in the former one but outside the current one is not draggable nor clickable. It only responds with right clicking but pops up the window menu mistakenly. The only way to work-around is to call ResetToDefault and then re-do all the steps of title bar customization again, but the window will blink unexpectedly (because we set→reset→set).
A case we may call SetDragRectangles twice or more is that we customize the title bar and listen the resizing event to update the draggable rectangles. This issue is always repro when the user decreases the window size if we put something (like search box) in the title bar.
Steps to reproduce the bug

Set AppWindow.TitleBar.ExtendsContentIntoTitleBar as true.
Add a big button filling the window/page.
SetDragRectangles with a bigger area.
Then SetDragRectangles with a smaller area.
The above complementary set area will have no response (can't be draggable nor be clickable).

The following is a simple example, and the app will no longer be available to click nor to drag.
<Window
    x:Class="Demo.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:animatedvisuals="using:Microsoft.UI.Xaml.Controls.AnimatedVisuals"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Border>
        <Button Click="Button_Click" >Can you click me or drag window?</Button>
    </Border>
</Window>
// var appWindow = ... The AppWindow instance of MainWindow
appWindow.TitleBar.ExtendsContentIntoTitleBar = true;
appWindow.TitleBar.SetDragRectangles(new RectInt32[]
{
    new RectInt32(0, 0, 10000, 10000)
});
appWindow.TitleBar.SetDragRectangles(new RectInt32[]
{
    new RectInt32(0, 0, 1, 1)
});
Expected behavior
The area mentioned above should be restored to be clickable.
Screenshots

For example, if we set the above red-border rectangle by SetDragRectangles method (and keep updating on resizing), users can drag the area to move window. And of course, users can also click the search box to type some words to search. Suppose the width of the search box is 410px here. Then resize the window to decrease its width by 100px (and the program will do SetDragRectangles with the area updated). However, the user can only click the area of right 310px width part of the search box to type but not left 100px anymore.
NuGet package version
1.1.0
Packaging type
Packaged (MSIX)
Windows version
Windows 11 version 21H2 (22000)
IDE
Visual Studio 2022
Additional context
No response

Duplicate issue #2386: SetDragRectangles area cannot be clickable
Created: 2022-04-11T05:38:15Z
Describe the bug
Reproduce the bug:
https://github.com/0Kirby/ThrowObjectDetectionWinUI
Using customized TitleBar in my WinUI3 APP, settting AppWindow.TitleBar.ExtendsContentIntoTitleBar to "true".

In order to make the buttons in NavigationView clickable, using AppWindowTitleBar.SetDragRectangles(RectInt32[])  Method to set draggable area.
RectInt32 rect = new(Convert.ToInt32(leftOffset), 0, Convert.ToInt32(dragSpace), Convert.ToInt32(height));
_mainAppWindow.TitleBar.SetDragRectangles(new RectInt32[] { rect });

In NavigationView's Left or LeftCompact display mode , setting leftOffset=48 to make room for the back button(←).
And it works properly, the back button(←) cannot be draggable and can be clickable.

In NavigationView's LeftMinimal display mode , setting leftOffset=96 to make room for the back button(←) and the collapse button(≡).
The area of two button cannot be draggable is OK. However, the back button(←) can be clickable but the the collapse button(≡) cannot be clickable.
Steps to reproduce the bug

Create a WinUI 3 packaged app with some features.
When the WindowSize changes, use the method SetDragRectangles(RectInt32[]) to set corresponding draggable area according to the NavigationView' display mode.
As the NavigationView's display mode changes to LeftMinimal, the bug reproduces.

Expected behavior
In NavigationView's LeftMinimal display mode, the back button(←) and the collapse button(≡)  can both be clickable.
Screenshots

The blue area can be draggable is OK.
The green area should be clickable as expected, but only the red area can be clickable.
NuGet package version
1.0.0
Packaging type
Packaged (MSIX)
Windows version
Windows 11 version 21H2 (22000)
IDE
Visual Studio 2022
Additional context
Nuget Package Dependencies:
<PackageReference Include="Microsoft.WindowsAppSDK" Version="1.0.2" />
<PackageReference Include="Microsoft.Windows.SDK.BuildTools" Version="10.0.22000.197" />
<PackageReference Include="Microsoft.Windows.CsWin32" Version="0.1.635-beta" PrivateAssets="all" />

Closing comment (2022-06-09T20:25:02Z): Duplicate of #2574