Run storyboard if property mets a condition

Question

I have a TextBlock which will animate when a user saves his settings to the database.

But the problem is, the animation only has to run when the save to the database has been successful.

If the save was a success: Show text Saved successfully with white text and fade out after a few second.

If the save was a failure: Show text An error has occured with red text and do NOT fade out

Currently I have this XAML but this will always animate:

I have no idea how I can make the EventTrigger conditionally. Any help will be appreciated!

<TextBlock Text="{Binding Message, NotifyOnTargetUpdated=True}" TextAlignment="Center" Padding="5" Grid.Row="3" Grid.Column="3" VerticalAlignment="Top">
    <TextBlock.Style>
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="Foreground" Value="#FFE8E8E8"/>
            <Style.Triggers>
                <DataTrigger Binding="{Binding HasError}" Value="True">
                    <Setter Property="Foreground" Value="Red"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </TextBlock.Style>         
    <TextBlock.Triggers>
        <EventTrigger RoutedEvent="Binding.TargetUpdated">
            <BeginStoryboard>
                <Storyboard x:Name="sb">
                    <ObjectAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Visible</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <DoubleAnimation BeginTime="0:0:0.0" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0"/>
                    <DoubleAnimation BeginTime="0:0:5.0" Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="0:0:0.5"/>
                    <ObjectAnimationUsingKeyFrames BeginTime="0:0:5.5" Storyboard.TargetProperty="Visibility">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Hidden</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </TextBlock.Triggers>
</TextBlock>

If I had to do it in code:

if ("Message property has been changed" && HasError == false)
    The save was a succes!
else if ("Message property has been changed" && HasError == true)
    The save was a failure!

http://stackoverflow.com/a/2823333/352101 – Bolu Jan 22 '15 at 15:07 — Bolu, Jan 22 '15 at 15:07

score 1 · Answer 1 · answered Jan 22 '15 at 15:02

Try using a data trigger instead of an event trigger and bind to a boolean value in your view model that indicates whether the save was successful or not. Since you don't have any bindings in your storyboard a data trigger should be fine. https://msdn.microsoft.com/en-us/library/system.windows.datatrigger%28v=vs.110%29.aspx

score 0 · Accepted Answer · edited May 23 '17 at 12:20

Thanks to mnistic I got it working now, here's my final code:

<TextBlock.Style>
    <Style TargetType="{x:Type TextBlock}">
        <Setter Property="Foreground" Value="#FFE8E8E8"/>
        <Style.Triggers>
            <DataTrigger Binding="{Binding HasError}" Value="True">
                <Setter Property="Foreground" Value="Red"/>
            </DataTrigger>
            <DataTrigger Binding="{Binding HasError}" Value="False">
                <Setter Property="Foreground" Value="#FFE8E8E8"/>
                <DataTrigger.EnterActions>
                    <BeginStoryboard x:Name="sb">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames BeginTime="0:0:0" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Visible</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                            <DoubleAnimation BeginTime="0:0:0.0" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0"/>
                            <DoubleAnimation BeginTime="0:0:5.0" Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="0:0:0.5"/>
                            <ObjectAnimationUsingKeyFrames BeginTime="0:0:5.5" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Hidden</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </BeginStoryboard>
                </DataTrigger.EnterActions>
                <DataTrigger.ExitActions>
                    <RemoveStoryboard BeginStoryboardName="sb"/>
                </DataTrigger.ExitActions>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</TextBlock.Style>

Run storyboard if property mets a condition

2 Answers2