title: Windows Template Studio WPF UserControl not showing MetroWindow theme when changing TitleTemplate
body: <p>(UPDATE: even without DEVEXPRESS controls, the same behavior is observed. So, I tested it with a couple textBlocks inside of a Grid...)</p>
  <p>I am new to WPF development and I am using Windows Template Studio on VS 2019 (net core 3.1).
  I am also using DEVEXPRESS.</p>
  <p>I am wondering why I am losing the default MetroWindow theme in a user control when I add a custom TitleTemplate to the ShellWindow.xaml.</p>
  <p>This is likely something very simple that I am not doing properly...</p>
  <p>Repro steps:</p>
  <p>1 - Create a default WPF Windows Template Studio Project. Select Navigation Pane as the Project type.</p>
  <p>2 - Add a second blank page.</p>
  <p>3 - Add DevExpress.WPF to the project (Not needed to duplicate).</p>
  <p>4 - Create a simple user control</p>
  <pre><code>&lt;UserControl x:Class=&quot;NoDevExpresssTitleTemplate.Views.TestUserControl&quot;
           xmlns=&quot;http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;
           xmlns:x=&quot;http://schemas.microsoft.com/winfx/2006/xaml&quot;
           xmlns:mc=&quot;http://schemas.openxmlformats.org/markup-compatibility/2006&quot; 
           xmlns:d=&quot;http://schemas.microsoft.com/expression/blend/2008&quot; 
           xmlns:local=&quot;clr-namespace:NoDevExpresssTitleTemplate.Views&quot;
           xmlns:dxlc=&quot;http://schemas.devexpress.com/winfx/2008/xaml/layoutcontrol&quot;
           xmlns:dxe=&quot;http://schemas.devexpress.com/winfx/2008/xaml/editors&quot;
           mc:Ignorable=&quot;d&quot; 
           d:DesignHeight=&quot;450&quot; d:DesignWidth=&quot;800&quot;&gt;
  &lt;Grid&gt;
      &lt;dxlc:LayoutControl &gt;
          &lt;dxlc:LayoutGroup&gt;
              &lt;dxlc:LayoutItem Label=&quot;test1:&quot; Width=&quot;150&quot; VerticalAlignment=&quot;Center&quot; Margin=&quot;20,0,0,0&quot;&gt;
                  &lt;dxe:TextEdit EditValue=&quot;Test1&quot;/&gt;
              &lt;/dxlc:LayoutItem&gt;
              &lt;dxlc:LayoutItem Label=&quot;test2:&quot; Width=&quot;150&quot; VerticalAlignment=&quot;Center&quot; Margin=&quot;20,0,0,0&quot;&gt;
                  &lt;d:TextBox Text=&quot;test2&quot;/&gt;
              &lt;/dxlc:LayoutItem&gt;
              
          &lt;/dxlc:LayoutGroup&gt;
      &lt;/dxlc:LayoutControl&gt;
          
  &lt;/Grid&gt;
  </code></pre>
  
  <p>5 - Use the user control on the second blank page created,</p>
  <pre><code>&lt;Page
  x:Class=&quot;NoDevExpresssTitleTemplate.Views.SearchPage&quot;
  Style=&quot;{DynamicResource MahApps.Styles.Page}&quot;
  xmlns=&quot;http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;
  xmlns:x=&quot;http://schemas.microsoft.com/winfx/2006/xaml&quot;
  xmlns:mc=&quot;http://schemas.openxmlformats.org/markup-compatibility/2006&quot;
  xmlns:d=&quot;http://schemas.microsoft.com/expression/blend/2008&quot;
  xmlns:properties=&quot;clr-namespace:NoDevExpresssTitleTemplate.Properties&quot;
  xmlns:views=&quot;clr-namespace:NoDevExpresssTitleTemplate.Views&quot;
  mc:Ignorable=&quot;d&quot;
  d:DesignHeight=&quot;450&quot; d:DesignWidth=&quot;800&quot;&gt;
  &lt;Grid&gt;
      &lt;Grid.RowDefinitions&gt;
          &lt;RowDefinition Height=&quot;48&quot; /&gt;
          &lt;RowDefinition Height=&quot;*&quot; /&gt;
      &lt;/Grid.RowDefinitions&gt;
      &lt;TextBlock
          Style=&quot;{StaticResource PageTitleStyle}&quot;
          Margin=&quot;{StaticResource MediumLeftMargin}&quot;
          Text=&quot;{x:Static properties:Resources.SearchPageTitle}&quot; /&gt;
      &lt;Grid
          Grid.Row=&quot;1&quot;
          Margin=&quot;{StaticResource MediumLeftRightMargin}&quot;
          Background=&quot;{DynamicResource MahApps.Brushes.Gray10}&quot;&gt;
          &lt;!--
          The Mahapps Gray10 color represents where you should place your content.
          Place your content here.
          --&gt;
          &lt;views:TestUserControl&gt;&lt;/views:TestUserControl&gt;
      &lt;/Grid&gt;
  &lt;/Grid&gt;
  </code></pre>
  
  <p>6 - Update the ShellWindow.xaml, including the TitleTemplate,</p>
  <pre><code>&lt;controls:MetroWindow
  x:Class=&quot;NoDevExpresssTitleTemplate.Views.ShellWindow&quot;
  xmlns=&quot;http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;
  xmlns:x=&quot;http://schemas.microsoft.com/winfx/2006/xaml&quot;
  xmlns:d=&quot;http://schemas.microsoft.com/expression/blend/2008&quot;
  xmlns:dxlc=&quot;http://schemas.devexpress.com/winfx/2008/xaml/layoutcontrol&quot;
  xmlns:mc=&quot;http://schemas.openxmlformats.org/markup-compatibility/2006&quot;
  xmlns:controls=&quot;http://metro.mahapps.com/winfx/xaml/controls&quot;
  xmlns:i=&quot;http://schemas.microsoft.com/xaml/behaviors&quot;
  xmlns:properties=&quot;clr-namespace:NoDevExpresssTitleTemplate.Properties&quot;
  xmlns:templateSelectors=&quot;clr-namespace:NoDevExpresssTitleTemplate.TemplateSelectors&quot;
  
  Style=&quot;{StaticResource CustomMetroWindow}&quot;
  mc:Ignorable=&quot;d&quot;
  MinWidth=&quot;500&quot;
  MinHeight=&quot;350&quot;
  Title=&quot;{x:Static properties:Resources.AppDisplayName}&quot;&gt;
  
  &lt;controls:MetroWindow.TitleTemplate&gt;
      &lt;DataTemplate&gt;
          &lt;dxlc:LayoutControl&gt;
              &lt;dxlc:LayoutGroup Orientation=&quot;Vertical&quot; Height=&quot;50&quot; &gt;
                  &lt;TextBlock Text=&quot;{TemplateBinding Content}&quot;
                             TextTrimming=&quot;CharacterEllipsis&quot;
                             VerticalAlignment=&quot;Center&quot;
                             Margin=&quot;8 -1 8 0&quot;
                             FontWeight=&quot;Light&quot;
                             FontSize=&quot;{DynamicResource WindowTitleFontSize}&quot;
                             FontFamily=&quot;{DynamicResource HeaderFontFamily}&quot; /&gt;
                  &lt;TextBlock Text=&quot;{TemplateBinding Content}&quot;
                             TextTrimming=&quot;CharacterEllipsis&quot;
                             VerticalAlignment=&quot;Center&quot;
                             Margin=&quot;8 -1 8 0&quot;
                             FontWeight=&quot;Light&quot;
                             FontSize=&quot;{DynamicResource WindowTitleFontSize}&quot;
                             FontFamily=&quot;{DynamicResource HeaderFontFamily}&quot; /&gt;
              &lt;/dxlc:LayoutGroup&gt;
          &lt;/dxlc:LayoutControl&gt;
  
      &lt;/DataTemplate&gt;
  &lt;/controls:MetroWindow.TitleTemplate&gt;
  
  &lt;i:Interaction.Triggers&gt;
      &lt;i:EventTrigger EventName=&quot;Loaded&quot;&gt;
          &lt;i:InvokeCommandAction Command=&quot;{Binding LoadedCommand}&quot; /&gt;
      &lt;/i:EventTrigger&gt;
      &lt;i:EventTrigger EventName=&quot;Unloaded&quot;&gt;
          &lt;i:InvokeCommandAction Command=&quot;{Binding UnloadedCommand}&quot; /&gt;
      &lt;/i:EventTrigger&gt;
  &lt;/i:Interaction.Triggers&gt;
  &lt;controls:MetroWindow.LeftWindowCommands&gt;
      &lt;controls:WindowCommands&gt;
          &lt;Button
              Width=&quot;{Binding ElementName=hamburgerMenu, Path=CompactPaneLength}&quot;
              AutomationProperties.Name=&quot;{x:Static properties:Resources.ShellGoBackButton}&quot;
              ToolTip=&quot;{x:Static properties:Resources.ShellGoBackButton}&quot;
              Command=&quot;{Binding GoBackCommand}&quot;&gt;
              &lt;TextBlock
                  Text=&quot;&amp;#xE72B;&quot;
                  FontSize=&quot;14&quot;
                  FontFamily=&quot;Segoe MDL2 Assets&quot;
                  AutomationProperties.Name=&quot;{x:Static properties:Resources.ShellGoBackButton}&quot; /&gt;
          &lt;/Button&gt;
      &lt;/controls:WindowCommands&gt;
  &lt;/controls:MetroWindow.LeftWindowCommands&gt;
  &lt;controls:MetroWindow.Resources&gt;
      &lt;templateSelectors:MenuItemTemplateSelector
          x:Key=&quot;MenuItemTemplateSelector&quot;&gt;
          &lt;templateSelectors:MenuItemTemplateSelector.GlyphDataTemplate&gt;
              &lt;DataTemplate DataType=&quot;{x:Type controls:HamburgerMenuGlyphItem}&quot;&gt;
                  &lt;Grid Height=&quot;48&quot;&gt;
                      &lt;Grid.ColumnDefinitions&gt;
                          &lt;ColumnDefinition Width=&quot;48&quot; /&gt;
                          &lt;ColumnDefinition /&gt;
                      &lt;/Grid.ColumnDefinitions&gt;
                      &lt;TextBlock
                          Grid.Column=&quot;0&quot;
                          FontSize=&quot;16&quot;
                          HorizontalAlignment=&quot;Center&quot;
                          VerticalAlignment=&quot;Center&quot;
                          FontFamily=&quot;Segoe MDL2 Assets&quot;
                          Text=&quot;{Binding Glyph}&quot;
                          ToolTip=&quot;{Binding Label}&quot; /&gt;
                      &lt;TextBlock
                          Grid.Column=&quot;1&quot;
                          VerticalAlignment=&quot;Center&quot;
                          FontSize=&quot;16&quot;
                          Text=&quot;{Binding Label}&quot; /&gt;
                  &lt;/Grid&gt;
              &lt;/DataTemplate&gt;
          &lt;/templateSelectors:MenuItemTemplateSelector.GlyphDataTemplate&gt;
          &lt;templateSelectors:MenuItemTemplateSelector.ImageDataTemplate&gt;
              &lt;DataTemplate DataType=&quot;{x:Type controls:HamburgerMenuImageItem}&quot;&gt;
                  &lt;Grid Height=&quot;48&quot;&gt;
                      &lt;Grid.ColumnDefinitions&gt;
                          &lt;ColumnDefinition Width=&quot;48&quot; /&gt;
                          &lt;ColumnDefinition /&gt;
                      &lt;/Grid.ColumnDefinitions&gt;
                      &lt;Ellipse
                          Grid.Column=&quot;0&quot;
                          Width=&quot;24&quot;
                          Height=&quot;24&quot;
                          HorizontalAlignment=&quot;Center&quot;
                          VerticalAlignment=&quot;Center&quot;
                          ToolTip=&quot;{Binding Label}&quot;&gt;
                          &lt;Ellipse.Fill&gt;
                              &lt;ImageBrush ImageSource=&quot;{Binding Thumbnail}&quot; /&gt;
                          &lt;/Ellipse.Fill&gt;
                      &lt;/Ellipse&gt;
                      &lt;TextBlock
                          Grid.Column=&quot;1&quot;
                          VerticalAlignment=&quot;Center&quot;
                          FontSize=&quot;16&quot;
                          Text=&quot;{Binding Label}&quot; /&gt;
                  &lt;/Grid&gt;
              &lt;/DataTemplate&gt;
          &lt;/templateSelectors:MenuItemTemplateSelector.ImageDataTemplate&gt;
      &lt;/templateSelectors:MenuItemTemplateSelector&gt;
  &lt;/controls:MetroWindow.Resources&gt;
  &lt;controls:MetroWindow.Content&gt;
      &lt;controls:HamburgerMenu
          x:Name=&quot;hamburgerMenu&quot;
          HamburgerButtonName=&quot;{x:Static properties:Resources.ShellHamburgerButtonName}&quot;
          IsPaneOpen=&quot;False&quot;
          DisplayMode=&quot;CompactInline&quot;
          ItemsSource=&quot;{Binding MenuItems}&quot;
          SelectedItem=&quot;{Binding SelectedMenuItem}&quot;
          ItemCommand=&quot;{Binding MenuItemInvokedCommand}&quot;
          ItemTemplateSelector=&quot;{StaticResource MenuItemTemplateSelector}&quot;&gt;
          &lt;controls:HamburgerMenu.Content&gt;
              &lt;Frame
                  x:Name=&quot;shellFrame&quot;
                  Grid.Row=&quot;1&quot;
                  NavigationUIVisibility=&quot;Hidden&quot;
                  Focusable=&quot;False&quot; /&gt;
          &lt;/controls:HamburgerMenu.Content&gt;
      &lt;/controls:HamburgerMenu&gt;
  &lt;/controls:MetroWindow.Content&gt;&lt;/controls:MetroWindow&gt;
  </code></pre>
  <p>The default Light.Blue theme/style is lost,
  <a href="https://i.stack.imgur.com/IZSAd.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/IZSAd.png" alt="enter image description here" /></a></p>