Funzioni di facilitazione

L'interfaccia utente dell'app multipiattaforma .NET (.NET MAUI) include una Easing classe che consente di specificare una funzione di trasferimento che controlla la velocità o il rallentamento delle animazioni durante l'esecuzione.

La Easing classe definisce una serie di funzioni di facilitazione utilizzabili dalle animazioni.

• La BounceIn funzione di easing fa rimbalzare l'animazione all'inizio.
• La BounceOut funzione di interpolazione fa rimbalzare l'animazione alla fine.
• La funzione di attenuazione CubicIn accelera lentamente l'animazione.
• La CubicInOut funzione di easing accelera l'animazione all'inizio e decelera l'animazione alla fine.
• La CubicOut funzione di easing rallenta rapidamente l'animazione.
• La Linear funzione di interpolazione usa una velocità costante ed è la funzione di interpolazione predefinita.
• La SinIn funzione di interpolazione accelera senza problemi l'animazione.
• La SinInOut funzione di interpolazione accelera senza problemi l'animazione all'inizio e rallenta senza problemi l'animazione alla fine.
• La funzione di easing SinOut decelera l'animazione in modo fluido.
• La SpringIn funzione di interpolazione fa sì che l'animazione accelera molto rapidamente verso la fine.
• La SpringOut funzione di interpolazione fa sì che l'animazione decelera rapidamente verso la fine.

I suffissi In e Out indicano se l'effetto fornito dalla funzione di interpolazione è evidente all'inizio dell'animazione, alla fine o entrambi.

È anche possibile creare funzioni di easing personalizzate. Per altre informazioni, vedere Funzioni di interpolazione personalizzate.

Utilizzare una funzione di easing

I metodi di estensione dell'animazione nella ViewExtensions classe consentono di specificare una funzione di interpolazione come argomento del metodo finale:

await image.TranslateTo(0, 200, 2000, Easing.BounceIn);
await image.ScaleTo(2, 2000, Easing.CubicIn);
await image.RotateTo(360, 2000, Easing.SinInOut);
await image.ScaleTo(1, 2000, Easing.CubicOut);
await image.TranslateTo(0, -200, 2000, Easing.BounceOut);

Specificando una funzione di interpolazione per un'animazione, la velocità di animazione diventa non lineare e produce l'effetto fornito dalla funzione di interpolazione. Omettendo una funzione di interpolazione durante la creazione di un'animazione, l'animazione usa la funzione di interpolazione predefinita Linear , che produce una velocità lineare.

Per altre informazioni sull'uso dei metodi di estensione dell'animazione nella ViewExtensions classe , vedi Animazione di base. Le funzioni di interpolazione possono essere utilizzate anche dalla Animation classe . Per altre informazioni, vedere Animazione personalizzata.

Funzioni di easing personalizzate

Esistono tre approcci principali per creare una funzione di easing personalizzata.

1. Creare un metodo che accetta un double argomento e restituisce un double risultato.
2. Creare un oggetto Func<double, double>.
3. Specificare la funzione di interpolazione come argomento per il Easing costruttore.

In tutti e tre i casi, la funzione di interpolazione personalizzata deve restituire un valore compreso tra 0 e 1.

Metodo di easing personalizzato

Una funzione di interpolazione personalizzata può essere definita come metodo che accetta un double argomento e restituisce un double risultato:

double CustomEase (double t)
{
  return t == 0 || t == 1 ? t : (int)(5 * t) / 5.0;
}

await image.TranslateTo(0, 200, 2000, (Easing)CustomEase);

In questo esempio, il CustomEase metodo tronca il valore in ingresso ai valori 0, 0.2, 0.4, 0.6, 0.8 e 1. Pertanto, l'istanza Image viene tradotta in salti discreti, anziché in modo fluido.

Funzione di facilitazione personalizzata

Una funzione di interpolazione personalizzata può anche essere definita come:Func<double, double>

Func<double, double> CustomEaseFunc = t => 9 * t * t * t - 13.5 * t * t + 5.5 * t;
await image.TranslateTo(0, 200, 2000, CustomEaseFunc);

In questo esempio, CustomEaseFunc rappresenta una funzione di easing che inizia rapidamente, rallenta e inverte il corso, quindi inverte di nuovo il corso per accelerare rapidamente verso la fine. Pertanto, mentre il movimento complessivo dell'istanza Image è verso il basso, anche temporaneamente inverte il corso a metà dell'animazione.

Costruttore di easing personalizzato

Una funzione di interpolazione personalizzata può essere definita anche come argomento per il Easing costruttore:

await image.TranslateTo(0, 200, 2000, new Easing (t => 1 - Math.Cos (10 * Math.PI * t) * Math.Exp (-5 * t)));

In questo esempio, la funzione di interpolazione personalizzata è specificata come funzione lambda per il costruttore Easing e utilizza il metodo Math.Cos per creare un effetto di rilascio lento, che viene smorzato dal metodo Math.Exp. Di conseguenza, l'istanza Image viene tradotta in modo che sembri scendere alla sua posizione finale.