title: How to create a simple WPF UserControl button with custom enabled/disabled images?
body: <p>I am a bit new to WPF and XAML, just learning now.</p>
  
  <p>I found a quick-n-dirty code by some previous developer:</p>
  
  <pre><code>&lt;ControlTemplate x:Key="ButtonTemplate" TargetType="{x:Type Button}"&gt;
          &lt;Border Name="buttonBorder" Background="{TemplateBinding Background}"&gt;
              &lt;Border.Effect&gt;
                  &lt;DropShadowEffect Opacity="0.0" /&gt;
              &lt;/Border.Effect&gt;
          &lt;/Border&gt;
          &lt;ControlTemplate.Triggers&gt;
              &lt;Trigger Property="IsMouseOver" Value="true"&gt;
                  &lt;Setter TargetName="buttonBorder" Property="Effect"&gt;
                      &lt;Setter.Value&gt;
                          &lt;DropShadowEffect Opacity="0.8" /&gt;
                      &lt;/Setter.Value&gt;
                  &lt;/Setter&gt;
              &lt;/Trigger&gt;
              &lt;Trigger Property="IsMouseCaptured" Value="true"&gt;
                      &lt;Setter TargetName="buttonBorder" Property="Effect"&gt;                   
                           &lt;Setter.Value&gt;
                          &lt;DropShadowEffect Opacity="0.8" Direction="135"  
                               ShadowDepth="3" BlurRadius="1" /&gt;
                          &lt;/Setter.Value&gt;
                      &lt;/Setter&gt;
                  &lt;/Trigger&gt;
              &lt;Trigger Property="IsEnabled" Value="false"&gt;
                     &lt;Setter TargetName="buttonBorder" Property="Background"&gt;
                          &lt;Setter.Value&gt;
                          &lt;ImageBrush ImageSource="{Binding Path=Tag, RelativeSource={RelativeSource TemplatedParent}}"  /&gt;
                          &lt;/Setter.Value&gt;
                      &lt;/Setter&gt;            
                     &lt;Setter TargetName="buttonBorder" Property="Effect"&gt;
                      &lt;Setter.Value&gt;
                          &lt;DropShadowEffect Opacity="0.0"/&gt;
                      &lt;/Setter.Value&gt;
                  &lt;/Setter&gt;     
  
              &lt;/Trigger&gt;
          &lt;/ControlTemplate.Triggers&gt;
          &lt;/ControlTemplate&gt;
  </code></pre>
  
  <p>Basically it is just a template for a button with a basic mouseover effect and the image for disabled state bound to Tag (seems an ugly solution).</p>
  
  <p>I want to create a custom button which works pretty the same, but I want to expose two custom properties: NormalImage and DisabledImage. Those properties should be of type string not Uri. I want to use the path to image just "apply.png" and not "pack://application:,,,/Resources/Apply.png". 
  I guess, to have such custom properties I need a UserControl with dependency properties?</p>
  
  <p>Basically, I want to use the button as follows:</p>
  
  <pre><code>&lt;MyImageButton NormalImage="apply.png" DisabledImage="apply_disabled.png"/&gt;
  </code></pre>
  
  <p>Maybe NormalImage/DisabledImage will be bound to something later but that's unlikely.</p>
  
  <p>I could not find any example which implements such a basic button with custom properties, there are only some fancy buttons and controls online. Maybe I am just using incorrect keywords...</p>
  
  <p><strong>Could anyone point me to the right article or throw some simple piece of code to play with?</strong></p>
  
  <p>WPF is so complicated for beginners, sometimes it just does not work as expected, for example I still do not understand why I can add Trigger tag to ControlTemplate, but I cannot add Trigger tag straight to UserControl...</p>