Triggers de animações

Uma das coisas que se tornou muito mais fácil com o WPF, em comparação com frameworks anteriores como o WinForms, é a animação. Os acionadores têm suporte direto para usar animações em resposta ao disparo acionado, em vez de apenas alternar entre dois valores estáticos.

Para isso, usamos as propriedades EnterActions e ExitActions , que estão presentes em todos os tipos de acionadores já discutidos (exceto o EventTrigger), tanto únicos quanto múltiplos. Aqui está um exemplo:

<Window x:Class="WpfTutorialSamples.Styles.StyleTriggerEnterExitActions"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="StyleTriggerEnterExitActions" Height="200" Width="200" UseLayoutRounding="True">
    <Grid>
        <Border Background="LightGreen" Width="100" Height="100" BorderBrush="Green">
            <Border.Style>
                <Style TargetType="Border">
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Trigger.EnterActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <ThicknessAnimation Duration="0:0:0.400" To="3" Storyboard.TargetProperty="BorderThickness" />
                                        <DoubleAnimation Duration="0:0:0.300" To="125" Storyboard.TargetProperty="Height" />
                                        <DoubleAnimation Duration="0:0:0.300" To="125" Storyboard.TargetProperty="Width" />
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.EnterActions>
                            <Trigger.ExitActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <ThicknessAnimation Duration="0:0:0.250" To="0" Storyboard.TargetProperty="BorderThickness" />
                                        <DoubleAnimation Duration="0:0:0.150" To="100" Storyboard.TargetProperty="Height" />
                                        <DoubleAnimation Duration="0:0:0.150" To="100" Storyboard.TargetProperty="Width" />
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.ExitActions>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </Border.Style>
        </Border>
    </Grid>
</Window>

Neste exemplo, temos um quadrado verde. Ele tem um gatilho que dispara quando o mouse termina, e nesse caso ele dispara várias animações, todas definidas na parte EnterActions do gatilho. Lá, nós animamos a espessura da borda do seu padrão 0 para uma espessura de 3, e então animamos a largura e a altura de 100 para 125. Isso tudo acontece simultaneamente, porque eles são parte do mesmo StoryBoard , e até mesmo em velocidades ligeiramente diferentes, já que temos controle total de quanto tempo cada animação deve ser executada.

Usamos o ExitActions para reverter as alterações feitas, com animações que retornam aos valores padrão. Nós executamos as animações de reversão um pouco mais rápido, porque podemos e porque parece legal.

Os dois estados são representados nas duas capturas de tela, mas para apreciar completamente o efeito, você deve tentar executar o exemplo em sua própria máquina, usando o código-fonte acima.

Resumo

Usar animações com gatilhos de estilo é muito fácil, e embora ainda não tenhamos explorado tudo o que você pode fazer com as animações WPF, o exemplo usado acima deve dar uma idéia de quão flexíveis são as animações e os estilos.