Wiązanie szablonów ze stylu DataTrigger In ControlTemplate

Question

W poniższym XAML używam prostokąta z obramowaniem jako szablonu dla ToggleButton. Chcę, aby BorderBrush był inny kolor, aby odzwierciedlić zmianę wartości ToggleButton.IsChecked. Niestety, moja próba użycia TemplateBinding w DataTrigger nie działa. Co muszę zrobić zamiast tego?

<StackPanel Orientation="Horizontal"> 
    <StackPanel.Resources> 
     <ControlTemplate x:Key="ButtonAsSwatchTemplate"> 
      <Border BorderThickness="1"> 
       <Border.Style> 
        <Style> 
         <Setter Property="BorderBrush" Value="Gainsboro" /> 
         <Style.Triggers> 
          <!-- TemplateBinding doesn't work.--> 
          <DataTrigger        
           Binding={TemplateBinding Property=IsChecked}  
           Value="True"> 
           <Setter Property="BorderBrush" Value="Black" /> 
          </DataTrigger> 
         </Style.Triggers> 
        </Style> 
       </Border.Style> 
       <Rectangle Fill="{TemplateBinding Property=Background}" 
          Width="15" Height="15" /> 
      </Border> 
     </ControlTemplate> 
    </StackPanel.Resources> 
    <ToggleButton Template="{StaticResource ButtonAsSwatchTemplate}" 
        HorizontalAlignment="Center" VerticalAlignment="Center" 
        Margin="2" Background="Red" /> 
</StackPanel> 

EDIT

Kiedy budować i przeładować projektanta pojawia się następujący błąd:

Error 1 Property 'Binding' nie obsługuje wartości typu 'TemplateBindingExpression'.

ROZWIĄZANIE

<StackPanel Orientation="Horizontal"> 
    <StackPanel.Resources> 
     <ControlTemplate x:Key="ButtonAsSwatchTemplate">  
      <Border x:Name="SwatchBorder" BorderThickness="1"> 
       <Rectangle Fill="{TemplateBinding Property=Background}" Width="15" Height="15" /> 
      </Border> 
     <ControlTemplate.Triggers> 
      <Trigger Property="ToggleButton.IsChecked" Value="True"> 
       <Setter TargetName="SwatchBorder" Property="BorderBrush" Value="Yellow" /> 
      </Trigger> 
     </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </StackPanel.Resources> 
    <RadioButton Template="{StaticResource ButtonAsSwatchTemplate}" 
     GroupName="CropGuidesColourRadioButtonGroup" 
     IsChecked="{Binding Checked}" Margin="2" Background="Red" /> 
    <RadioButton Template="{StaticResource ButtonAsSwatchTemplate}" 
     GroupName="CropGuidesColourRadioButtonGroup" 
     IsChecked="{Binding Checked}" Margin="2" Background="Black" /> 
    ... 
</StackPanel> 

Answer 1

Można użyć Trigger w ControlTemplate, na przykład

<StackPanel Orientation="Horizontal"> 
    <StackPanel.Resources> 
     <ControlTemplate x:Key="ButtonAsSwatchTemplate"> 
      <Border x:Name="myBorder" BorderBrush="Gainsboro" BorderThickness="1"> 
       <Rectangle Fill="{TemplateBinding Property=Background}" Width="15" Height="15" /> 
      </Border> 
      <ControlTemplate.Triggers> 
       <Trigger Property="ToggleButton.IsChecked" Value="True"> 
        <Setter TargetName="myBorder" Property="BorderBrush" Value="Black" /> 
       </Trigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </StackPanel.Resources> 
    <ToggleButton Template="{StaticResource ButtonAsSwatchTemplate}" 
       HorizontalAlignment="Center" VerticalAlignment="Center" 
       Margin="2" Background="Red" /> 
</StackPanel> 

Answer 2

Jeden problem, który widzę od razu, to ustawienie BorderBrush jako wartość właściwości lokalnej na granicy. To zawsze będzie nadpisywać wartość zastosowaną przez styl. Spróbuj usunąć jawny atrybut BorderBrush i sprawdź, czy to działa.

Border BorderBrush = "Gainsboro" BorderThickness = "1"

Dependency Property Value Inheritance