Как отобразить мигающее наложение во время выполнения и снова отключить его, что контролируется свойствами модели представления?

Question

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

Простая часть состоит в том, чтобысоздайте оверлей и создайте раскадровку для анимации:

<Window.Resources>
    <Style x:Key="ds_NotificationStyle" TargetType="DockPanel">
        <Setter Property="Opacity" Value="0" />
        <Style.Triggers>
            <DataTrigger Binding="{Binding EnableNotification}" Value="True">
                <DataTrigger.EnterActions>
                    <BeginStoryboard Name="ds_BeginCallNotification">
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0.2" />
                            <DoubleAnimation Storyboard.TargetProperty="Opacity" From="1" To="0.4" Duration="0:0:0.4" AutoReverse="True" RepeatBehavior="Forever" />
                        </Storyboard>
                    </BeginStoryboard>
                </DataTrigger.EnterActions>
                <DataTrigger.ExitActions>
                    <StopStoryboard BeginStoryboardName="ds_BeginCallNotification" />
                </DataTrigger.ExitActions>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</Window.Resources>

Далее в XAML, элементы оверлея (есть сетка, заполненная другими элементами, и над ними помещается следующая DockPanel):

<DockPanel Grid.RowSpan="2" Name="ds_NotificationPanel" Style="{StaticResource ds_NotificationStyle}" Panel.ZIndex="200" Background="AntiqueWhite" Height="100" VerticalAlignment="top">
    <Viewbox>
        <TextBlock Text="{Binding IncomingCallNotification}" Margin="5" Foreground="Brown" FontWeight="Bold" />
    </Viewbox>
</DockPanel>

Но теперь существует проблема с оверлеем, блокирующим все элементы управления под ним.

Чтобы решить эту проблему, видимость DockPanel должна быть установлена ​​наCollapsed.Но как настроить эту видимость до и после анимации?

Answer 1

Переключите видимость в начале, используя анимацию, которая нацелена на ноль времени выполнения раскадровки:

<ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="Visibility">
    <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
</ObjectAnimationUsingKeyFrames>

Но в том же месте я понятия не имел, как сбросить видимость обратно на Collapsed.

Использование другого Storyboard, запускаемого при триггере ExitActions, решило эту проблему:

<ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="Visibility">
    <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Collapsed}" />
</ObjectAnimationUsingKeyFrames>

Вот полное решение (элементы DockPanel не изменены):

<Window.Resources>
    <Style x:Key="ds_NotificationStyle" TargetType="DockPanel">
        <Setter Property="Opacity" Value="0" />
        <Setter Property="Visibility" Value="Collapsed" />
        <Style.Triggers>
            <DataTrigger Binding="{Binding EnableNotification}" Value="True">
                <DataTrigger.EnterActions>
                    <BeginStoryboard Name="ds_BeginCallNotification">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0.2" />
                            <DoubleAnimation Storyboard.TargetProperty="Opacity" From="1" To="0.4" Duration="0:0:0.4" AutoReverse="True" RepeatBehavior="Forever" />
                        </Storyboard>
                    </BeginStoryboard>
                </DataTrigger.EnterActions>
                <DataTrigger.ExitActions>
                    <StopStoryboard BeginStoryboardName="ds_BeginCallNotification" />
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="00:00:00.2" />
                            <ObjectAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Collapsed}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </BeginStoryboard>
                </DataTrigger.ExitActions>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</Window.Resources>

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