Why does my AppBar appear as ClosedDisplayMode.Compact on Page load regardless of actual setting?

Question

I'm porting a Win8.1 app to UWP for Win10 and experiencing a strange issue with the AppBar. We've tried using CommandBar instead of AppBar, but the issue still occurs for us. We're on the latest version of MyToolkit (2.5.16 as of this writing). Our views are derived like so:

SomeView derives from BaseView dervices from MtPage (derives from Page)

So, for a particular view (in this case, HomeView), the XAML looks like:

<views:BaseView
   x:Name="pageRoot"
   x:Class="OurApp.HomeView"
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
   xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
   xmlns:controls="using:OurApp.Controls"
   xmlns:views="using:OurApp.Views"
   xmlns:viewModels="using:ViewModels"
   xmlns:fake="using:ViewModels.Fake"
   mc:Ignorable="d" >
   <views:BaseView.TopAppBar>
      <AppBar>
         <controls:NavigationView
            x:Name="NavigationView">
            <controls:NavigationView.Context>
               <viewModels:NavigationViewModel />
            </controls:NavigationView.Context>
         </controls:NavigationView>
      </AppBar>
   </views:BaseView.TopAppBar>
   <!-- other stuff not relevant to AppBars, etc -->
</views:BaseView>

Where NavigationView is a UserControl that has some buttons, and NavigationViewContext and NavigationViewModel describe which buttons should be active on which page, and so forth.

The problem is that this results in a sort of half-open, half-closed AppBar appearance (almost but not quite exactly as if ClosedDisplayMode were set to Compact) like so:

After adding ClosedDisplayMode="Minimal" to the <AppBar> control, as alluded to in this question, the live visual tree confirms that the AppBar has IsOpen = 0 and AppBarClosedDisplayMode.Minimal... but it still stubbornly appears half-open as in the screenshot above.

Strangely, if the user navigates away from HomeView to some other view and then back to it, the AppBar is correctly rendered with AppBarClosedDisplayMode.Minimal (!):

We've tried handling the view's NavigatedTo event and manually forcing ClosedDisplayMode to Minimal, but that doesn't affect the rendered output (and in any case, the live visual tree confirms that that is already being correctly set to Minimal).

Any ideas why this is happening, and/or how to cause the AppBar to be rendered with ClosedDisplayMode = Minimal without having to navigate first? I'm sure I could probably brute force this somehow, but I feel like there's probably a better way or I'm missing something pretty simple.

Answer 1

Just switch to CommandBar. CommandBar works out-of-the-box perfectly well, for both, Minimal and Compact modes. CommandBar is the recommended preferred control over AppBar. Apparently, the only reason for keeping AppBar is to minimize changes.

AppBar - MSDN.

Important You should use the AppBar only when you are upgrading a Universal Windows 8 app that uses the AppBar, and need to minimize changes. For new apps in Windows 10, we recommend using the CommandBar control instead.

Page:

<paging:MtPage
x:Class="App3.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App3"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:paging="using:MyToolkit.Paging"
mc:Ignorable="d">

<paging:MtPage.Resources>
</paging:MtPage.Resources>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
</Grid>

<paging:MtPage.TopAppBar>
    <CommandBar x:Name="appbar1" ClosedDisplayMode="Minimal" >
        <CommandBar.Content>
            <local:MyUserControl1></local:MyUserControl1>
        </CommandBar.Content>
    </CommandBar>
</paging:MtPage.TopAppBar>

User Control:

<UserControl
x:Class="App3.MyUserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App3"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="400">

<Grid>
    <StackPanel Orientation="Horizontal">
        <AppBarButton Icon="Home" Label="Home"></AppBarButton>
        <AppBarButton Icon="Back" Label="Back"></AppBarButton>
        <AppBarButton Icon="Rotate" Label="Rotate"></AppBarButton>
    </StackPanel>
</Grid>