Анимация двух пользовательских элементов управления в одном и том же ContentControl одновременно

У меня есть эти анимации Load и Unload в App.xaml:

<Storyboard x:Key="Unload">
    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
        <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
        <EasingDoubleKeyFrame KeyTime="0:0:3" Value="-800"/>
    </DoubleAnimationUsingKeyFrames>
</Storyboard>

<Storyboard x:Key="Load">
    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)">
        <EasingDoubleKeyFrame KeyTime="0" Value="800"/>
        <EasingDoubleKeyFrame KeyTime="0:0:3" Value="0"/>
    </DoubleAnimationUsingKeyFrames>
</Storyboard>

В моем коде я вызываю те, которые касаются кнопок, следующим образом:

sb1 = FindResource("Unload") as Storyboard;
sb2 = FindResource("Load") as Storyboard;

void Button_Click(object sender, RoutedEventArgs e)
{
    uc1.RenderTransform = GetTG();
    uc2.RenderTransform = GetTG();

    sb1.Begin(uc2);
    sb2.Begin(uc1);

    content.Content = uc1;
}

//and 

void Button_Click_1(object sender, RoutedEventArgs e)
{
    uc2.RenderTransform = GetTG();
    uc1.RenderTransform = GetTG();

    sb2.Begin(uc2);
    sb1.Begin(uc1);

    content.Content = uc2;
}

GetTG возвращает TransformGroup

TransformGroup GetTG()
{
    var tg = new TransformGroup();
    tg.Children.Add(new ScaleTransform());
    tg.Children.Add(new SkewTransform());
    tg.Children.Add(new RotateTransform());
    tg.Children.Add(new TranslateTransform());
    return tg;
}

с ними работает только Load анимация. Как заставить оба работать одновременно?


wpf rendertransform
person Community    schedule 18.10.2019    source источник
comment
Если вы пытаетесь показать переходы при изменении вашего контента, то существуют различные библиотеки Transitionals WPF, которые вы можете найти в Google. Они делают код таким же простым, как установка TransitonalControl.Content, а остальная часть перехода обрабатывается элементом управления.   -  person Insane    schedule 22.10.2019

Ответы (1)


arrow_upward
0
arrow_downward

Примените анимацию к ContentControl. Это должно выдвинуть текущие Content/UserControl влево и вставить новые Content/UserControl справа:

void Button_Click(object sender, RoutedEventArgs e)
{
    UnLoadAndLoad(uc1);
}

void Button_Click_1(object sender, RoutedEventArgs e)
{
    UnLoadAndLoad(uc2);
}

void UnLoadAndLoad(object ucToBeLoaded)
{
    if (content.Content != ucToBeLoaded)
    {
        content.RenderTransform = GetTG();

        EventHandler completed = null;
        completed = (ss, ee) =>
        {
            sb1.Completed -= completed;
            content.Content = ucToBeLoaded;
            //load
            sb2.Begin(content);
        };
        sb1.Completed += completed;
        //unload

        if (content.Content != null)
            sb1.Begin(content);
        else
            completed(this, EventArgs.Empty);
    }
}
person mm8    schedule 21.10.2019
comment
в этот момент sb1.Completed += completed; я получаю эту ошибку System.InvalidOperationException: 'Specified value of type 'System.Windows.Media.Animation.Storyboard' must have IsFrozen set to false to modify.' - person ; 21.10.2019
comment
в соответствии с этим, если я добавлю x:Shared="False" в раскадровку в App.xaml, работает но не одновременно! Сначала он выгружает uc1, содержимое становится пустым (белым) после выгрузки uc1 и при пустом содержании начинается загрузка uc2 и так далее. - person ; 21.10.2019