title: TemplateBinding to DependencyProperty on a custom control not working
body: <p>Currently, I'm working on a simple custom button that uses user supplied images as a background for the pressed and normal states. I've a lot of buttons so I decided to write a custom button and implement two properties for the pressed and normal states' pictures.</p>
  
  <p>Here is the code I'm using</p>
  
  <pre><code>public partial class ThemeableButton : Button
  {
      public ThemeableButton()
      {
          InitializeComponent();
      }
  
  
      public static readonly DependencyProperty PressedContentBackgroundSourceProperty = DependencyProperty.Register(
                      "PressedContentBackgroundSource", typeof(ImageSource), typeof(ThemeableButton), null);
      public ImageSource PressedContentBackgroundSource
      {
          get { return (ImageSource)GetValue(PressedContentBackgroundSourceProperty); }
          set
          {
              (value as BitmapImage).CreateOptions = BitmapCreateOptions.BackgroundCreation; 
              SetValue(PressedContentBackgroundSourceProperty, value);
          }
      }
  
  
      public static readonly DependencyProperty NormalContentBackgroundSourceProperty =
          DependencyProperty.Register("NormalContentBackgroundSource", typeof(ImageSource), typeof(ThemeableButton), null);
  
      public ImageSource NormalContentBackgroundSource
      {
          get { return (ImageSource)GetValue(NormalContentBackgroundSourceProperty); }
          set
          {
              (value as BitmapImage).CreateOptions = BitmapCreateOptions.BackgroundCreation;
              SetValue(NormalContentBackgroundSourceProperty, value);
          }
      }
  }
  </code></pre>
  
  <p>I wrote the style for this button as follows</p>
  
  <pre><code>        &lt;Style x:Key="ThemeableButtonTemplate" TargetType="MJbox_UIComponents_Controls:ThemeableButton"&gt;
          &lt;Setter Property="Background" Value="Transparent"/&gt;
          &lt;Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/&gt;
          &lt;Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/&gt;
          &lt;Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/&gt;
          &lt;Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/&gt;
          &lt;Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/&gt;
          &lt;Setter Property="Padding" Value="0"/&gt;
          &lt;Setter Property="Template"&gt;
              &lt;Setter.Value&gt;
                  &lt;ControlTemplate TargetType="MJbox_UIComponents_Controls:ThemeableButton"&gt;
                      &lt;Grid&gt;
                          &lt;VisualStateManager.VisualStateGroups&gt;
                              &lt;VisualStateGroup x:Name="CommonStates"&gt;
                                  &lt;VisualState x:Name="Normal"&gt;
                                      &lt;Storyboard&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Source" Storyboard.TargetName="ButtonBackground"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0" Value="{TemplateBinding NormalContentBackgroundSource}"&gt;
                                              &lt;/DiscreteObjectKeyFrame&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                      &lt;/Storyboard&gt;
                                  &lt;/VisualState&gt;
                                  &lt;VisualState x:Name="Pressed"&gt;
                                      &lt;Storyboard&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Source" Storyboard.TargetName="ButtonBackground"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0" Value="{TemplateBinding PressedContentBackgroundSource}"&gt;
                                              &lt;/DiscreteObjectKeyFrame&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                      &lt;/Storyboard&gt;
                                  &lt;/VisualState&gt;
                              &lt;/VisualStateGroup&gt;
                          &lt;/VisualStateManager.VisualStateGroups&gt;
                          &lt;Border BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="0"&gt;
                              &lt;Image x:Name="ButtonBackground" Stretch="None" Source="{TemplateBinding NormalContentBackgroundSource}"/&gt;
                          &lt;/Border&gt;       
                      &lt;/Grid&gt;
                  &lt;/ControlTemplate&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
      &lt;/Style&gt;
  </code></pre>
  
  <p>I tried a simple example </p>
  
  <pre><code>&lt;Controls:ThemeableButton Style="{StaticResource ThemeableButtonTemplate}" x:Name="btnDidntNeedIt" NormalContentBackgroundSource="{Binding Source={StaticResource DefaultTheme}, Path=DidntHaveButtonUnselected}"
                                     PressedContentBackgroundSource="{Binding Source={StaticResource DefaultTheme}, Path=DidntHaveButtonSelected}"
           /&gt;
  </code></pre>
  
  <p>but the image is not showing, I tried by removing the TemplateBinding from the style and replaced it with the relative source to the image file and it worked fine. I just don't wanna create a customized style for each button on the app. Any possible workaround?</p>