同一个窗口中不同的按钮控件使用同一个storyboard的方法（WPF）

  在<storyboard>标签中，有一个target name需要指定，在使用中，如果是同一个窗体里的不同按钮（背景风格不同）需要使用同一个storyboard，那么就会遇到target name

指定的问题，下面的方法是自己在工作中遇到类似问题的解决方案，希望能有所帮助。

解决思路：新建按钮模板，动态传入背景图片，在模板中加入<storyboard>，传入的就是一个模板中泛指的元素名。

style如下：

 <!--带有动画的按钮风格 背景图片的source通过按钮的dataContent传入-->

        <Style x:Key="StoryBtn" TargetType="{x:Type ToggleButton}">

            <Setter Property="Template">

                <Setter.Value>

                    <ControlTemplate TargetType="{x:Type ToggleButton}">

                        <Border x:Name="border" BorderThickness=" 0" BorderBrush="Black">

                            <Grid x:Name="btngrid" Width="50" Height="20">

                                <Grid.ColumnDefinitions>

                                    <ColumnDefinition Width="20" MinWidth="16"/>

                                    <ColumnDefinition Width="30" MinWidth="25"/>

                                </Grid.ColumnDefinitions>

                                <Image Name="IMG" Source="{Binding}" Width="16" Height="16" HorizontalAlignment="Left"/>

                                <TextBlock x:Name="TXT" Grid.Column="1" Text="{TemplateBinding Content}" 

                                           HorizontalAlignment="Right" VerticalAlignment="Center"/>

                            </Grid>

                        </Border>

                        <ControlTemplate.Triggers>

                            <!--鼠标移入移出-->

                            <Trigger Property="IsMouseOver" Value="True">

                                <Trigger.EnterActions>

                                    <BeginStoryboard>

                                        <Storyboard>

                                            <DoubleAnimation To="18" Storyboard.TargetName="IMG" Storyboard.TargetProperty="(FrameworkElement.Width)"/>

                                            <DoubleAnimation To="18" Storyboard.TargetName="IMG" Storyboard.TargetProperty="(FrameworkElement.Height)"/>

                                            <DoubleAnimation To="13" Storyboard.TargetName="TXT" Storyboard.TargetProperty="(TextElement.FontSize)"/>

                                        </Storyboard>

                                    </BeginStoryboard>

                                </Trigger.EnterActions>

                                <Trigger.ExitActions>

                                    <BeginStoryboard>

                                        <Storyboard>

                                            <DoubleAnimation To="16" Storyboard.TargetName="IMG" Storyboard.TargetProperty="(FrameworkElement.Width)"/>

                                            <DoubleAnimation To="16" Storyboard.TargetName="IMG" Storyboard.TargetProperty="(FrameworkElement.Height)"/>

                                            <DoubleAnimation To="12" Storyboard.TargetName="TXT" Storyboard.TargetProperty="(TextElement.FontSize)"/>

                                        </Storyboard>

                                    </BeginStoryboard>

                                </Trigger.ExitActions>

                                <Setter Property="FontWeight" Value="Bold" TargetName="TXT"/>

                            </Trigger>

                            <Trigger Property="IsChecked" Value="True">

                                <Setter Property="BorderThickness" Value="0.1" TargetName="border"/>

                            </Trigger>

                        </ControlTemplate.Triggers>

                    </ControlTemplate>

                </Setter.Value>

            </Setter>
        </Style>

风格写好后，就是使用的问题了，使用方法如下：

 <StackPanel Orientation="Horizontal">

            <ToggleButton Content="全屏" Name="BtnFull" Foreground="#ff2c81cc" DataContext="images\full.png" 

                          Style="{DynamicResource StoryBtn}" Margin="5"/>

            <ToggleButton Content="四屏" Name="BtnFurth" Foreground="#ff2c81cc" DataContext="images\fourth.png" 

                          Style="{DynamicResource StoryBtn}"  Margin="10"/>

        </StackPanel>

运行效果如下：