XAML Storyboard DependencyObject 错误

Question

我在 XAML 应用程序中遇到错误。

我收到的错误是

'[Unknown]' 属性未指向路径中的 DependencyObject '(0).(1)[2].(2)'.

我四处搜索，发现需要在 Page.XAML 中的 <Image.RenderTransform> 标记内放入一些内容以进行 RotateTransform，但我不确定是什么，因为我是 XAML 新手并且仍在学习。

App.XAML

<Storyboard x:Key="spin">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" 
                                           Storyboard.TargetName="{Binding}"
                                           RepeatBehavior="Forever">
                <EasingDoubleKeyFrame KeyTime="0:0:1" 
                                      Value="360"/>
            </DoubleAnimationUsingKeyFrames>
</Storyboard>

Page.XAML

<Page.Triggers>
        <EventTrigger RoutedEvent="FrameworkElement.Loaded">
            <BeginStoryboard Storyboard="{DynamicResource spin}"/>
        </EventTrigger>
</Page.Triggers>

<Image x:Name="image1" 
       Margin="0, 0, 5, 0" 
       Source="{StaticResource inProcessImage}"
       Width="18" 
       RenderTransformOrigin="0.5,0.5">
    <Image.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform/>
            <TranslateTransform/>
        </TransformGroup>
    </Image.RenderTransform>
</Image>

<Image x:Name="image2" 
       Margin="0, 0, 5, 0"  
       Source="{StaticResource inProcessImage}"
       Width="18"  
       RenderTransformOrigin="0.5,0.5">
    <Image.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform/>
            <TranslateTransform/>
        </TransformGroup>
    </Image.RenderTransform>
</Image>

代码背后

startAni("spin", image1.Name);
startAni("spin", image2.Name);

void startAni(string storyboardName, string objectName)
{
    Storyboard sb = FindResource(storyboardName) as Storyboard;

    foreach (var child in sb.Children)
        Storyboard.SetTargetName(child, objectName);

    sb.Begin(this); // do not forget the this keyword
}

Answer 1

错误是由这部分引起的：

<Page.Triggers>
        <EventTrigger RoutedEvent="FrameworkElement.Loaded">
            <BeginStoryboard Storyboard="{DynamicResource spin}"/>
        </EventTrigger>
</Page.Triggers>

事件触发器未正确加载情节提要（未设置TargetName）。所以你看到了这个错误。

---

您可以将startAni 调用放在页面的加载事件中（在后面的代码中。） 这对我来说非常好：

    public Page() {

        InitializeComponent();

        Loaded += Page_Loaded;

    }

    private void Page_Loaded(object sender, RoutedEventArgs e)
    {
        startAni("spin", image1.Name);
        startAni("spin", image2.Name);
    }

---

仅 XAML 的解决方案如下所示：

<TimelineCollection x:Key="Ani">
            <DoubleAnimationUsingKeyFrames 

                Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)" 
                                           Storyboard.TargetName="{Binding}"
                                           RepeatBehavior="Forever">
                <EasingDoubleKeyFrame KeyTime="0:0:1" 
                                      Value="360"/>
            </DoubleAnimationUsingKeyFrames>
</TimelineCollection>

使用 TimelineCollection 而不是情节提要，然后您可以在 Page.XAML 中设置 TargetName。这根本不需要代码。

<EventTrigger RoutedEvent="FrameworkElement.Loaded">
    <BeginStoryboard>
        <Storyboard TargetName="image1" Children="{DynamicResource Ani}" />
    </BeginStoryboard>
    <BeginStoryboard>
        <Storyboard TargetName="image2" Children="{DynamicResource Ani}" />
    </BeginStoryboard>
</EventTrigger>

另一种方法是将情节提要放在一个样式中，并将该样式应用于每个图像。这将更清晰，更可重用。你可以大致了解如何做到这一点here