uwp NavigationView control Titlebar

Question

I have a problem with the NavigationView Control and the titlebar.

I have tried to extend the view into the titlebar to play with the acrylic effects of the standard NavigationView. But then I´ve noticed that the back and menu buttons are underneath the titlebar, so you´re not able to click them properly.

In the attached image, you can see that everything under the red line is clickable but when you go over it, you are targeting the titlebar.

Is there anything I can do to fix this behavior?

Answer 1

I don't know which version OS you are working on, I didn't see this problem in recent Windows insider OS. You may workaround the not clickable problem by set a dummy Titlebar like below:

<Grid>
    <Grid x:Name="AppTitleBar" Background="Transparent" />
    <NavigationView IsBackEnabled="True" PaneDisplayMode="Top">
        <NavigationView.MenuItems>
            <NavigationViewItem Icon="Accept" Content="Accept" />
        </NavigationView.MenuItems>
    </NavigationView>
</Grid>

public MainPage()
{
    this.InitializeComponent();
    var coreTitleBar = CoreApplication.GetCurrentView().TitleBar;
    coreTitleBar.ExtendViewIntoTitleBar = true;

    Window.Current.SetTitleBar(AppTitleBar);
}