Wyświetl animację

Wypróbuj metodę Compose

Jetpack Compose to zalecany zestaw narzędzi interfejsu na Androida. Dowiedz się, jak używać animacji w Compose.

Animowanie właściwości →

Za pomocą systemu animacji widoków możesz wykonywać animacje pośrednie na widokach. Animacja pośrednia oblicza animację na podstawie informacji takich jak punkt początkowy, punkt końcowy, rozmiar, obrót i inne typowe aspekty animacji.

Animacja typu tween może wykonywać serię prostych przekształceń (pozycji, rozmiaru, obrotu i przezroczystości) na zawartości obiektu View. Jeśli masz TextView obiekt, możesz przesuwać, obracać, powiększać i zmniejszać tekst. Jeśli ma obraz tła, zostanie on przekształcony wraz z tekstem. Symbol animation package zawiera wszystkie klasy użyte w animacji przejścia.

Animacja pośrednia jest definiowana przez sekwencję instrukcji animacji, które są określone w kodzie XML lub kodzie Androida. Podobnie jak w przypadku definiowania układu zalecamy użycie pliku XML, ponieważ jest on bardziej czytelny, wielokrotnego użytku i łatwiejszy do zamiany niż zakodowana na stałe animacja. W przykładzie poniżej używamy kodu XML. (Więcej informacji o definiowaniu animacji w kodzie aplikacji zamiast w XML znajdziesz w AnimationSetklasieAnimation i innych podklasach).

Instrukcje animacji określają, jakie przekształcenia mają nastąpić, kiedy mają nastąpić i jak długo ma trwać ich zastosowanie. Przekształcenia mogą być sekwencyjne lub równoczesne – na przykład możesz sprawić, że zawartość elementu TextView będzie przesuwać się od lewej do prawej, a następnie obracać o 180 stopni, lub możesz sprawić, że tekst będzie przesuwać się i obracać jednocześnie. Każde przekształcenie wymaga zestawu parametrów specyficznych dla tego przekształcenia (rozmiar początkowy i końcowy w przypadku zmiany rozmiaru, kąt początkowy i końcowy w przypadku obrotu itp.) oraz zestawu parametrów wspólnych (np. czas rozpoczęcia i czas trwania). Aby kilka przekształceń odbyło się jednocześnie, ustaw dla nich ten sam czas rozpoczęcia. Aby przekształcenia były wykonywane po kolei, oblicz czas rozpoczęcia, dodając do niego czas trwania poprzedniego przekształcenia.

Plik XML animacji należy umieścić w katalogu res/anim/ projektu na Androida. Plik musi mieć jeden element główny: może to być pojedynczy element <alpha>, <scale>, <translate>, <rotate>, interpolator lub element <set>, który zawiera grupy tych elementów (mogące obejmować kolejny element <set>). Domyślnie wszystkie instrukcje animacji są stosowane jednocześnie. Aby zdarzenia występowały po kolei, musisz określić atrybut startOffset, jak pokazano w przykładzie poniżej.

Poniższy kod XML z jednej z aplikacji ApiDemos służy do rozciągania, a następnie jednoczesnego obracania obiektu View.

<set android:shareInterpolator="false">
    <scale
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromXScale="1.0"
        android:toXScale="1.4"
        android:fromYScale="1.0"
        android:toYScale="0.6"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="false"
        android:duration="700" />
    <set android:interpolator="@android:anim/decelerate_interpolator">
        <scale
           android:fromXScale="1.4"
           android:toXScale="0.0"
           android:fromYScale="0.6"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400"
           android:fillBefore="false" />
        <rotate
           android:fromDegrees="0"
           android:toDegrees="-45"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400" />
    </set>
</set>

Współrzędne ekranu (nieużywane w tym przykładzie) to (0,0) w lewym górnym rogu, a ich wartości rosną w miarę przesuwania się w dół i w prawo.

Niektóre wartości, takie jak pivotX, można określić względem samego obiektu lub względem elementu nadrzędnego. Upewnij się, że używasz odpowiedniego formatu dla wybranej wartości („50” dla 50% względem elementu nadrzędnego lub „50%” dla 50% względem siebie).

Możesz określić, jak przekształcenie jest stosowane w czasie, przypisując mu Interpolator. Android zawiera kilka podklas klasy Interpolator, które określają różne krzywe prędkości. Na przykład AccelerateInterpolator informuje o tym, że transformacja ma się rozpocząć powoli i przyspieszać. Każdy z nich ma wartość atrybutu, którą można zastosować w XML.

Po zapisaniu tego kodu XML jako hyperspace_jump.xml w katalogu res/anim/ projektu poniższy kod będzie się do niego odwoływać i stosować go do obiektu ImageView z układu.

AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump).also { hyperspaceJumpAnimation ->
    findViewById<ImageView>(R.id.spaceshipImage).startAnimation(hyperspaceJumpAnimation)
}

ImageView spaceshipImage = (ImageView) findViewById(R.id.spaceshipImage);
Animation hyperspaceJumpAnimation = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);
spaceshipImage.startAnimation(hyperspaceJumpAnimation);

Zamiast startAnimation() możesz zdefiniować czas rozpoczęcia animacji za pomocą Animation.setStartTime(), a następnie przypisać animację do widoku za pomocą View.setAnimation().

Więcej informacji o składni XML oraz dostępnych tagach i atrybutach znajdziesz w artykule Zasoby animacji.

Uwaga: niezależnie od tego, jak animacja się porusza lub zmienia rozmiar, granice widoku, który ją zawiera, nie dostosują się automatycznie do niej. Nawet wtedy animacja będzie rysowana poza granicami widoku i nie zostanie przycięta. Jeśli jednak animacja wykracza poza granice elementu View nadrzędnego, zostanie przycięta.