Condividi tramite


Funzioni di interpolazione

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 interpolazione che possono essere utilizzate dalle animazioni:

  • La BounceIn funzione di interpolazione rimbalza l'animazione all'inizio.
  • La BounceOut funzione di interpolazione rimbalza l'animazione alla fine.
  • La CubicIn funzione di interpolazione accelera lentamente l'animazione.
  • La CubicInOut funzione di interpolazione accelera l'animazione all'inizio e decelera l'animazione alla fine.
  • La CubicOut funzione di interpolazione 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 SinOut funzione di interpolazione decelera l'animazione senza problemi.
  • 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 In suffissi e Out indicano se l'effetto fornito dalla funzione di interpolazione è evidente all'inizio dell'animazione, alla fine o a entrambi.

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

Utilizzare una funzione di interpolazione

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 interpolazione personalizzate

Esistono tre approcci principali per la creazione di una funzione di interpolazione 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 interpolazione 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 convertita in salti discreti, anziché senza problemi.

Func di interpolazione personalizzato

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, rappresenta CustomEaseFunc una funzione di interpolazione 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 interpolazione 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 viene specificata come argomento di funzione lambda per il Easing costruttore e usa il Math.Cos metodo per creare un effetto di rilascio lento che viene smorzato dal Math.Exp metodo . Di conseguenza, l'istanza Image viene convertita in modo che venga visualizzata la posizione finale.