Extend buttons to title bar in UWP

Question

Is there a simple way to extend window controls into the title bar and make them clickable?

I read the related post (How to customize the application title bar for a UWP page) and I understand how to extend into the title bar area visually. However, my buttons are not clickable in that area (as if there is a layer over them, preventing them from being clicked).

Answer 1

Sure thing, you start with

//draw into the title bar
CoreApplication.GetCurrentView().TitleBar.ExtendViewIntoTitleBar = true;

//remove the solid-colored backgrounds behind the caption controls and system back button
ApplicationViewTitleBar titleBar = ApplicationView.GetForCurrentView().TitleBar;
titleBar.ButtonBackgroundColor = Colors.Transparent;
titleBar.ButtonInactiveBackgroundColor = Colors.Transparent;

From there, it's going to be a matter of placing a button in the right space.

This will also be helpful since you will be eliminating your app title:

<!-- Page attribute -->
xmlns:appmodel="using:Windows.ApplicationModel"

<TextBlock x:Name="AppTitle" Style="{StaticResource CaptionTextBlockStyle}"
    Text="{x:Bind appmodel:Package.Current.DisplayName}" IsHitTestVisible="False"/>

Then, of course, you will want to be careful of the back button

CoreApplicationViewTitleBar titleBar = CoreApplication.GetCurrentView().TitleBar;
titleBar.LayoutMetricsChanged += TitleBar_LayoutMetricsChanged;

private void TitleBar_LayoutMetricsChanged(CoreApplicationViewTitleBar sender, object args)
{
    AppTitle.Margin = new Thickness(CoreApplication.GetCurrentView().TitleBar.SystemOverlayLeftInset + 12, 8, 0, 0);
}

Best of luck!