如何使用make BarCheckItem IsCheked在BarCheckItem的DataTemplate中触发样式更改？

Question

问题：在BarCheckItem中，如果BarCheckItem IsChecked，如何在其DataTemplate中设置边框样式？

我正在造型BarCheckItem。为此，我添加了一个ContentTemplate，内置DataTemplate，我添加了一些在MouseOver上更改的颜色边框：

<dxb:BarCheckItem Name="barCheckItemRecord"
                  Command="..."
                  Cursor="Hand"
                  IsChecked="..."
                  IsVisible="..." >

      <dxb:BarCheckItem.ContentTemplate>
           <DataTemplate>
                  <StackPanel>
                      <Border x:Name="audioButtonInnerBorderLight">
                          <Canvas .../>
                      </Border>
                  </StackPanel>

                  <DataTemplate.Triggers>
                       <Trigger Property="IsMouseOver" Value="true">
                             <Setter TargetName="audioButtonInnerBorderLight" Property="Background" Value="#30FFFFFF" />
                       </Trigger>
                  </DataTemplate.Triggers>

           </DataTemplate>
       </dxb:BarCheckItem.ContentTemplate>
</dxb:BarCheckItem>

当BarCheckItem为IsChecked时，我现在要做的是更改边框的颜色。

问题是，我只知道如何在样式中使用触发器，如下所示：

<dxb:BarCheckItem Name="barCheckItemRecord" [all the code from above]>
...
<dxb:BarCheckItem.Style>
     <Style TargetType="{x:Type dxb:BarCheckItem}">
           <Setter Property="Background" Value="Red" />
                 <Style.Triggers>
                       <Trigger Property="IsChecked" Value="True">
                             <Setter Property="Background" Value="Blue" />
                       </Trigger>
                       <Trigger Property="IsChecked" Value="{x:Null}">
                             <Setter Property="Background" Value="Yellow" />
                       </Trigger>
                 </Style.Triggers>
      </Style>
</dxb:BarCheckItem.Style>
</dxb:BarCheckItem>

但我不知道如何从触发器指向边框（x：Name =“audioButtonInnerBorderLight”）。因为触发器不知道边框的位置。

我怎样才能做出类似下面的工作？：

<Style TargetType="{x:Type dxb:BarCheckItem}">
<Trigger Property="IsChecked" Value="True">
     <Setter TargetName="audioButtonInnerBorderLight" Property="Background" Value="Purple" />
</Trigger>
</Style>

注意：我认为最好的想法是使用BarCheckItem setter将边框放在Template的ContentTemplate中。但看起来BarCheckItems不允许模板化。

Answer 1

您应该将这些触发器添加到DataTemplate：

  <dxb:BarCheckItem Name="barCheckItemRecord"
              Command="..."
              Cursor="Hand"
              IsChecked="..."
              IsVisible="..." >

        <dxb:BarCheckItem.ContentTemplate>
            <DataTemplate>
                <StackPanel>
                    <Border x:Name="audioButtonInnerBorderLight">
                        <Canvas .../>
                    </Border>
                </StackPanel>

                <DataTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter TargetName="audioButtonInnerBorderLight" Property="Background" Value="#30FFFFFF" />
                    </Trigger>

                    <DataTrigger Binding="{Binding Path=IsChecked,RelativeSource={RelativeSource AncestorType={x:Type dxb:BarCheckItem}}}" Value="True">
                        <Setter TargetName="audioButtonInnerBorderLight" Property="Background" Value="Blue" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding Path=IsChecked,RelativeSource={RelativeSource AncestorType={x:Type dxb:BarCheckItem}}}"  Value="{x:Null}">
                        <Setter TargetName="audioButtonInnerBorderLight" Property="Background" Value="Yellow" />
                    </DataTrigger>
                </DataTemplate.Triggers>

            </DataTemplate>
        </dxb:BarCheckItem.ContentTemplate>
    </dxb:BarCheckItem>

Answer 2

我终于找到了最好的方法。

我所做的是在样式中添加ContentTemplate，并使用那里的触发器：

<dxb:BarCheckItem ...>

     <dxb:BarCheckItem.Style>
         <Style TargetType="{x:Type dxb:BarCheckItem}">
             <Setter Property="ContentTemplate">
                 <Setter.Value>
                     <DataTemplate>
                          <StackPanel>
                              <Border x:Name="audioButtonInnerBorderLight">
                                  <Canvas .../>
                              </Border>
                          </StackPanel>

                          <DataTemplate.Triggers>
                              <Trigger Property="IsMouseOver" Value="true">
                                   <Setter TargetName="audioButtonInnerBorderDark" Property="Background" Value="#30FFFFFF" />
                              </Trigger>
                          </DataTemplate.Triggers>
                      </DataTemplate>
                   </Setter.Value>
               </Setter>

               <Style.Triggers>
                   <Trigger Property="IsChecked" Value="True">
                       <Setter Property="ContentTemplate">
                           <Setter.Value>
                                <DataTemplate>
                                     <StackPanel>
                                          <Border x:Name="audioButtonInnerBorderCHECKED">
                                               <Canvas .../> (different styles here)
                                          </Border>
                                     </StackPanel>
                                </DataTemplate>
                            </Setter.Value>
                       </Setter>
                   </Trigger>
              </Style.Triggers>
         </Style>
      </dxb:BarCheckItem.Style>
 </dxb:BarCheckItem>