動畫背景中的SolidColorBrush

Question

我正在嘗試創建一個簡單的按鈕樣式，它將鼠標懸停時從0.0改爲1.0的背景不透明度（反之亦然）。我正在爲所述按鈕創建一個模板，並且我綁定了模板中的所有屬性。除了後臺的SolidColorBrush之外，它都能正常工作，我無法綁定到模板綁定。由於上下文我看到一些TemplateBinding不是正確的，但我無法找到另一種解決方案。我懷疑，可能有Background是Brush的問題，我只需要該畫筆的Color組件，但我無法獲得它。

顯而易見的重寫是使用兩種不同的顏色（工作）創建兩個模板樣式，但我想避免這種硬編碼和複製粘貼。我想要的是在Button上指定Background屬性的選項，該屬性將在SolidColorBrush中使用，然後不透明度將完成其餘部分。

<Style TargetType="{x:Type Button}" x:Key="WindowButtonStyle"> 
    <Setter Property="Width" Value="46" /> 
    <Setter Property="Height" Value="32" /> 
    <Setter Property="BorderThickness" Value="0" /> 
    <Setter Property="VerticalAlignment" Value="Center" /> 

    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"> 
        <Border.Background> 
         <SolidColorBrush x:Name="ButtonBackgroundBrush" Color="???" Opacity="0.0" /> 
        </Border.Background> 
        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}" /> 
       </Border> 
       <ControlTemplate.Resources> 
        <Storyboard x:Key="MouseOverAnimation"> 
         <DoubleAnimation Storyboard.TargetName="ButtonBackgroundBrush" Storyboard.TargetProperty="Opacity" To="1.0" Duration="0:0:0.15" /> 
        </Storyboard> 
        <Storyboard x:Key="MouseOutAnimation"> 
         <DoubleAnimation Storyboard.TargetName="ButtonBackgroundBrush" Storyboard.TargetProperty="Opacity" To="0.0" Duration="0:0:0.15" /> 
        </Storyboard> 
       </ControlTemplate.Resources> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Trigger.EnterActions> 
          <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}" /> 
         </Trigger.EnterActions> 
         <Trigger.ExitActions> 
          <BeginStoryboard Storyboard="{StaticResource MouseOutAnimation}" /> 
         </Trigger.ExitActions> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

然後，按鈕被這樣使用：

<Button x:Name="MinimizeButton" Style="{StaticResource WindowButtonStyle}" Click="MinimizeButton_Click" Background="Green"> 
    <Image Source="../Resources/WindowButtons/Images/win-minimize.png" Width="12" Height="12"></Image> 
</Button> 

新增Background="Green"屬性設置進行測試，但沒有奏效。

Answer 1

像往常一樣回答我自己的問題 - 您在發佈S/O後立即找出解決方案。所以，我希望這將幫助別人：

... 
        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"> 
         <Border.Background> 
          <!-- ReSharper disable once Xaml.BindingWithContextNotResolved --> 
          <SolidColorBrush x:Name="ButtonBackgroundBrush" Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Background.Color}" Opacity="0.0" /> 
         </Border.Background> 
         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}" /> 
        </Border> 
... 

我已經包括了ReSharper disable爲好，因爲警告形式ReSharper的是什麼阻止了我想這一個 - 和絕望迫使我無論如何要試試。

Answer 2

你可以使用一個TemplateBinding到Border的Background屬性綁定到Button的Background，然後動畫SolidColorBrush這樣的Opacity屬性：

<Style TargetType="{x:Type Button}" x:Key="WindowButtonStyle"> 
    <Setter Property="Width" Value="46" /> 
    <Setter Property="Height" Value="32" /> 
    <Setter Property="BorderThickness" Value="0" /> 
    <Setter Property="VerticalAlignment" Value="Center" /> 

    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" 
           Background="{TemplateBinding Background}"> 
        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}" /> 
       </Border> 
       <ControlTemplate.Resources> 
        <Storyboard x:Key="MouseOverAnimation"> 
         <DoubleAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Background.(SolidColorBrush.Opacity)" To="1.0" Duration="0:0:0.15" /> 
        </Storyboard> 
        <Storyboard x:Key="MouseOutAnimation"> 
         <DoubleAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Background.(SolidColorBrush.Opacity)" To="0.0" Duration="0:0:0.15" /> 
        </Storyboard> 
       </ControlTemplate.Resources> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Trigger.EnterActions> 
          <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}" /> 
         </Trigger.EnterActions> 
         <Trigger.ExitActions> 
          <BeginStoryboard Storyboard="{StaticResource MouseOutAnimation}" /> 
         </Trigger.ExitActions> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style>