如何从WPF中的样式ControlTemplate引用父控件？

Question

我有一个简单的标签控件样式。我想用一个按钮在样式中定义一个控件模板，该按钮可以被点击并将标签的可见性属性设置为“隐藏”。事情是这样的：

<Style x:Key="MessageLabel_WithCloseButton" TargetType="{x:Type Label}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Label}"> 
       <Border BorderThickness="1" Padding="4" CornerRadius="3" 
         BorderBrush="Gray" Background="#FFA11616"> 
        <Grid> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="*" /> 
          <ColumnDefinition Width="Auto" /> 
         </Grid.ColumnDefinitions> 
         <ContentPresenter Grid.Column="0"/> 
         <Button Grid.Column="1" Width="16" Height="16" Padding="2" FontSize="9" Content="X"> 
         <!-- THIS IS WRONG! HOW TO CREATE A TRIGGER FOR THIS BUTTON 
          HERE AND HOW TO REFER TO THE LABEL? --> 
          <Button.Triggers> 

           <Trigger Property="Button.IsPressed" Value="True"> 
            <Setter Property="Visibility" Value="Hidden" /> 
           </Trigger> 
          </Button.Triggers> 
         </Button> 
        </Grid> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

的问题是我不知道如何处理点击与触发器以及如何设置包含按钮标签的属性。

谢谢。

Answer 1

你可以用它代替普通按钮切换按钮，然后只用了触发的财产器isChecked：

<Style x:Key="MessageLabel_WithCloseButton" TargetType="{x:Type Label}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Label}"> 
       <Border BorderThickness="1" Padding="4" CornerRadius="3" 
       BorderBrush="Gray" Background="#FFA11616"> 
        <Grid> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="*" /> 
          <ColumnDefinition Width="Auto" /> 
         </Grid.ColumnDefinitions> 
         <ContentPresenter Grid.Column="0"/> 
         <ToggleButton x:Name="CloseButton" Grid.Column="1" Width="16" Height="16" Padding="2" FontSize="9" Content="X"/> 
        </Grid> 
       </Border> 
       <ControlTemplate.Triggers> 
        <Trigger SourceName="CloseButton" Property="IsChecked" Value="True"> 
         <Setter Property="Visibility" Value="Hidden" /> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Answer 2

我用Blend 4创作了这个。基本上你想要在的按钮上处理“PreviewMouseButtonUp”事件。 EventTrigger将启动一个Storyboard，它将UIElement.Visibility属性设置为可视化树顶部的“隐藏”，以用于标签的样式。

要控制按钮中的内容，您可以使用标签控件上的Tag属性。否则，您将不得不创建另一个依赖属性，这意味着继承Label。

里面的风格的话，<Button/>看起来是这样的：

<Button x:Name="button" Grid.Column="1" Padding="2" 
    FontSize="9" 
    Content="{Binding Path=Tag, RelativeSource={RelativeSource TemplatedParent}}"/> 

...因为你可以将任何东西放入一个Tag属性，你可以这样做：

<Label x:Name="label" Content="Label" 
     Style="{DynamicResource MessageLabel_WithCloseButton}"> 
     <Label.Tag> 
      <StackPanel> 
       <TextBlock>WOOT</TextBlock> 
       <TextBlock>WOOT</TextBlock> 
      </StackPanel> 
     </Label.Tag> 
    </Label> 

这里一个修改完整的样式（我也修改了一些东西，以便更好地自动调整大小：

<Style x:Key="MessageLabel_WithCloseButton" TargetType="{x:Type Label}"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Label}"> 
        <ControlTemplate.Resources> 
         <Storyboard x:Key="OnClick1"> 
          <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="border"> 
           <DiscreteObjectKeyFrame KeyTime="0"> 
            <DiscreteObjectKeyFrame.Value> 
             <Visibility>Hidden</Visibility> 
            </DiscreteObjectKeyFrame.Value> 
           </DiscreteObjectKeyFrame> 
          </ObjectAnimationUsingKeyFrames> 
         </Storyboard> 
        </ControlTemplate.Resources> 
        <Border x:Name="border" BorderThickness="1" Padding="4" CornerRadius="3" 
        BorderBrush="Gray" Background="#FFA11616"> 
         <Grid> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="*" /> 
           <ColumnDefinition Width="Auto" /> 
          </Grid.ColumnDefinitions> 
          <ContentPresenter Grid.Column="0" VerticalAlignment="Center" Margin="0,0,3,0"/> 
          <Button x:Name="button" Grid.Column="1" Padding="2" FontSize="9" Content="{Binding Path=Tag, RelativeSource={RelativeSource TemplatedParent}}"/> 
         </Grid> 
        </Border> 
        <ControlTemplate.Triggers> 
         <EventTrigger RoutedEvent="UIElement.PreviewMouseLeftButtonUp" SourceName="button"> 
          <BeginStoryboard x:Name="OnClick1_BeginStoryboard" Storyboard="{StaticResource OnClick1}"/> 
         </EventTrigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

请注意，EventTrigger位于您的树上ControlTemplate上，而不是Button上。但这可能只是Blend生成代码的方式。