Простая анимация Flipbook в XAML

Question

У меня есть 10 файлов XAML, каждый из которых содержит кадр анимации (они были преобразованы из SWF, поэтому для каждого объекта нет информации о ключевых кадрах).Каждый XAML-файл содержит Canvas с различными формами для каждого кадра.

Я хотел бы создать 1 XAML-файл, содержащий информацию о Canvas для каждого кадра, а затем использовать XAML для отображения каждого Canvas в соответствующее время, поэтомукаждый кадр показывается один за другим.Это хороший путь?Как я могу это сделать?Я пробовал в Blend, но это не представляется возможным, поскольку мои объекты различаются в каждом кадре (то есть я не анимирую свойства объекта).

Я ищу только декларативное решение.

Answer 1

Вы можете попробовать следующее:

<Grid x:Name="FrameContainer">
   <Canvas x:Name="Canvas1" Visibility="Collapsed"><!-- shapes --></Canvas>
   <Canvas x:Name="Canvas2" Visibility="Collapsed"><!-- shapes --></Canvas>
   <Canvas x:Name="Canvas3" Visibility="Collapsed"><!-- shapes --></Canvas>
   <Canvas x:Name="Canvas4" Visibility="Collapsed"><!-- shapes --></Canvas>
   <Canvas x:Name="Canvas5" Visibility="Collapsed"><!-- shapes --></Canvas>
   <Canvas x:Name="Canvas6" Visibility="Collapsed"><!-- shapes --></Canvas>
   ...
</Grid>

Затем создайте раскадровку, которая переключает видимость каждого холста, чтобы он выглядел как покадровая анимация.

У меня была похожая проблема в проекте, и я создал пользовательский элемент управления, который имеет (int) свойство зависимости Frame, которое отвечает за скрытие / отображение элементов из шаблона. Вы также можете анимировать свойство Frame.

Answer 2

В дополнение к сообщению Дарколептико, я использовал вышеописанный подход с раскадровкой:

<Window.Resources>
    <Storyboard x:Key="Storyboard1">
        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Canvas1">
            <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}"/>
            <DiscreteObjectKeyFrame KeyTime="0:0:0.1" Value="{x:Static Visibility.Collapsed}"/>
        </ObjectAnimationUsingKeyFrames>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Canvas2">
            <DiscreteObjectKeyFrame KeyTime="0:0:0.1" Value="{x:Static Visibility.Visible}"/>
            <DiscreteObjectKeyFrame KeyTime="0:0:0.2" Value="{x:Static Visibility.Collapsed}"/>
        </ObjectAnimationUsingKeyFrames>
        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="Canvas3">
            <DiscreteObjectKeyFrame KeyTime="0:0:0.2" Value="{x:Static Visibility.Visible}"/>
            <DiscreteObjectKeyFrame KeyTime="0:0:0.3" Value="{x:Static Visibility.Collapsed}"/>
        </ObjectAnimationUsingKeyFrames>

    </Storyboard>
</Window.Resources>