Фоновые рисунки кнопок WPF

Question

Когда элемент управления отключен, фон позади изображения становится серым, и когда я курсор над ним, фон за моим изображением также становится подсвеченным. Как предотвратить это?

XMAL

<Button x:Name="btnSubmitCase" Content="Button" Canvas.Left="87" Canvas.Top="326" Background="{x:Null}" Margin="136,409,409,50" BorderThickness="0" Cursor="Hand" Click="btnSubmitCase_Click"> 
     <Button.Template> 
      <ControlTemplate> 
       <Button HorizontalAlignment="Center" VerticalAlignment="Center" Background="{x:Null}" BorderBrush="{x:Null}" BorderThickness="0"> 
        <Image Source="Resources/CaseButton.png"/> 
       </Button> 
      </ControlTemplate> 
     </Button.Template> 
    </Button> 

Answer 1

Я понятия не имею, почему вы бы поставить Buttonвнутри в ControlTemplate для Button вместо того, чтобы просто используя этот код XAML:

<Button HorizontalAlignment="Center" VerticalAlignment="Center" Background="{x:Null}" 
    BorderBrush="{x:Null}" BorderThickness="0"> 
    <Image Source="Resources/CaseButton.png" />> 
</Button> 

Однако, что WASN 't ваш вопрос, на который есть простой ответ ... просто не ставьте Button в ControlTemplate:

<Button x:Name="btnSubmitCase" ...> 
    <Button.Template> 
     <ControlTemplate> 
      <Image Source="Resources/CaseButton.png" /> 
     </ControlTemplate> 
    </Button.Template> 
</Button> 

Поведение, которое вы описываете построен по умолчанию ControlTemplate для управления Button. Чтобы удалить его, просто определите свой собственный ControlTemplate.

Answer 2

Шаблон по умолчанию для кнопки включает триггеры, которые переопределяют внешний вид, когда кнопка зависает, нажата или отключена. (Вы можете проверить Xaml для них, если вы редактируете тему по умолчанию в Blend.)

Чтобы предотвратить это поведение, вам необходимо полностью переопределить шаблон - то, что вы делали в данный момент, просто переопределяет шаблон вашей локальной кнопки с другой кнопкой, содержащей изображение. Одним из примеров этого может быть простым твик, что вы уже сделали:

<Button x:Name="btnSubmitCase" Content="Button" Canvas.Left="87" Canvas.Top="326" Background="{x:Null}" Margin="136,409,409,50" BorderThickness="0" Cursor="Hand" Click="btnSubmitCase_Click"> 
     <Button.Template> 
      <ControlTemplate> 
       <Image Source="Resources/CaseButton.png"/> 
      </ControlTemplate> 
     </Button.Template> 
    </Button> 

Обратите внимание, что это удалит все границ кнопки и другого поведения, состояние изменения, и в основном только оказывает интерактивное изображение.