I migrated my UWP Application to WinUI3 / AppSDK with a custom titlebar. I followed the example in the documentation here: https://learn.microsoft.com/en-us/windows/apps/develop/title-bar?tabs=winui3#title-bar-components
Designwise it works. But now I noticed that the caption buttons (min, max, close) do not work. I can click them and for example the close button becomes red on click so it is not covered. But nothing happenes. Which is weird since from the documentation those should always be handled by the system.
The code of my MainWindow looks like this:
<Window
x:Class="MoneyFox.Win.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="34" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid x:Name="AppTitleBar" Margin="0,0,120,0" Background="{ThemeResource TitleBarBrush}">
<TextBlock x:Name="AppTitleTextBlock" Text="Money Fox"
Style="{StaticResource CaptionTextBlockStyle}"
Margin="12,0,0,0" VerticalAlignment="Center" />
</Grid>
<Frame Grid.Row="1" x:Name="ShellFrame" />
</Grid>
</Window>
And the code behind:
public sealed partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
ExtendsContentIntoTitleBar = true;
SetTitleBar(AppTitleBar);
RootFrame.Navigate(typeof(ShellPage), null);
}
}
This is with Windows AppSDK 1.0.0 and 1.0.1.
EDIT:
As Roy Li pointed out, it works when I remove the Margin="0,0,120,0"
which is also used in the docs for that sake. But then the title is no longer visible. But that seems very weird. I played around with the width's and for example with Margin="0,0,80,0"
minimize does work, but close and maximize not.
I also added a background color to see where the grid is to be sure it doesn't overlay the caption buttons or something like that:
EDIT 2: OneDrive Link to a Repro Project: https://1drv.ms/u/s!Ang3D30bKDOhqfQVfrORlAVxleTVeA?e=IqqMyv