Einführung in Animationen

Schreiben Sie jetzt
Jetpack Compose ist das empfohlene UI-Toolkit für Android. Weitere Informationen zur Verwendung von Animationen in „Compose“

Animationen können visuelle Hinweise hinzufügen, die Nutzer darüber informieren, was in Ihrer App vor sich geht. Sie sind besonders nützlich, wenn sich der Status der Benutzeroberfläche ändert, z. B. wenn neue Inhalte geladen werden oder neue Aktionen verfügbar werden. Animationen verleihen Ihrer App außerdem einen ausgefeilten Look, was ihr ein hochwertigeres Erscheinungsbild verleiht.

Android bietet je nach gewünschter Animation verschiedene APIs für Animationen. Diese Dokumentation bietet einen Überblick über die verschiedenen Möglichkeiten zum Hinzufügen von Bewegung zu Ihrer UI.

Weitere Informationen dazu, wann Sie Animationen verwenden sollten, finden Sie im Material Design-Leitfaden zu Bewegungselementen.

Bitmaps animieren

Abbildung 1: Ein animiertes Drawable.

Verwende die Drawable-Animations-APIs, um eine Bitmapgrafik wie ein Symbol oder eine Illustration zu animieren. Normalerweise werden diese Animationen statisch mit einer Drawable-Ressource definiert. Sie können das Animationsverhalten aber auch während der Laufzeit definieren.

Eine gute Möglichkeit, dem Nutzer mitzuteilen, dass zwei Aktionen zusammenhängen, ist die Animierung einer Wiedergabeschaltfläche, die sich beim Antippen in eine Pauseschaltfläche verwandelt.

Weitere Informationen finden Sie unter Drawable-Grafiken animieren.

Sichtbarkeit und Bewegung der Benutzeroberfläche animieren

Abbildung 2: Durch eine subtile Animation beim Öffnen und Verschwinden eines Dialogfelds wird die Änderung der Benutzeroberfläche weniger unübersichtlich.

Wenn Sie die Sichtbarkeit oder Position von Ansichten in Ihrem Layout ändern müssen, sollten Sie subtile Animationen einfügen, damit der Nutzer versteht, wie sich die Benutzeroberfläche verändert.

Zum Verschieben, Einblenden oder Ausblenden von Ansichten im aktuellen Layout können Sie das im Paket android.animation bereitgestellte Eigenschaftsanimationssystem verwenden, das ab Android 3.0 (API-Level 11) verfügbar ist. Diese APIs aktualisieren die Attribute Ihrer View-Objekte über einen bestimmten Zeitraum. Dabei wird die Ansicht kontinuierlich neu gezeichnet, wenn sich die Attribute ändern. Wenn Sie beispielsweise die Positionseigenschaften ändern, wird die Ansicht über den Bildschirm verschoben. Wenn Sie die Alpha-Eigenschaft ändern, wird die Ansicht ein- oder ausgeblendet.

Am einfachsten lassen sich Animationen erstellen, wenn Sie Animationen für Ihr Layout aktivieren. Wenn Sie dann die Sichtbarkeit einer Ansicht ändern, wird automatisch eine Animation angewendet. Weitere Informationen finden Sie unter Layoutaktualisierungen automatisch animieren.

Informationen zum Erstellen von Animationen mit dem Property-Animationssystem finden Sie unter Property-Animation – Übersicht. Sie können auch die folgenden Seiten aufrufen, um gängige Animationen zu erstellen:

Physikbasierte Bewegung

Abbildung 3: Mit ObjectAnimator erstellte Animation.

Abbildung 4: Mit physikbasierten APIs erstellte Animationen

Wenn es möglich ist, sollten Sie Ihre Animationen mit realistischen physikalischen Elementen versehen, damit sie natürlich aussehen. Sie sollten beispielsweise die Dynamik beibehalten, wenn sich ihr Ziel ändert, und reibungslose Übergänge während Änderungen vornehmen.

Um diese Verhaltensweisen zu ermöglichen, enthält die Android Support Library physikbasierte Animations-APIs, die auf den Gesetzen der Physik beruhen, um das Ablauf Ihrer Animationen zu steuern.

Zwei gängige, physikbasierte Animationen sind:

Animationen, die nicht auf der Physik basieren, z. B. Animationen, die mit ObjectAnimator APIs erstellt werden, sind relativ statisch und haben eine feste Dauer. Wenn sich der Zielwert ändert, müssen Sie die Animation bei der Änderung des Zielwerts abbrechen, die Animation mit einem neuen Wert als neuen Startwert neu konfigurieren und den neuen Zielwert hinzufügen. Visuell wird durch diesen Prozess ein abrupter Stopp in der Animation und eine anschließende unverbundene Bewegung erzeugt, wie in Abbildung 3 dargestellt.

Animationen, die mit physikbasierten Animations-APIs wie DynamicAnimation erstellt werden, werden durch Kraft angetrieben. Die Änderung des Zielwerts führt zu einer Änderung der Kraft. Die neue Kraft gilt für die vorhandene Geschwindigkeit, die einen kontinuierlichen Übergang zum neuen Ziel durchführt. Dieser Prozess führt zu einer natürlicher aussehenden Animation, wie in Abbildung 4 gezeigt.

Layoutänderungen animieren

Abbildung 5: Eine Animation zur Darstellung weiterer Details kann durch Ändern des Layouts oder Starten einer neuen Aktivität erreicht werden.

Unter Android 4.4 (API-Level 19) und höher kannst du mit dem Transition-Framework Animationen erstellen, wenn du das Layout innerhalb der aktuellen Aktivität oder des aktuellen Fragments austauschst. Sie müssen lediglich das Start- und Endlayout sowie die Art der Animation angeben, die Sie verwenden möchten. Dann führt das System eine Animation zwischen den beiden Layouts aus. Sie können damit die gesamte UI austauschen oder nur bestimmte Ansichten verschieben oder ersetzen.

Wenn der Nutzer beispielsweise auf ein Element tippt, um weitere Informationen zu sehen, können Sie das Layout durch die Elementdetails ersetzen und einen Übergang wie in Abbildung 5 anwenden.

Das Start- und das Endlayout werden jeweils in einem Scene gespeichert. Die Startszene wird jedoch in der Regel automatisch anhand des aktuellen Layouts ermittelt. Sie erstellen einen Transition, um dem System mitzuteilen, welche Art von Animation Sie wünschen, und rufen dann TransitionManager.go() auf. Das System führt die Animation aus, um die Layouts auszutauschen.

Weitere Informationen finden Sie unter Layoutänderungen mit einem Übergang animieren. Beispielcode finden Sie unter BasicTransition.

Zwischen Aktivitäten animieren

Unter Android 5.0 (API-Level 21) und höher kannst du auch Animationen erstellen, die zwischen deinen Aktivitäten wechseln. Dies basiert auf demselben Übergangs-Framework, das im vorherigen Abschnitt beschrieben wurde, aber Sie können damit Animationen zwischen Layouts in separaten Aktivitäten erstellen.

Sie können einfache Animationen anwenden, z. B. indem Sie die neue Aktivität von der Seite ein- oder ausblenden, aber Sie können auch Animationen erstellen, die bei jeder Aktivität zwischen den geteilten Ansichten übergehen. Wenn der Nutzer beispielsweise auf ein Element tippt, um weitere Informationen zu sehen, können Sie zu einer neuen Aktivität mit einer Animation übergehen, die dieses Element nahtlos vergrößert, um den Bildschirm zu füllen, wie in der Animation in Abbildung 5.

Wie gewohnt rufen Sie startActivity() auf, übergeben ihm aber ein Paket von Optionen, die von ActivityOptions.makeSceneTransitionAnimation() bereitgestellt werden. Dieses Paket von Optionen kann beinhalten, welche Ansichten von den Aktivitäten gemeinsam genutzt werden, damit das Übergangs-Framework sie während der Animation verbinden kann.

Weitere Ressourcen finden Sie hier: