将WPF动画触发器从一个ControlTemplate元素传递到另一个元素的最佳实践

将WPF动画触发器从一个ControlTemplate元素传递到另一个元素的最佳实践,wpf,animation,triggers,styles,controltemplate,Wpf,Animation,Triggers,Styles,Controltemplate,在读了好几篇文章之后,我仍然找不到任何方法来解决我的问题。。。基本上,我重新定义了按钮布局,并将其打包成一种风格。新的Button ControlTemplate包含一个我想在单击按钮时设置动画的矩形。我必须在动画中使用哪个TargetProperty?以下是我所做的: UserControl x:Class="OfficeTourismeBrantome.Views.MainMenuView" xmlns="http://schemas.microsoft.com/winfx

在读了好几篇文章之后,我仍然找不到任何方法来解决我的问题。。。基本上,我重新定义了按钮布局,并将其打包成一种风格。新的Button ControlTemplate包含一个我想在单击按钮时设置动画的矩形。我必须在动画中使用哪个TargetProperty?以下是我所做的:

UserControl x:Class="OfficeTourismeBrantome.Views.MainMenuView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="800" d:DesignWidth="300">
<UserControl.Resources>
    <Style x:Key="MenuItemButtonStyle" TargetType="Button">
        <Setter Property="FontSize" Value="35" />
        <Setter Property="FontFamily" Value="Segoe" />
        <Setter Property="Foreground" Value="#FFEBEDEA" />
        <!--<Setter Property="Height" Value="{Binding MenuLayout.MenuItemSize.Height}" />-->
        <Setter Property="HorizontalContentAlignment" Value="Right" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">                        
                        <Canvas HorizontalAlignment="Stretch">
                            <ContentPresenter Canvas.Left="{Binding MenuLayout.MenuItemLeftMargin}" HorizontalAlignment="Center"                                                  
                                          VerticalAlignment="Center"/>
                        <Rectangle
                            Name="test"
                            Width="0"
                            Height="3"
                            Fill="Aqua"/>
                    </Canvas>                            
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <EventTrigger RoutedEvent="Button.Click">
                <EventTrigger.Actions>
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation 
                                <!-- Which targetProperty should I use to animate ControlTemplate Rectangle ?-->
                                From="0.0" 
                                To="10.0" 
                                Duration="0:0:2" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger.Actions>                    
            </EventTrigger>
        </Style.Triggers>
    </Style>        
</UserControl.Resources>
<ItemsControl Name="menuButtonContainer" ItemsSource="{Binding Items}" Margin="{Binding MenuLayout.MenuMargin}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Vertical" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>        
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button 
                Style="{StaticResource ResourceKey=MenuItemButtonStyle}" 
                Margin="{Binding ElementName=menuButtonContainer, 
                                    Path=DataContext.MenuLayout.MenuItemMargin}"                    
                Height="{Binding ElementName=menuButtonContainer, 
                                    Path=DataContext.MenuLayout.MenuItemSize.Height}"
                Content="{Binding Text}"
                Command="{Binding ElementName=menuButtonContainer, 
                                    Path=DataContext.ChangeThemeCommand}"
                CommandParameter="{Binding Id}"
                />
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>
我的实现可能是错误的,仍然试图理解WPF的微妙之处。。。实现我的目标最好的方法是什么


非常感谢你的回答

您要为哪个目标属性设置动画,这是您必须问自己的问题!是否要更改矩形的宽度?它的不透明性

最佳实践。。。我不知道,但这是一种方法:

<ControlTemplate TargetType="Button">
[...]
   <ControlTemplate.Triggers>
      <EventTrigger RoutedEvent="Button.Click">
          <EventTrigger.Actions>
             <BeginStoryboard>
                 <Storyboard TargetName="test" TargetProperty="Width">
                    <DoubleAnimation From="0.0" To="10.0" Duration="0:0:2" />
                  </Storyboard>
             </BeginStoryboard>
          </EventTrigger.Actions>
      </EventTrigger>
   </ControlTemplate.Triggers>

我必须在动画中使用哪个TargetProperty?这取决于您想要实现哪种动画。rry,我想要为width;设置动画;。但就房产本身而言,这是我寻找的最佳实践。如何访问ControlTemplate中的矩形。谢谢再次感谢弗朗索。工作完美!我有时觉得有点迷失了WPF无休止的嵌套功能。所以所有的一切都是关于放动画的地方。干杯