ElasticEase Classe

Definição

public ref class ElasticEase sealed : EasingFunctionBase

/// [Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.UI.Xaml.WinUIContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class ElasticEase final : EasingFunctionBase

[Windows.Foundation.Metadata.Activatable(65536, "Microsoft.UI.Xaml.WinUIContract")]
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.UI.Xaml.WinUIContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public sealed class ElasticEase : EasingFunctionBase

Public NotInheritable Class ElasticEase
Inherits EasingFunctionBase

<ElasticEase .../>

Herança

Object Platform::Object IInspectable DependencyObject EasingFunctionBase ElasticEase

Atributos

ActivatableAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute

Exemplos

Este exemplo XAML aplica uma função de easing ElasticEase a uma DoubleAnimation para criar uma animação que se assemelha a uma mola oscilando para frente e para trás até que ela se retome.

<StackPanel x:Name="LayoutRoot" >
    <StackPanel.Resources>
        <Storyboard x:Name="myStoryboard">
            <DoubleAnimation From="1" To="6" Duration="00:00:3" 
                Storyboard.TargetName="rectScaleTransform" 
                Storyboard.TargetProperty="ScaleY">
                <DoubleAnimation.EasingFunction>
                    
                    <!-- Elastic easing function assigned to From/To animation -->
                    <ElasticEase x:Name="myElasticEase" Oscillations="3" 
                     Springiness="1" EasingMode="EaseOut"/>
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
    </StackPanel.Resources>

    <Rectangle PointerPressed="Pointer_Clicked" 
     Fill="Blue" Width="200" Height="30">
        <Rectangle.RenderTransform>
            <ScaleTransform x:Name="rectScaleTransform" />
        </Rectangle.RenderTransform>
    </Rectangle>

</StackPanel>

// When the user clicks the rectangle, the animation
// begins. 
private void Pointer_Clicked(object sender, PointerRoutedEventArgs e)
{
    myStoryboard.Begin();
}

Comentários

ElasticEase é uma das duas funções de easing que podem produzir um valor fora do intervalo normal De/Para . (O outro é BackEase.) À medida que a função easing começa, o valor oscila positivo e negativo em torno do valor De até atingir uma amplitude positiva eventual que é o valor To . A propriedade Springiness modifica o caractere sinusoidal dessa oscilação. Com Springiness de 0, a oscilação é basicamente sinusoidal e se assemelha a um diagrama típico do movimento de uma mola. Com valores springiness maiores, é como amortecer o movimento da primavera.

A propriedade Oscilações declara quantas vezes a função oscila e cruza em valores que estão realmente abaixo do valor inicial de From .

Você pode obter os melhores resultados apenas experimentando as propriedades Springiness, Oscillations e EasingMode até que a animação esteja fazendo visualmente o que você deseja para seu cenário de valor de propriedade animado.

BounceEase é uma função de easing semelhante que funciona bem para a emulação física em animações. A diferença com ElasticEase é que um BounceEase nunca sairá do intervalo De/Para . Outra maneira de conceituar as duas funções de easing é que ElasticEase é o que você pode usar para animar a arrancada de uma cadeia de caracteres, enquanto BounceEase é o que você pode usar para mostrar o salto de uma bola contra uma linha ou plano.

Uma função de easing pode ser aplicada às propriedades EasingFunction de animações From/To/By ou às propriedades EasingFunction de tipos de quadro-chave usados para as variantes easing de animações de quadro-chave. Para obter mais informações, consulte animações de quadro-chave e animações de função de easing.

Confira também

• PowerEase
• BackEase
• BounceEase
• CircleEase
• CubicEase
• ExponentialEase
• QuadraticEase
• QuarticEase
• QuinticEase
• SineEase
• animações animadas a partir de storyboards
• Animações de quadro-chave e animações de função de easing