How do I customize the Window Titlebar in a Windows App SDK (WIN UI/Project Reunion) Project?

Question

I'm trying to build an app using the new Widows App SDK. I used the Windows Community Toolkit to create the application.

After consulting the documentation, I tried this:

On the first page that my app displays, I created a Textblock:

<TextBlock Text="Hello" x:Name="CustomTitleBar" /> 

In this page's code behind, I added the following code:

 private void Page_Loaded(object sender, RoutedEventArgs e)
 {
   App.MainWindow.ExtendsContentIntoTitleBar = true;
   App.MainWindow.SetTitleBar(CustomTitleBar);
   App.MainWindow.Activate();
 }

On the App XAML page I followed the doumentation's directions to override these values:

<SolidColorBrush x:Key="WindowCaptionBackground">Green</SolidColorBrush>
<SolidColorBrush x:Key="WindowCaptionBackgroundDisabled">LightGreen</SolidColorBrush>
<SolidColorBrush x:Key="WindowCaptionForeground">Red</SolidColorBrush>
<SolidColorBrush x:Key="WindowCaptionForegroundDisabled">Pink</SolidColorBrush> 

This above does make the default titlebar go away. However, I am left with just the word "Hello" with no background or buttons:

Is there something I'm missing?

Answer 1

You should probably be using the AppWindow and presenter (in my case I used the OverlapedPresenter) classes. Here's some code I used on my app.

public MainWindow()
{
   InitializeComponent();
   AppWindow appWindow = GetAppWindowForCurrentWindow();
   OverlappedPresenter overlappedPresenter = appWindow.Presenter as OverlappedPresenter;

   overlappedPresenter.IsResizable = false;
   appWindow.TitleBar.ExtendsContentIntoTitleBar = false;
}

Then, right under the constructor I use the method Microsoft provides in this sample:

private AppWindow GetAppWindowForCurrentWindow()
{
   IntPtr hWnd = WinRT.Interop.WindowNative.GetWindowHandle(this);
   WindowId myWndId = Win32Interop.GetWindowIdFromWindow(hWnd);
   return AppWindow.GetFromWindowId(myWndId);
}

I use the OverlapsedPresenter class to change some things about the window, like if it's resizable or not.