Wyświetlanie animowanego obrazu

Możesz stworzyć bardziej interaktywną i zaangażować użytkowników w swojej aplikacji, wczytując plik drawable, aby wyświetlać animowane obrazy. Animowane obrazy są przydatne do tworzenia wskaźników ładowania, wskaźników sukcesu lub błędów, ułatwiania tworzenia gier oraz różnych innych funkcji interfejsu.

Zgodność wersji

Ta implementacja wymaga, aby minimalna wersja pakietu SDK projektu była ustawiona na poziom API 21 lub wyższy.

Zależności

Wyświetlanie animowanego obrazu

Poniższy kod wyświetla animowany wektor, który automatycznie przełącza się między 2 stanami:

@Composable
fun AnimatedVectorDrawable() {
    val image = AnimatedImageVector.animatedVectorResource(R.drawable.ic_hourglass_animated)
    var atEnd by remember { mutableStateOf(false) }
    Image(
        painter = rememberAnimatedVectorPainter(image, atEnd),
        contentDescription = "Timer",
        modifier = Modifier.clickable {
            atEnd = !atEnd
        },
        contentScale = ContentScale.Crop
    )
}
AnimationSnippets.kt

Najważniejsze informacje o kodzie

  • Ładuje zasób wektorowy, animując atrybuty rysunku w czasie.
  • Wystąpienie Image, które używa wystąpienia Painter do wykonania animacji utworzonej przez funkcję rememberAnimatedVectorPainter() z poziomu stanu AnimatedImageVector i boolean.
  • Gdy atEnd ma wartość true, instancja Painter przestaje się animować.

Wyniki

Animacja klepsydry z obracającą się zawartością
Rysunek 1. Animowany obiekt rysowany wektorowo w Compose.

Kolekcje zawierające ten przewodnik

Ten przewodnik należy do tych kolekcji krótkich przewodników, które obejmują szersze zagadnienia związane z tworzeniem aplikacji na Androida:

Poznaj techniki tworzenia jasnych i przyciągających uwagę elementów wizualnych, które nadadzą Twojej aplikacji na Androida atrakcyjny wygląd.
Kolekcja krótkich przewodników

Masz pytania lub chcesz przekazać opinię?

Otwórz stronę z najczęstszymi pytaniami i poznaj krótkie przewodniki lub skontaktuj się z nami i powiedz nam, co o tym myślisz.
Najczęstsze pytania Prześlij opinię