CODEWITHSUNDEEP
wpfanimationtriggerslabel
Manel
Manel

Reputation: 151

WPF: How to apply a simple animation to a Label?

I have a label with an image inside. I'd like to apply a simple animation: changing the opacity property for achieving a fade-in effect after the label is loaded (or when is visible or whatever)

But this doesn't work:

<Label ContentTemplate="{DynamicResource ImageLabelDataTemplate}"  Canvas.Left="36" Canvas.Top="394" Height="116" Name="PreviousVirtualButton" Width="100" Visibility="Hidden">
                <Label.Style>
                    <Style TargetType="Label">
                        <Style.Triggers>
                            <Trigger Property="IsVisible" Value="True">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard TargetProperty="Opacity">
                                            <DoubleAnimation  Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:5" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                            </Trigger>                            
                        </Style.Triggers>
                        </Style>
                </Label.Style>
            </Label>

I'd like to see how the label is fading in on the screen.

Thanks in advance.

Upvotes: 0

Views: 9923

Answers (3)

Akshay J
Akshay J

Reputation: 5468

Try this: 

<Window x:Class="WpfApplicationUnleashed.Window2"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window2" Width="200" MinWidth="200" MaxWidth="300" MaxHeight="120" MinHeight="120" Height="120">
    <Grid>
        <Label Canvas.Left="36" Content="HELLO" Canvas.Top="394" Height="116" Name="PreviousVirtualButton" Width="100">
            <Label.Style>
                <Style TargetType="Label">
                    <Style.Triggers>
                        <EventTrigger RoutedEvent="Label.Loaded">
                            <EventTrigger.Actions>
                                <BeginStoryboard>
                                    <Storyboard TargetProperty="Opacity">
                                        <DoubleAnimation  Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:5" />
                                    </Storyboard>
                                </BeginStoryboard>
                            </EventTrigger.Actions>
                        </EventTrigger>
                    </Style.Triggers>
                </Style>
            </Label.Style>
        </Label>
    </Grid>
</Window>

Upvotes: 5

MBU
MBU

Reputation: 5098

Are you setting the label visible in your code somewhere? You have to set it to be visible in order for the animation to trigger.

C# example:

previousVirtualButton.Visibility = System.Windows.Visibility.Visible;

Upvotes: 1

Andrei Pana
Andrei Pana

Reputation: 4502

If you remove the Visibility="Hidden", it will work (assuming you want it to fade in when it loads). Otherwise, set the Visibility to Visibility.Visible from code-behind when you want it to start fade in. Also, make sure that in the ContentTemplate you have something visible.

Upvotes: 1

Related Questions