Udostępnij za pośrednictwem

Funkcje easing

  • Artykuł

Interfejs użytkownika aplikacji wieloplatformowej platformy .NET (.NET MAUI) zawiera klasę Easing , która umożliwia określenie funkcji transferu, która kontroluje szybkość lub spowolnienie animacji podczas ich uruchamiania.

Klasa Easing definiuje szereg funkcji złagodzenia, które mogą być używane przez animacje:

  • Funkcja BounceIn złagodzenia odbija animację na początku.
  • Funkcja BounceOut złagodzenia odbija animację na końcu.
  • Funkcja CubicIn złagodzenia powoli przyspiesza animację.
  • Funkcja CubicInOut złagodzenia przyspiesza animację na początku i zwalnia animację na końcu.
  • Funkcja CubicOut złagodzenia szybko zwalnia animację.
  • Funkcja Linear złagodzenia używa stałej prędkości i jest domyślną funkcją złagodzenia.
  • Funkcja SinIn złagodzenia płynnie przyspiesza animację.
  • Funkcja SinInOut złagodzenia płynnie przyspiesza animację na początku i płynnie zwalnia animację na końcu.
  • Funkcja SinOut złagodzenia płynnie zwalnia animację.
  • Funkcja złagodzenia powoduje, że animacja SpringIn bardzo szybko przyspiesza w kierunku końca.
  • Funkcja złagodzenia powoduje, że animacja SpringOut szybko zwalnia się na końcu.

Sufiksy In i Out wskazują, czy efekt zapewniany przez funkcję złagodzenia jest zauważalny na początku animacji, na końcu lub na obu.

Ponadto można tworzyć niestandardowe funkcje luzowania. Aby uzyskać więcej informacji, zobacz Niestandardowe funkcje easing.

Korzystanie z funkcji złagodzenia

Metody rozszerzenia animacji w ViewExtensions klasie umożliwiają określenie funkcji złagodzenia jako końcowy argument metody:

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);

Określając funkcję złagodzenia animacji, szybkość animacji staje się nieliniowa i daje efekt zapewniany przez funkcję złagodzenia. Pominięcie funkcji złagodzenia podczas tworzenia animacji powoduje, że animacja używa domyślnej Linear funkcji złagodzenia, która generuje szybkość liniową.

Aby uzyskać więcej informacji na temat używania metod rozszerzenia animacji w ViewExtensions klasie, zobacz Animacja podstawowa. Funkcje easing mogą być również używane przez klasę Animation . Aby uzyskać więcej informacji, zobacz Animacja niestandardowa.

Niestandardowe funkcje luzowania

Istnieją trzy główne podejścia do tworzenia niestandardowej funkcji złagodzenia:

  1. Utwórz metodę double , która przyjmuje argument i zwraca double wynik.
  2. Utwórz element Func<double, double>.
  3. Określ funkcję easing jako argument konstruktora Easing .

We wszystkich trzech przypadkach niestandardowa funkcja luzowania powinna zwrócić wartość z zakresu od 0 do 1.

Niestandardowa metoda luzowania

Niestandardową funkcję złagodzenia można zdefiniować jako metodę double , która przyjmuje argument i zwraca double wynik:

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

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

W tym przykładzie CustomEase metoda obcina wartość przychodzącą do wartości 0, 0.2, 0.4, 0.6, 0.8 i 1. W związku z tym Image wystąpienie jest tłumaczone w dyskretnych skokach, a nie płynnie.

Niestandardowy interfejs func

Funkcję luzowania niestandardowego można również zdefiniować jako :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);

W tym przykładzie CustomEaseFunc reprezentuje funkcję złagodzenia, która zaczyna się szybko, spowalnia i odwraca kurs, a następnie odwraca kurs ponownie, aby szybko przyspieszyć w kierunku końca. W związku z tym, podczas gdy ogólny ruch Image wystąpienia jest w dół, również tymczasowo odwraca kurs w połowie animacji.

Niestandardowy konstruktor easing

Funkcję luzowania niestandardowego można również zdefiniować jako argument konstruktora Easing :

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

W tym przykładzie niestandardowa funkcja luzowania jest określana jako argument Easing funkcji lambda konstruktora i używa Math.Cos metody do utworzenia wolnego efektu upuszczania, który jest tłumiony przez metodę Math.Exp . W związku z tym wystąpienie jest tłumaczone tak, aby wydawało się, Image że upuszcza się na ostateczną pozycję.