Анимация открытия CommandBar

287
24 июля 2017, 12:07

Нужна помощь с CommandBar.

Создал две анимации: одна при открытии CommandBar, другая при закрытии. Суть анимации:

  • при открытии свойство BackgroundOpacity с помощью DoubleAnimation меняется с 1 до 0.3.

  • при закрытии свойство возвращается в состояние 1.

Xaml код (писал также в C#, но тоже самое):

<UserControl.Resources>
        <Storyboard x:Name="opacityOpenChangeStoryboard">
            <DoubleAnimation From="1" To="0.3" Duration="0:0:1"
                             Storyboard.TargetName="CommandBar"  Storyboard.TargetProperty="Background.Opacity"/>
        </Storyboard>
        <Storyboard x:Name="opacityCloseChangeStoryboard">
            <DoubleAnimation From="0.3" To="1" Duration="0:0:1"
                             Storyboard.TargetName="CommandBar" Storyboard.TargetProperty="Background.Opacity"/>
        </Storyboard>
    </UserControl.Resources>

При открытии вызывается событие Openning, при закрытии Closing. Проблема в том, что анимация при открытии не воспроизводится, но при закрытии все работает хорошо. С помощью отладчика проверял вызывается ли код - да, код вызывается, но не пашет анимация открытия.

Описал все как мог, надеюсь на помощь.

Answer 1

Разобрался, необходимо было использовать не DoubleAnimation и свойство Opacity, а ColorAnimation и изменять цвет Background.

Вот код:

<Storyboard x:Name="fadeOn">
    <ColorAnimation Storyboard.TargetName="CommandBar"
                    Storyboard.TargetProperty="(CommandBar.Background).(SolidColorBrush.Color)"
                    To="#7F2D2D30"
                    Duration="0:0:1"/>
</Storyboard>
<Storyboard x:Name="fadeOff">
    <ColorAnimation Storyboard.TargetName="CommandBar"
                    Storyboard.TargetProperty="(CommandBar.Background).(SolidColorBrush.Color)"
                    To="#FF2D2D30"
                    Duration="0:0:1"/>
</Storyboard>

Как и писал выше в событии используется fadeOn.Begin() и fadeOff.Begin()

private void CommandBar_Opening(object sender, object e)
{
    fadeOn.Begin();
}
private void CommandBar_Closing(object sender, object e)
{
    fadeOff.Begin()
}
READ ALSO
Анимация фона у AppBarButton

Анимация фона у AppBarButton

Создал шаблон для AppBarButton и хочу сделать так, чтобы при наведении на AppBarButton ее фон плавно менялся

307
React-router: the context `router.history` is marked as required in `Route`

React-router: the context `router.history` is marked as required in `Route`

Наткнулся на эту проблему, никак не могу разобратьсяНачнем с package

366
Как перезагрузить блок с интервалом?

Как перезагрузить блок с интервалом?

Сейчас по клику на ссылку a перезагружается информация в блоке с id="online-comm"

368
Как упростить массив?

Как упростить массив?

Если правильно понял вопрос:

229