Можно ли применить ColorAnimationUsingKeyFrames к DropShadowPanel?

Question

Я использую UWP и пытаюсь применить цветную анимацию с помощью ключевых кадров к DropShadowPanel из UWP Community Toolkit.

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

Я также применил Color Animation к Polygon Shape на моем Canvas, и он отлично работал, я использую почти тот же код, может кто-нибудь подсказать, пожалуйста:

Это код из моего многоугольника, он работает:

<ColorAnimationUsingKeyFrames Storyboard.TargetName="ChristmasStarUpperPosition"
                                                      Storyboard.TargetProperty="(Polygon.Fill).(SolidColorBrush.Color)"
                                                      RepeatBehavior="Forever"
                                                      AutoReverse="True">
                            <LinearColorKeyFrame Value="Silver" KeyTime="0:0:5"/>
                            <LinearColorKeyFrame Value="LightGray" KeyTime="0:0:2"/>
                            <SplineColorKeyFrame Value="Gray" KeyTime="0:0:2.5" KeySpline="0.6,0.0 0.9,0.00"/>
                            <DiscreteColorKeyFrame Value="Blue" KeyTime="0:0:3"/>
                            <LinearColorKeyFrame Value="Blue" KeyTime="0:0:5"/>
                            <LinearColorKeyFrame Value="LightBlue" KeyTime="0:0:2"/>
                            <SplineColorKeyFrame Value="DeepSkyBlue" KeyTime="0:0:2.5" KeySpline="0.6,0.0 0.9,0.00"/>
                            <DiscreteColorKeyFrame Value="Goldenrod" KeyTime="0:0:3"/>
                            <LinearColorKeyFrame Value="Goldenrod" KeyTime="0:0:5"/>
                        </ColorAnimationUsingKeyFrames>

и это код, который я пытаюсь применить к моей DropShadowPanel, этот код приводит к сбою программы mas на уровне xaml.

<ColorAnimationUsingKeyFrames Storyboard.TargetName="ChristmasBonusStarUpperDropShadowPolygonColor"
                                                      Storyboard.TargetProperty="(DropShadowPanel.Color).(SolidColorBrush.Color)"
                                                      RepeatBehavior="Forever"
                                                      AutoReverse="True">
                            <LinearColorKeyFrame Value="Silver" KeyTime="0:0:5"/>
                            <LinearColorKeyFrame Value="LightGray" KeyTime="0:0:2"/>
                            <SplineColorKeyFrame Value="Gray" KeyTime="0:0:2.5" KeySpline="0.6,0.0 0.9,0.00"/>
                            <DiscreteColorKeyFrame Value="Blue" KeyTime="0:0:3"/>
                            <LinearColorKeyFrame Value="Blue" KeyTime="0:0:5"/>
                            <LinearColorKeyFrame Value="LightBlue" KeyTime="0:0:2"/>
                            <SplineColorKeyFrame Value="DeepSkyBlue" KeyTime="0:0:2.5" KeySpline="0.6,0.0 0.9,0.00"/>
                            <DiscreteColorKeyFrame Value="Goldenrod" KeyTime="0:0:3"/>
                            <LinearColorKeyFrame Value="Goldenrod" KeyTime="0:0:5"/>
                        </ColorAnimationUsingKeyFrames>

надеюсь, кто-нибудь может мне помочь!!!

Спасибо!!!

Answer 1

Хотя Color свойство является свойством зависимости, оно просто действует как прокси, который обновляет Color внутреннего DropShadow (см. код ниже), который исходит от Windows.UI.Composition, Традиционная раскадровка XAML просто не будет работать.

private void OnColorChanged(Color newValue)
{
    if (_dropShadow != null)
    {
        _dropShadow.Color = newValue;
    }
}

Но то, что вы хотите, может быть легко достигнуто с помощью нового API цветной анимации (т.е. CreateColorKeyFrameAnimation) из композиции. Вот пример для вашего конкретного случая:

var compositor = Window.Current.Compositor;
var easeIn = compositor.CreateCubicBezierEasingFunction(new Vector2(0.6f, 0.0f), new Vector2(0.9f, 0.0f));
var linear = compositor.CreateLinearEasingFunction();

var colorAnimation = compositor.CreateColorKeyFrameAnimation();
// 0.0f means at 0% of the total duration of 5s, 0.2f means 20%, etc.
colorAnimation.InsertKeyFrame(0.0f, Colors.Red, linear);
colorAnimation.InsertKeyFrame(0.2f, Colors.DarkOrange, easeIn);
colorAnimation.InsertKeyFrame(0.4f, Colors.Green, linear);
colorAnimation.InsertKeyFrame(0.6f, Colors.Purple, easeIn);
colorAnimation.InsertKeyFrame(0.8f, Colors.DarkSlateGray, linear);
colorAnimation.InsertKeyFrame(1.0f, Colors.Black, linear);
colorAnimation.Duration = TimeSpan.FromSeconds(5);
colorAnimation.IterationBehavior = AnimationIterationBehavior.Forever;

// Note the control exposes the inner DropShadow property, and this is the property we want to animate
ChristmasBonusStarUpperDropShadowPolygon.DropShadow.StartAnimation("Color", colorAnimation);

Answer 2

Эрно де Вирд ответил, что его код работает, но я хотел бы дополнить этот вопрос моим ответом на первый вопрос. Ответ Эрно работает, если применить, как он показал. Вы также можете вызвать псевдоним, так как DropShadowPanel является сторонним элементом управления и принадлежит другому пространству имен, которое обязательно должно вызывать правильное пространство имен на вашей странице или пользовательский контроль, например так:

<UserControl
x:Class="Ceneam.UserControlViews.ChristmasBonusCalculatorControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vm="using:Ceneam.ViewModels"
xmlns:toolkitscontrols="using:Microsoft.Toolkit.Uwp.UI.Controls"
...>

затем вы можете заставить код работать, или лучше сказать, что не нарушать ваш xaml или вашу программу, вы должны использовать надлежащие ColorAnimationUsingKeyFrames, как это, для любого свойства элемента управления DropShadowPanel, например так:

<ColorAnimationUsingKeyFrames Storyboard.TargetName="ChristmasBonusStarUpperDropShadowPolygon"
                                                      Storyboard.TargetProperty="toolkitscontrols:DropShadowPanel.Color"
                                                      RepeatBehavior="Forever"
                                                      AutoReverse="True">
                            <LinearColorKeyFrame Value="Red" KeyTime="0:0:5"/>
                            <LinearColorKeyFrame Value="DarkGreen" KeyTime="0:0:2"/>
                            <SplineColorKeyFrame Value="DarkOrange" KeyTime="0:0:2.5" KeySpline="0.6,0.0 0.9,0.00"/>
                            <DiscreteColorKeyFrame Value="DarkRed" KeyTime="0:0:3"/>
                            <LinearColorKeyFrame Value="Green" KeyTime="0:0:5"/>
                            <LinearColorKeyFrame Value="Crimson" KeyTime="0:0:2"/>
                            <SplineColorKeyFrame Value="Purple" KeyTime="0:0:2.5" KeySpline="0.6,0.0 0.9,0.00"/>
                            <DiscreteColorKeyFrame Value="DarkSlateGray" KeyTime="0:0:3"/>
                            <LinearColorKeyFrame Value="Black" KeyTime="0:0:5"/>
                        </ColorAnimationUsingKeyFrames>

как вы можете видеть, этот код не нарушит ваш xaml, однако анимация не будет применяться к вашему элементу управления, просто не нарушит его, но, как я повторил, анимация не будет работать на вашем элементе управления.

Я уже сообщал об этой проблеме в проект UWP Community Toolkit на GitHub, потому что я считаю, что это ошибка, потому что BlurRadius и ShadowOpacity никогда не меняются, если пытаются применить DoubleAnimation или DoubleAnimationUsingKeyFrames.

Так что прямо сейчас, отвечая на мой собственный вопрос, невозможно применить ColorAnimationUsingKeyFrames к DropShadowPanel, вы можете сделать так, чтобы код НЕ ПРЕРЫВАЛ ВАШ XAML, но ЭТО НЕ БУДЕТ ПРИМЕНЯТЬСЯ к вашему УПРАВЛЕНИЮ!!!!