title: WPF ComboBox Popup template with border changing background color every system color changes
body: <p>I have here my customized <code>ComboBox</code>:</p>
  
  <p><img src="https://i.stack.imgur.com/PNC3c.png" alt="enter image description here"><br/></p>
  
  <p>It's actually a browser selection. But right now what you see there is a prototype of the selector control using <code>ComboBox</code>.</p>
  
  <p>The problem I am having is this dropdown (<code>Popup</code>) control background</p>
  
  <p><img src="https://i.stack.imgur.com/LzjHp.png" alt="enter image description here"></p>
  
  <p>The background color should dynamically change once the user change their theme color in <code>Color and Apperance</code> setting in <code>Personalization</code>.</p>
  
  <p>This is the story behind my template</p>
  
  <p>I am able to change the <code>Background</code> color using a simple <code>Converter</code>:</p>
  
  <pre><code>public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
  {
      int argbColor = (int)Microsoft.Win32.Registry.GetValue(@"HKEY_CURRENT_USER\Software\Microsoft\Windows\DWM", "ColorizationColor", null);
      var color = System.Drawing.Color.FromArgb(argbColor);
  
      SolidColorBrush scb = new SolidColorBrush();
  
      if (Environment.OSVersion.Version.Major == 6 &amp;&amp; Environment.OSVersion.Version.Minor == 1) // Windows 7
      {
          //scb = new SolidColorBrush(Color.FromArgb((byte)((int)color.A / 3), color.R, color.G, color.B));
          scb = new SolidColorBrush(Color.FromArgb(color.A, color.R, color.G, color.B));
      }
      else if (Environment.OSVersion.Version.Major == 6 &amp;&amp; Environment.OSVersion.Version.Minor == 2) // Windows 8 
      {
          scb = new SolidColorBrush(Color.FromArgb(color.A, color.R, color.G, color.B));
      }
  
      return scb;
  }
  </code></pre>
  
  <p>set it up like this:</p>
  
  <pre><code>&lt;me:BackgroundConverter x:Key="BgConverter" /&gt;
  </code></pre>
  
  <p>and implement it like this:</p>
  
  <pre><code>&lt;ControlTemplate TargetType="{x:Type ComboBox}"&gt;
      &lt;Grid x:Name="MainGrid" SnapsToDevicePixels="true"&gt;
          &lt;Grid.ColumnDefinitions&gt;
              &lt;ColumnDefinition Width="*"/&gt;
              &lt;ColumnDefinition MinWidth="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" Width="0"/&gt;
          &lt;/Grid.ColumnDefinitions&gt;
          &lt;Popup x:Name="PART_Popup" Grid.Column="0" AllowsTransparency="true" IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}}" Margin="1" PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" Placement="Bottom"&gt;
              &lt;Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent"&gt;
                  &lt;Border x:Name="DropDownBorder" 
                      BorderBrush="{DynamicResource {x:Static SystemColors.WindowFrameBrushKey}}" 
                      BorderThickness="{Binding Converter={StaticResource BorderConverter}}" 
                      Background="{Binding Converter={StaticResource BgConverter}}" 
                      CornerRadius="0,0,12,12"&gt;
  
                      &lt;ItemsPresenter x:Name="bn" KeyboardNavigation.DirectionalNavigation="Contained" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" HorizontalAlignment="Center" /&gt;
                  &lt;/Border&gt;
              &lt;/Themes:SystemDropShadowChrome&gt;
          &lt;/Popup&gt;
          &lt;ToggleButton Grid.ColumnSpan="2" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Style="{StaticResource ComboBoxReadonlyToggleButton}"/&gt;
          &lt;ContentPresenter ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" Content="{TemplateBinding SelectionBoxItem}" ContentStringFormat="{TemplateBinding SelectionBoxItemStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" IsHitTestVisible="false" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/&gt;
      &lt;/Grid&gt;
      &lt;ControlTemplate.Triggers&gt;
          &lt;Trigger Property="HasItems" Value="false"&gt;
              &lt;Setter Property="Height" TargetName="DropDownBorder" Value="95"/&gt;
          &lt;/Trigger&gt;
          &lt;Trigger Property="IsEnabled" Value="false"&gt;
              &lt;Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/&gt;
              &lt;Setter Property="Background" Value="#FFF4F4F4"/&gt;
          &lt;/Trigger&gt;
          &lt;Trigger Property="IsGrouping" Value="true"&gt;
              &lt;Setter Property="ScrollViewer.CanContentScroll" Value="false"/&gt;
          &lt;/Trigger&gt;
      &lt;/ControlTemplate.Triggers&gt;
  &lt;/ControlTemplate&gt;
  </code></pre>
  
  <p>check the <code>Border x:Name="DropDownBorder"</code> line. Now how do I make it dynamically change when a user changes their theme color? I tried via Trigger:</p>
  
  <pre><code>&lt;Trigger Property="IsDropDownOpen" Value="true"&gt;
      &lt;!-- not really working --&gt;
      &lt;Setter Property="Background" TargetName="DropDownBorder" Value="{Binding Converter={StaticResource BgConverter}}"/&gt;
  &lt;/Trigger&gt;
  </code></pre>
  
  <p>but it's not working</p>
  
  <p>I actually have a pretty simple lame solution by hooking onto <code>DropDownOpened</code> or <code>DropDownClosed</code> events and just change the background color from there. That solution is actually working pretty well but there may be a simplest way of doing it via Trigger or EventTrigger?</p>
  
  <p>-- UPDATE --</p>
  
  <pre><code>public static class ComboBoxExtension
  {
      public static void UpdatePopupBackground(this ComboBox cb)
      {
          Border b = (Border)cb.Template.FindName("DropDownBorder", cb);
  
          int argbColor = (int)Microsoft.Win32.Registry.GetValue(@"HKEY_CURRENT_USER\Software\Microsoft\Windows\DWM", "ColorizationColor", null);
          var color = System.Drawing.Color.FromArgb(argbColor);
  
          SolidColorBrush scb = new SolidColorBrush();
  
          if (Environment.OSVersion.Version.Major == 6 &amp;&amp; Environment.OSVersion.Version.Minor == 1) // Windows 7
          {
              //scb = new SolidColorBrush(Color.FromArgb((byte)((int)color.A / 3), color.R, color.G, color.B));
              scb = new SolidColorBrush(Color.FromArgb(color.A, color.R, color.G, color.B));
          }
          else if (Environment.OSVersion.Version.Major == 6 &amp;&amp; Environment.OSVersion.Version.Minor == 2) // Windows 8 
          {
              scb = new SolidColorBrush(Color.FromArgb(color.A, color.R, color.G, color.B));
          }
  
          b.Background = scb;
      }
  }
  </code></pre>
  
  <p>and call it when the DropDownOpened triggers:</p>
  
  <pre><code>ComboMe.UpdatePopupBackground();
  </code></pre>
  
  <p>LOL... well..</p>