Question

我在WPF中有一个故事板，它针对两个有很多动画的对象

<Storyboard x:Key="LoadingStoryboard">
    <DoubleAnimation To="1" Duration="{StaticResource TransactionTime}" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="Elem1" />
    <DoubleAnimation To="1" Duration="{StaticResource TransactionTime}" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="Elem1" />
    <DoubleAnimation To="0.4" Duration="{StaticResource TransactionTime}" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="Elem2" />
    <DoubleAnimation To="0.4" Duration="{StaticResource TransactionTime}" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="Elem2" />
    <DoubleAnimation To="0" Duration="{StaticResource TransactionTime}" Storyboard.TargetProperty="(local:Ring.InnerDiameter)" Storyboard.TargetName="Elem1" />
    <DoubleAnimation To="0" Duration="{StaticResource TransactionTime}" Storyboard.TargetProperty="(local:Ring.InnerDiameter)" Storyboard.TargetName="Elem2" />

    <DoubleAnimation To="0.85" BeginTime="{StaticResource TransactionTimeSpan}" Duration="0:0:0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="Elem1" RepeatBehavior="Forever" AutoReverse="True" />
    <DoubleAnimation To="0.85" BeginTime="{StaticResource TransactionTimeSpan}" Duration="0:0:0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="Elem1" RepeatBehavior="Forever" AutoReverse="True" />
    <DoubleAnimation To="0.45" BeginTime="{StaticResource TransactionTimeSpan}" Duration="0:0:0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="Elem2" RepeatBehavior="Forever" AutoReverse="True" />
    <DoubleAnimation To="0.45" BeginTime="{StaticResource TransactionTimeSpan}" Duration="0:0:0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="Elem2" RepeatBehavior="Forever" AutoReverse="True" />
</Storyboard>

一切都很好，直到我尝试用datatrigger开始那个故事板。当我尝试做的时候：

<Window.Style>
    <Style>
        <Style.Triggers>
            <DataTrigger Binding="{Binding IsLoading}" Value="True">
                <DataTrigger.EnterActions>
                    <BeginStoryboard Storyboard="{StaticResource LoadingStoryboard}" />
                </DataTrigger.EnterActions>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</Window.Style>

我收到例外A Storyboard tree in a Style cannot specify a TargetName. Remove TargetName 'Elem1'.

创建应使用datatrigger定位多个元素的动画的最佳做法是什么？

Answer 1

请勿在资源中指定Storyboard.TargetName属性：

<Storyboard x:Key="LoadingStoryboard">
    <DoubleAnimation To="1" Duration="{StaticResource TransactionTime}" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" />
    <DoubleAnimation To="0.4" Duration="{StaticResource TransactionTime}" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" />
    <DoubleAnimation To="0" Duration="{StaticResource TransactionTime}" Storyboard.TargetProperty="(local:Ring.InnerDiameter)" />

    <DoubleAnimation To="0.85" BeginTime="{StaticResource TransactionTimeSpan}" Duration="0:0:0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" RepeatBehavior="Forever" AutoReverse="True" />
    <DoubleAnimation To="0.45" BeginTime="{StaticResource TransactionTimeSpan}" Duration="0:0:0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" RepeatBehavior="Forever" AutoReverse="True" />
</Storyboard>

...并为要应用动画的每个元素定义一个触发器：

<Button x:Name="Elem1">
    ...
    <Button.Triggers>
        <EventTrigger RoutedEvent="Loading">
            <BeginStoryboard Storyboard="{StaticResource LoadingStoryboard}" />
        </EventTrigger>
    </Button.Triggers>
</Button>

<Button x:Name="Elem2">
    ...
    <Button.Triggers>
        <EventTrigger RoutedEvent="Loading">
            <BeginStoryboard Storyboard="{StaticResource LoadingStoryboard}" />
        </EventTrigger>
    </Button.Triggers>
</Button>

另一种选择是以编程方式应用Storyboard：

Programmatically creating a Storyboard in a WPF ControlTemplate

有很多目标的故事板

1 个答案: