改變顏色按鈕，角落多面手

Question

我發現這個代碼： XAML：

<Button Content="Click Me!" Margin="209,135,263.4,140.8" Background="{x:Null}" BorderBrush="{x:Null}" Click="Button_Click_1"> 
     <Button.Template> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <Border x:Name="bdr_main" CornerRadius="3" Margin="0" BorderThickness="1" BorderBrush="Black" Background="LightGray"> 
        <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" Margin="8,6,8,6" ContentSource="Content" /> 
       </Border> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Setter TargetName="bdr_main" Property="Background" Value="LightGreen"/> 
        </Trigger> 
        <Trigger Property="IsPressed" Value="True"> 
         <Setter TargetName="bdr_main" Property="Background" Value="Red"/> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Button.Template> 
    </Button> 

這有可能改變背景顏色與WTF代碼？ 我點擊了按鈕，背景顏色發生了變化。

使用正常的按鈕 我可以使用此代碼： bdr_main.Background = new SolidColorBrush（Colors.Red）; 或 bdr_main.Background = Brushes.Red; 但他不工作 你能幫我嗎？

Answer 1

您可以使用一個切換按鈕，它的器isChecked財產

<ToggleButton Content="Click Me!" Margin="209,135,263.4,140.8"> 
    <ToggleButton.Template> 
     <ControlTemplate TargetType="{x:Type ToggleButton}"> 
      <Border x:Name="bdr_main" CornerRadius="3" Margin="0" 
        Background="LightGray" BorderThickness="1" BorderBrush="Black"> 
       <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" Margin="8,6,8,6" ContentSource="Content" /> 
      </Border> 
      <ControlTemplate.Triggers> 
       <Trigger Property="IsMouseOver" Value="True"> 
        <Setter TargetName="bdr_main" Property="Background" Value="LightGreen"/> 
       </Trigger> 
       <Trigger Property="IsChecked" Value="True"> 
        <Setter TargetName="bdr_main" Property="Background" Value="Red"/> 
       </Trigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </ToggleButton.Template> 
</ToggleButton> 

編輯

如果你想改變代碼的背景顏色的背後，你需要實現它的TemplateBinding

prop="{TemplateBinding Background} 

Stripp荷蘭國際集團的XAML到骨頭

<ToggleButton Click="Button_Click" Content="Click Me!" 
       Background="LightGray" Margin="209,135,263.4,140.8"> 
    <ToggleButton.Template> 
     <ControlTemplate TargetType="{x:Type ToggleButton}"> 
      <Border x:Name="bdr_main" CornerRadius="3" Margin="0" BorderThickness="1" BorderBrush="Black" 
        Background="{TemplateBinding Background}"> 
       <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" Margin="8,6,8,6" ContentSource="Content" /> 
      </Border> 
     </ControlTemplate> 
    </ToggleButton.Template> 
</ToggleButton> 

現在你可以

using System.Windows.Controls.Primitives; 

...

public void Button_Click(object sender, EventArgs e) 
{ 
    var butt = sender as ToggleButton; 
    if ((bool)butt.IsChecked) 
     butt.Background = Brushes.Red; 
    else 
     butt.Background = Brushes.LightGray; 
} 

鼠標懸停事件最好在ControlTemplate中處理，以獲得相同的行爲在我的第一篇文章中，您可以將其更改爲

<ControlTemplate TargetType="{x:Type ToggleButton}"> 
    <Border x:Name="bdr_main" CornerRadius="3" Margin="0" BorderThickness="1" BorderBrush="Black" 
      Background="{TemplateBinding Background}"> 
     <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" Margin="8,6,8,6" ContentSource="Content" /> 
    </Border> 
    <ControlTemplate.Triggers> 
     <MultiTrigger> 
      <MultiTrigger.Conditions> 
       <Condition Property="IsMouseOver" Value="True" /> 
       <Condition Property="IsChecked" Value="False" /> 
      </MultiTrigger.Conditions> 
      <MultiTrigger.Setters> 
       <Setter TargetName="bdr_main" Property="Background" Value="LightGreen" /> 
      </MultiTrigger.Setters> 
     </MultiTrigger> 
    </ControlTemplate.Triggers> 
</ControlTemplate> 

Answer 2

編輯改爲每切換按鈕OP跟進

只是一個二傳手添加到您的觸發器。

 <ToggleButton Content="Click Me!" Margin="209,135,263.4,140.8" Background="{x:Null}" BorderBrush="{x:Null}" Click="Button_Click_1"> 
      <ToggleButton.Template> 
       <ControlTemplate TargetType="{x:Type ToggleButton}"> 
        <Border x:Name="bdr_main" CornerRadius="3" Margin="0" BorderThickness="1" BorderBrush="Black" Background="LightGray"> 
         <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center" Margin="8,6,8,6" ContentSource="Content" /> 
        </Border> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsMouseOver" Value="True"> 
          <Setter TargetName="bdr_main" Property="Background" Value="LightGreen"/> 
         </Trigger> 
         <Trigger Property="IsChecked" Value="True"> 
          <Setter TargetName="bdr_main" Property="Background" Value="Red"/> 

          //Add line below 
          <Setter Property="Background" Value="Red" /> 

         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </ToggleButton.Template> 
     </ToggleButton> 

編輯 您不再需要這樣做

如果你想做到這一點在後面的代碼的單擊事件處理程序;注意此行爲與上面的觸發器不同，背景將保持紅色。

Button_Click_1(sender, e) 
{ 
    ((Button)sender).Background = Colors.Red;