title: TemplateBinding with IValueConverter
body: <p>I want to generate a custom button in a WPF-project. I want the button to change its background color in such a way, that the opacity is reduced.</p>
  <p>Therefore I have a resource dictionary with a default button style:</p>
  <pre><code>&lt;Style x:Key=&quot;DefaultStyle&quot; TargetType=&quot;{x:Type Button}&quot;&gt;
      &lt;Setter Property=&quot;BorderThickness&quot; Value=&quot;0&quot;/&gt;
      &lt;Setter Property=&quot;Template&quot;&gt;
          &lt;Setter.Value&gt;
              &lt;ControlTemplate TargetType=&quot;Button&quot;&gt;
                  &lt;Border Background=&quot;{TemplateBinding Background}&quot;&gt;
                      &lt;ContentPresenter HorizontalAlignment=&quot;Center&quot; VerticalAlignment=&quot;Center&quot;/&gt;
                  &lt;/Border&gt;
                  &lt;ControlTemplate.Triggers&gt;
                      &lt;Trigger Property=&quot;IsMouseOver&quot; Value=&quot;True&quot;&gt;
                          &lt;Setter Property=&quot;Background&quot; Value=&quot;{Binding Path=Background, RelativeSource={RelativeSource Mode=TemplatedParent}, Converter={StaticResource OpacityConverter}}&quot;/&gt;
                      &lt;/Trigger&gt;
                  &lt;/ControlTemplate.Triggers&gt;
              &lt;/ControlTemplate&gt;
          &lt;/Setter.Value&gt;
      &lt;/Setter&gt;
  &lt;/Style&gt;
  
  &lt;Style x:Key=&quot;GreenButton&quot; TargetType=&quot;{x:Type Button}&quot; BasedOn=&quot;{StaticResource DefaultStyle}&quot;&gt;
          &lt;Setter Property=&quot;Background&quot; Value=&quot;{StaticResource Green}&quot;/&gt;
          &lt;Setter Property=&quot;Foreground&quot; Value=&quot;Black&quot;/&gt;
  &lt;/Style&gt;
  </code></pre>
  <p>with my custom converter:</p>
  <pre><code>&lt;conv:OpacityConverter x:Key=&quot;OpacityConverter&quot;/&gt;
  </code></pre>
  <p>implemented in <em>xmlns:conv=&quot;clr-namespace:ProjectNamespace.Converter&quot;:</em></p>
  <pre><code>public class OpacityConverter : IValueConverter
  {
  
      public OpacityConverter()
      {
  
      }
  
      public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
      {
          SolidColorBrush brush = ((SolidColorBrush)value).Clone();
          brush.Opacity = 0.5;
          return brush;
      }
  
      public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
      {
          SolidColorBrush brush = ((SolidColorBrush)value).Clone();
          brush.Opacity = 1;
          return brush;
      }
  }
  </code></pre>
  <p>In my Window I use the button like this:</p>
  <pre><code>&lt;Button Grid.Row=&quot;1&quot; Grid.Column=&quot;2&quot; 
          Style=&quot;{StaticResource GreenButton}&quot;&gt;
     &lt;TextBlock Text=&quot;neues Projekt anlegen&quot; TextWrapping=&quot;Wrap&quot; TextAlignment=&quot;Center&quot;/&gt;
  &lt;/Button&gt;
  </code></pre>
  <p>The button looks like this:</p>
  <p><a href="https://i.stack.imgur.com/eaZ15.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/eaZ15.png" alt="enter image description here" /></a></p>
  <p>and I want to have a look like this (if IsMouseOver == True):</p>
  <p><a href="https://i.stack.imgur.com/sHQc3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sHQc3.png" alt="enter image description here" /></a></p>
  <p>However in the moment, with <code>IsMouseOver == True</code> starts, the background gets totally white and the button looks like this:</p>
  <p><a href="https://i.stack.imgur.com/a8fEs.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/a8fEs.png" alt="enter image description here" /></a></p>
  <p>What am I missing?</p>