title: Busy indicating modal dialog doesn't cover BottomAppBar
body: <p>I've used Busy dialog implementation from a Template10Sample project which unfortunatelly I can't find on the web anymore</p>
  
  <p>Busy indicating is implemented as ModalDialog with assigned user control to its ModalContent. The code displaying and hiding it can be found bellow.</p>
  
  <p>The problem is that I use BottomAppBar for app navigation and this bar doesn't get covered by the modal dialog and all the buttons remain clicable. It looks as though the bar is not content of the window which is quite strange. </p>
  
  <p>Why? How&lt; Wut?:)</p>
  
  <pre><code>var modal = Window.Current.Content as ModalDialog;
  var view = modal.ModalContent as BusyControl;
  if (view == null) {
      modal.ModalContent = view = new BusyControl();
  }
  modal.IsModal = view.IsBusy = busy;
  view.BusyText = text;
  </code></pre>
  
  <p>XAML:</p>
  
  <pre class="lang-xml prettyprint-override"><code>&lt;UserControl
      x:Class="Foo.Views.BusyControl"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:local="using:Foo.Views"
      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"&gt;
      &lt;Viewbox Height="32" HorizontalAlignment="Center" VerticalAlignment="Center"&gt;
          &lt;Grid&gt;
              &lt;Grid.ColumnDefinitions&gt;
                  &lt;ColumnDefinition Width="Auto" /&gt;
                  &lt;ColumnDefinition /&gt;
              &lt;/Grid.ColumnDefinitions&gt;
              &lt;ProgressRing Width="16" Height="16" Foreground="White" IsActive="{x:Bind IsBusy, Mode=OneWay}" /&gt;
              &lt;TextBlock Grid.Column="1" Margin="12,0,0,0" VerticalAlignment="Center" Foreground="White" Text="{x:Bind BusyText, Mode=OneWay, FallbackValue='TODO Localization Please Wait...'}" /&gt;
          &lt;/Grid&gt;
      &lt;/Viewbox&gt;
  
  &lt;/UserControl&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/4uUhY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/4uUhY.png" alt="enter image description here"></a></p>
  
  <p>This is how it looks like</p>
  
  <hr>
  
  <p>I suppose I found the source of the problem. After inspecting visual tree I found that CommandBar sits under PopupRoot tree node (have no idea what it is and can't google it) while ModalDialog and actual application content sits at RootScrollViewer/../ModalDialog/... Hence Modal dialog cannot cover CommandBar itself. </p>
  
  <p>Have no idea what to do with it.</p>