Как я могу получить обновленный интерфейс при анимации изменения цвета - PullRequest
Новая
       71

Как я могу получить обновленный интерфейс при анимации изменения цвета

2 голосов
/ 15 января 2020

Я пишу приложение UWP WinRT на C#. Я нашел очень полезный класс BitmapIcon и использую его для сетки значков на главной странице моего приложения. Класс BitmapIcon имеет Foreground bru sh, который можно использовать для переопределения цвета исходного растрового изображения, что удобно, когда что-то контролирует цвета значков отдельно от самого изображения (например, сервер диктует, что значок будет красным, чтобы показать, что это важно).

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

        ColorAnimationUsingKeyFrames colorAnimation = new ColorAnimationUsingKeyFrames();
        colorAnimation.Duration = TimeSpan.FromSeconds( 3 );
        colorAnimation.EnableDependentAnimation = true;

        IconImage.Foreground = new SolidColorBrush( iconColor ?? AppSettings.appColor );

        DiscreteColorKeyFrame key1 = new DiscreteColorKeyFrame();
        key1.Value = finishColor;
        key1.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds( 0 ) );
        colorAnimation.KeyFrames.Add( key1 );

        LinearColorKeyFrame key2 = new LinearColorKeyFrame();
        key2.Value = startColor;
        key2.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds( 3.0 ) );
        colorAnimation.KeyFrames.Add( key2 );

        colorAnimation.RepeatBehavior = RepeatBehavior.Forever;

        Storyboard.SetTargetProperty( colorAnimation, "(BitmapIcon.Foreground).Color" );
        Storyboard.SetTarget( colorAnimation, IconImage );

        // Create a storyboard to apply the animation.
        //Storyboard myStoryboard = new Storyboard();
        animationStoryboard.Children.Add( colorAnimation );
        animationStoryboard.Duration = colorAnimation.Duration;
        animationStoryboard.RepeatBehavior = colorAnimation.RepeatBehavior;
        animationStoryboard.Begin();

Кажется, это работает. Я не получаю никаких исключений, и цвета меняются. Проблема в том, что изменения не отображаются в окне. Если я изменю размер окна приложения, можно увидеть, как меняются цвета, когда я перетаскиваю край окна. Когда я останавливаюсь, они перестают показывать изменения, но изменения, кажется, все еще происходят незаметно на заднем плане. Я могу сказать, что числа меняются на заднем плане из-за скачка цветов, который происходит, когда я на мгновение прекращаю изменять размер окна.

Прошло много времени с тех пор, как я работал над C# UWP WinRT-код, и я думаю, что мне не хватает какого-то атрибута или свойства объекта Imageicon, это Foreground SolidColorBru sh или Color, связанный с SolidColorBru sh.

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

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

Ответы [ 2 ]

1 голос
/ 14 февраля 2020

Я публикую этот непроверенный ответ, потому что я считаю, что это жизнеспособный вариант и может сработать так же, как и обходной путь, который я использовал (и упомянул в качестве комментария к моему исходному сообщению) ...

Установить вверх код, чтобы оживить цвет в случае, если когда-либо работает в будущем. Затем также добавьте анимацию, чтобы изменить непрозрачность BitmapIcon между 1.0 и 0.99999, или некоторые другие подобные значения. Изменение непрозрачности должно привести к обновлению sh вида / экрана, при этом фактически не изменяя непрозрачность, достаточную для того, чтобы пользователь мог ее увидеть. Изменение цвета станет видимым из-за обновления непрозрачности.

Я не проверял это, так как мне пришлось двигаться дальше после использования обходного пути с двумя битмапиками.

1 голос
/ 15 января 2020

Как заставить пользовательский интерфейс обновляться при анимации изменения цвета

Я мог воспроизвести эту проблему, и я обсуждал с командой, это ошибка, я сообщил об этом связанная команда только сейчас. И вы также можете опубликовать это с помощью Windows приложения обратной связи.

Если я получу какую-либо информацию об этом, я буду обновлять ниже. Спасибо!

Обновление

Это не идеально, так как включает в себя 2 анимации и 2 отдельных BitmapIcons, мы можем настроить его по своему вкусу, используя только 1 анимацию и наличие изображения c за BitmapIcon. Пожалуйста, проверьте следующий код. 

<Grid>
    <BitmapIcon
        x:Name="IconImageOne"
        Foreground="Red"
        UriSource="ms-appx:///Assets/StoreLogo.png">
        <BitmapIcon.Resources>
            <Storyboard x:Name="animationStoryboard">
                <DoubleAnimation
                    AutoReverse="True"
                    RepeatBehavior="Forever"
                    Storyboard.TargetName="IconImageOne"
                    Storyboard.TargetProperty="Opacity"
                    From="1.0"
                    To="0.0"
                    Duration="0:0:3" />
                <DoubleAnimation
                    AutoReverse="True"
                    RepeatBehavior="Forever"
                    Storyboard.TargetName="IconImageTwo"
                    Storyboard.TargetProperty="Opacity"
                    From="0.0"
                    To="1.0"
                    Duration="0:0:3" />
            </Storyboard>
        </BitmapIcon.Resources>
    </BitmapIcon>

    <BitmapIcon
        x:Name="IconImageTwo"
        Foreground="Green"
        Tapped="IconImage_Tapped"
        UriSource="ms-appx:///Assets/StoreLogo.png" />
</Grid>

Код позади 

private void StatAnimation()
{

    animationStoryboard.Begin();
}

private void IconImage_Tapped(object sender, TappedRoutedEventArgs e)
{
    StatAnimation();
}
...