Teilen über

Android-Grafiken und -Animationen

  • Artikel

Android bietet ein sehr reichhaltiges und vielfältiges Framework für die Unterstützung von 2D-Grafiken und Animationen. In diesem Thema werden diese Frameworks vorgestellt und erläutert, wie Sie benutzerdefinierte Grafiken und Animationen für die Verwendung in einer Xamarin.Android-Anwendung erstellen.

Übersicht

Obwohl sie auf Geräten ausgeführt werden, die traditionell eingeschränkt sind, verfügen die am höchsten bewerteten mobilen Anwendungen häufig über eine anspruchsvolle Benutzeroberfläche (User Experience) mit hochwertigen Grafiken und Animationen, die ein intuitives, reaktionsfähiges, dynamisches Verhalten bieten. Da mobile Anwendungen immer anspruchsvoller werden, haben Benutzer damit begonnen, mehr und mehr von Anwendungen zu erwarten.

Glücklicherweise verfügen moderne mobile Plattformen über sehr leistungsfähige Frameworks zum Erstellen anspruchsvoller Animationen und benutzerdefinierter Grafiken, während die Benutzerfreundlichkeit beibehalten wird. Auf diese Weise können Entwickler umfangreiche Interaktivität mit nur geringem Aufwand hinzufügen.

UI-API-Frameworks in Android können grob in zwei Kategorien unterteilt werden: Grafiken und Animationen.

Grafiken werden weiter in verschiedene Ansätze unterteilt, um 2D- und 3D-Grafiken durchzuführen. 3D-Grafiken stehen über eine Reihe integrierter Frameworks wie OpenGL ES (eine mobile spezifische Version von OpenGL) und Drittanbieterframeworks wie MonoGame (ein plattformübergreifendes Toolkit, das mit dem XNA-Toolkit kompatibel ist) zur Verfügung. Obwohl 3D-Grafiken nicht im Rahmen dieses Artikels liegen, werden wir die integrierten 2D-Zeichnungstechniken untersuchen.

Android bietet zwei verschiedene APIs zum Erstellen von 2D-Grafiken. Eine ist ein hochrangiger deklarativer Ansatz und der andere eine programmgesteuerte LOW-Level-API:

  • Drawable Resources – Diese werden verwendet, um benutzerdefinierte Grafiken entweder programmgesteuert oder (in der Regel) durch Einbetten von Zeichenanweisungen in XML-Dateien zu erstellen. Drawable resources are typically defined as XML files that contain instructions or actions for Android to render a 2D graphic.

  • Canvas – dies ist eine API auf niedriger Ebene, die das direkte Zeichnen auf einer zugrunde liegenden Bitmap umfasst. Es bietet eine sehr fein abgestimmte Kontrolle über das angezeigte Element.

Zusätzlich zu diesen 2D-Grafiktechniken bietet Android auch verschiedene Möglichkeiten zum Erstellen von Animationen:

  • Zeichnungsfähige Animationen – Android unterstützt auch Frame-nach-Frame-Animationen, die als drawable Animation bezeichnet werden. Dies ist die einfachste Animations-API. Android lädt und zeigt drawable-Ressourcen sequenziell an (ähnlich wie eine Cartoon).

  • Ansichtsanimationen – Ansichtsanimationen sind die ursprünglichen Animations-APIs in Android und sind in allen Versionen von Android verfügbar. Diese API ist eingeschränkt, da sie nur mit View-Objekten funktioniert und nur einfache Transformationen für diese Ansichten ausführen kann. Ansichtsanimationen werden in der Regel in XML-Dateien definiert, die /Resources/anim sich im Ordner befinden.

  • Eigenschaftenanimationen – Android 3.0 hat einen neuen Satz von Animations-APIs eingeführt, der als Eigenschaftsanimationen bezeichnet wird. Diese neuen APIs haben ein erweiterbares und flexibles System eingeführt, das verwendet werden kann, um die Eigenschaften eines objekts zu animieren, nicht nur View-Objekte. Mit dieser Flexibilität können Animationen in unterschiedlichen Klassen gekapselt werden, die die Codefreigabe vereinfachen.

Ansichtsanimationen eignen sich besser für Anwendungen, die die älteren Vor-Android 3.0-APIs (API-Ebene 11) unterstützen müssen. Andernfalls sollten Anwendungen die neueren Eigenschaftenanimations-APIs aus den oben Erwähnung.

Alle diese Frameworks sind lebensfähige Optionen, aber wenn möglich, sollten Eigenschaftenanimationen bevorzugt werden, da es sich um eine flexiblere API für die Arbeit mit Eigenschaftenanimationen handelt. Eigenschaftenanimationen ermöglichen, dass Animationslogik in unterschiedlichen Klassen gekapselt wird, wodurch die Codefreigabe vereinfacht und code Standard tenance vereinfacht wird.

Zugriff

Grafiken und Animationen helfen, Android-Apps attraktiv und spaßigend zu verwenden; Es ist jedoch wichtig zu beachten, dass einige Interaktionen über Bildschirmleseprogramme, alternative Eingabegeräte oder mit unterstütztem Zoom erfolgen. Außerdem können einige Interaktionen ohne Audiofunktionen auftreten.

Apps können in diesen Situationen besser verwendet werden, wenn sie mit Barrierefreiheit entworfen wurden: Bereitstellen von Hinweisen und Navigationsunterstützung auf der Benutzeroberfläche und sicherstellen, dass Textinhalte oder Beschreibungen für Bildelemente der Benutzeroberfläche vorhanden sind.

Weitere Informationen zur Nutzung der Barrierefreiheits-APIs für Android finden Sie im Google-Leitfaden zur Barrierefreiheit.

2D Graphics

Drawable Resources sind eine beliebte Technik in Android-Anwendungen. Wie bei anderen Ressourcen sind Drawable Resources deklarativ – sie werden in XML-Dateien definiert. Dieser Ansatz ermöglicht eine sauber Trennung von Code von Ressourcen. Dies kann die Entwicklung und Standard Zusätzlichkeit vereinfachen, da es nicht erforderlich ist, Code zu ändern, um die Grafiken in einer Android-Anwendung zu aktualisieren oder zu ändern. Während Drawable Resources für viele einfache und allgemeine Grafikanforderungen nützlich sind, fehlt ihnen jedoch die Leistungsfähigkeit und Kontrolle der Canvas-API.

Die andere Technik, die das Canvas-Objekt verwendet, ähnelt sehr anderen herkömmlichen API-Frameworks wie System.Drawing oder iOS Core Drawing. Die Verwendung des Canvas-Objekts bietet die meiste Kontrolle darüber, wie 2D-Grafiken erstellt werden. Es ist für Situationen geeignet, in denen eine drawable-Ressource nicht funktioniert oder schwierig zu arbeiten ist. Beispielsweise kann es erforderlich sein, ein benutzerdefiniertes Schieberegler-Steuerelement zu zeichnen, dessen Darstellung sich basierend auf Berechnungen im Zusammenhang mit dem Wert des Schiebereglers ändert.

Lassen Sie uns zunächst zeichnende Ressourcen untersuchen. Sie sind einfacher und decken die am häufigsten verwendeten benutzerdefinierten Zeichnungsfälle ab.

Drawable Resources

Drawable Resources werden in einer XML-Datei im Verzeichnis /Resources/drawabledefiniert. Im Gegensatz zum Einbetten von PNG oder JPEG-Dateien ist es nicht erforderlich, dichtespezifische Versionen von Drawable Resources bereitzustellen. Zur Laufzeit lädt eine Android-Anwendung diese Ressourcen und verwendet die Anweisungen in diesen XML-Dateien, um 2D-Grafiken zu erstellen. Android definiert verschiedene Arten von drawable Resources:

  • ShapeDrawable – Dies ist ein Drawable-Objekt, das eine primitive geometrische Form zeichnet und einen begrenzten Satz grafischer Effekte auf diese Form anwendet. Sie sind sehr nützlich für Dinge wie das Anpassen von Schaltflächen oder das Festlegen des Hintergrunds von TextViews. Es wird ein Beispiel für die Verwendung eines ShapeDrawable späteren Artikels in diesem Artikel gezeigt.

  • StateListDrawable – Dies ist eine drawable-Ressource, die die Darstellung basierend auf dem Zustand eines Widgets/Steuerelements ändert. Beispielsweise kann eine Schaltfläche ihre Darstellung ändern, je nachdem, ob sie gedrückt wird.

  • LayerDrawable – Diese drawable-Ressource, die mehrere andere Drawables übereinander stapelt. Ein Beispiel für ein LayerDrawable-Objekt ist im folgenden Screenshot dargestellt:

    LayerDrawable-Beispiel

  • TransitionDrawable – Dies ist eine LayerDrawable , aber mit einem Unterschied. Eine TransitionDrawable kann eine Ebene animieren, die über dem anderen angezeigt wird.

  • LevelListDrawable – Dies ist einem StateListDrawable sehr ähnlich, da es ein Bild basierend auf bestimmten Bedingungen anzeigt. Im Gegensatz zu einer StateListDrawable zeigt levelListDrawable jedoch ein Bild basierend auf einem ganzzahligen Wert an. Ein Beispiel für eine LevelListDrawable wäre das Anzeigen der Stärke eines WLAN-Signals. Wenn sich die Stärke des WLAN-Signals ändert, ändert sich die zeichnungsfähige Anzeige entsprechend.

  • ScaleDrawable/ClipDrawable – Wie ihr Name schon sagt, bieten diese Drawables sowohl Skalierungs- als auch Clippingfunktionen. Die ScaleDrawable skaliert eine andere Zeichnungsart, während clipDrawable eine andere Zeichnungsart ausschneiden kann.

  • InsetDrawable – Diese Drawable-Methode wendet Aufsätze an den Seiten einer anderen Drawable-Ressource an. Sie wird verwendet, wenn eine Ansicht einen Hintergrund benötigt, der kleiner als die tatsächlichen Grenzen der Ansicht ist.

  • XML BitmapDrawable – Diese Datei ist eine Reihe von Anweisungen in XML, die für eine tatsächliche Bitmap ausgeführt werden sollen. Einige Aktionen, die Android ausführen kann, sind Tiling, Dithering und Antialiasing. Eine der häufig verwendeten Verwendungen besteht darin, eine Bitmap über den Hintergrund eines Layouts zu kacheln.

Zeichnungsfähiges Beispiel

Sehen wir uns ein schnelles Beispiel für das Erstellen einer 2D-Grafik mithilfe einer ShapeDrawable. Eine ShapeDrawable kann eine der vier grundlegenden Formen definieren: Rechteck, Oval, Linie und Ring. Es ist auch möglich, grundlegende Effekte wie Farbverlauf, Farbe und Größe anzuwenden. Der folgende XML-Code ist ein ShapeDrawable , der im AnimationsDemo-Begleitprojekt (in der Datei Resources/drawable/shape_rounded_blue_rect.xml) zu finden ist. Es definiert ein Rechteck mit einem violetten Farbverlaufshintergrund und abgerundeten Ecken:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<!-- Specify a gradient for the background -->
<gradient android:angle="45"
          android:startColor="#55000066"
          android:centerColor="#00000000"
          android:endColor="#00000000"
          android:centerX="0.75" />

<padding android:left="5dp"
          android:right="5dp"
          android:top="5dp"
          android:bottom="5dp" />

<corners android:topLeftRadius="10dp"
          android:topRightRadius="10dp"
          android:bottomLeftRadius="10dp"
          android:bottomRightRadius="10dp" />
</shape>

Wir können auf diese drawable-Ressource deklarativ in einem Layout oder einem anderen Drawable verweisen, wie in der folgenden XML gezeigt:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#33000000">
    <TextView android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_centerInParent="true"
              android:background="@drawable/shape_rounded_blue_rect"
              android:text="@string/message_shapedrawable" />
</RelativeLayout>

Drawable Resources können auch programmgesteuert angewendet werden. Der folgende Codeausschnitt zeigt, wie der Hintergrund einer TextView programmgesteuert festgelegt wird:

TextView tv = FindViewById<TextView>(Resource.Id.shapeDrawableTextView);
tv.SetBackgroundResource(Resource.Drawable.shape_rounded_blue_rect);

Um zu sehen, wie dies aussehen würde, führen Sie das AnimationDemo-Projekt aus, und wählen Sie im Menü Standard das Element "Shape Drawable" aus. Es sollte etwas ähnliches wie der folgende Screenshot angezeigt werden:

Textansicht mit benutzerdefiniertem Hintergrund, zeichnend mit einem Farbverlauf und abgerundeten Ecken

Weitere Informationen zu den XML-Elementen und der Syntax von Drawable Resources finden Sie in der Dokumentation von Google.

Verwenden der Canvas-Zeichen-API

Drawables sind leistungsfähig, haben aber ihre Grenzen. Bestimmte Dinge sind entweder nicht möglich oder sehr komplex (z. B.: Anwenden eines Filters auf ein Bild, das von einer Kamera auf dem Gerät aufgenommen wurde). Es wäre sehr schwierig, red-eye reduction mithilfe einer drawable-Ressource anzuwenden. Stattdessen ermöglicht die Canvas-API einer Anwendung eine sehr fein abgestimmte Steuerung, um Farben in einem bestimmten Teil des Bilds selektiv zu ändern.

Eine Klasse, die häufig mit dem Canvas verwendet wird, ist die Paint-Klasse . Diese Klasse enthält Farb- und Stilinformationen zum Zeichnen. Es wird verwendet, um Dinge wie Farbe und Transparenz bereitzustellen.

Die Canvas-API verwendet das Modell des Malers zum Zeichnen von 2D-Grafiken. Vorgänge werden in aufeinander folgenden Ebenen übereinander angewendet. Jeder Vorgang deckt einen Teil des zugrunde liegenden Bitmapbereichs ab. Wenn der Bereich einen zuvor bemalten Bereich überlappt, wird die neue Farbe teilweise oder vollständig die alte verdeckt. Dies ist die gleiche Weise, wie viele andere Zeichnungs-APIs wie System.Drawing und iOS Kerngrafiken funktionieren.

Es gibt zwei Möglichkeiten zum Abrufen eines Canvas Objekts. Die erste Methode umfasst das Definieren eines Bitmapobjekts und das anschließende Instanziieren eines Canvas Objekts. Der folgende Codeausschnitt erstellt beispielsweise eine neue Canvas mit einer zugrunde liegenden Bitmap:

Bitmap bitmap = Bitmap.CreateBitmap(100, 100, Bitmap.Config.Argb8888);
Canvas canvas = new Canvas(b);

Die andere Möglichkeit zum Abrufen eines Canvas Objekts ist die OnDraw-Rückrufmethode , die die View-Basisklasse bereitgestellt wird. Android ruft diese Methode auf, wenn sie entscheidet, dass eine Ansicht sich selbst zeichnen muss und ein Canvas Objekt übergibt, mit dem die Ansicht funktioniert.

Die Canvas-Klasse macht Methoden verfügbar, um die Zeichenanweisungen programmgesteuert bereitzustellen. Zum Beispiel:

  • Canvas.DrawPaint – Füllt die Bitmap des gesamten Zeichenbereichs mit der angegebenen Farbe.

  • Canvas.DrawPath – Zeichnet die angegebene geometrische Form mithilfe der angegebenen Farbe.

  • Canvas.DrawText – Zeichnet den Text auf dem Zeichenbereich mit der angegebenen Farbe. Der Text wird an der Position x,y gezeichnet.

Zeichnen mit der Canvas-API

Hier ist ein Beispiel für die Canvas-API in Aktion. Der folgende Codeausschnitt zeigt, wie eine Ansicht gezeichnet wird:

public class MyView : View
{
    protected override void OnDraw(Canvas canvas)
    {
        base.OnDraw(canvas);
        Paint green = new Paint {
            AntiAlias = true,
            Color = Color.Rgb(0x99, 0xcc, 0),
        };
        green.SetStyle(Paint.Style.FillAndStroke);

        Paint red = new Paint {
            AntiAlias = true,
            Color = Color.Rgb(0xff, 0x44, 0x44)
        };
        red.SetStyle(Paint.Style.FillAndStroke);

        float middle = canvas.Width * 0.25f;
        canvas.DrawPaint(red);
        canvas.DrawRect(0, 0, middle, canvas.Height, green);
    }
}

Dieser Code oben erstellt zuerst eine rote Farbe und ein grünes Paint-Objekt. Er füllt den Inhalt des Zeichenbereichs mit Rot und weist dann den Zeichenbereich an, ein grünes Rechteck zu zeichnen, das 25 % der Breite des Zeichenbereichs beträgt. Ein Beispiel hierfür ist im AnimationsDemo Projekt zu sehen, das im Quellcode für diesen Artikel enthalten ist. Wenn Sie die Anwendung starten und das Zeichnungselement aus dem Menü Standard auswählen, sollte ein Bildschirm wie folgt aussehen:

Bildschirm mit roten Lack- und Grünfarbenobjekten

Animation

Benutzer mögen Dinge, die in ihren Anwendungen verschoben werden. Animationen sind eine hervorragende Möglichkeit, um die Benutzererfahrung einer Anwendung zu verbessern und dabei zu helfen, sich hervorzuheben. Die besten Animationen sind diejenigen, die Benutzer nicht bemerken, weil sie sich natürlich fühlen. Android stellt die folgenden drei APIs für Animationen bereit:

  • Animation anzeigen – Dies ist die ursprüngliche API. Diese Animationen sind an eine bestimmte Ansicht gebunden und können einfache Transformationen für den Inhalt der Ansicht ausführen. Aufgrund der Einfachheit ist diese API für Elemente wie Alphaanimationen, Drehungen usw. weiterhin nützlich.

  • Property Animation – Eigenschaftenanimationen wurden in Android 3.0 eingeführt. Sie ermöglichen es einer Anwendung, fast alles zu animieren. Eigenschaftenanimationen können verwendet werden, um jede Eigenschaft eines Objekts zu ändern, auch wenn das Objekt nicht auf dem Bildschirm sichtbar ist.

  • Drawable Animation – Dies ist eine spezielle Drawable-Ressource, die verwendet wird, um einen sehr einfachen Animationseffekt auf Layouts anzuwenden.

Im Allgemeinen ist die Eigenschaftenanimation das bevorzugte System, das verwendet werden soll, da es flexibler ist und mehr Features bietet.

Animationen anzeigen

Ansichtsanimationen sind auf Ansichten beschränkt und können animationen nur für Werte wie Start- und Endpunkte, Größe, Drehung und Transparenz ausführen. Diese Arten von Animationen werden in der Regel als Tween-Animationen bezeichnet. Ansichtsanimationen können auf zwei Arten definiert werden: programmgesteuert im Code oder mithilfe von XML-Dateien. XML-Dateien sind die bevorzugte Methode zum Deklarieren von Ansichtsanimationen, da sie besser lesbar und einfacher zu Standard tain sind.

Die XML-Animationsdateien werden im /Resources/anim Verzeichnis eines Xamarin.Android-Projekts gespeichert. Diese Datei muss über eines der folgenden Elemente als Stammelement verfügen:

  • alpha – Eine Ein- oder Ausblendungsanimation.

  • rotate – Eine Drehungsanimation.

  • scale – Eine Größenänderungsanimation.

  • translate – Eine horizontale und/oder vertikale Bewegung.

  • set – Ein Container, der ein oder mehrere der anderen Animationselemente enthalten kann.

Standardmäßig werden alle Animationen in einer XML-Datei gleichzeitig angewendet. Um Animationen sequenziell zu erstellen, legen Sie das android:startOffset Attribut für eines der oben definierten Elemente fest.

Es ist möglich, die Änderungsrate in einer Animation mithilfe eines Interpolators zu beeinflussen. Mit einem Interpolator können Animationseffekte beschleunigt, wiederholt oder verzögert werden. Das Android-Framework bietet mehrere Interpolatoren außerhalb der Box, z. B. (aber nicht beschränkt auf):

  • AccelerateInterpolator / DecelerateInterpolator – Diese Interpolatoren erhöhen oder verringern die Änderungsrate in einer Animation.

  • BounceInterpolator – die Änderung springt am Ende ab.

  • LinearInterpolator – die Änderungsrate ist konstant.

Der folgende XML-Code zeigt ein Beispiel für eine Animationsdatei, die einige dieser Elemente kombiniert:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android=http://schemas.android.com/apk/res/android
     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:fillEnabled="true"
           android:fillAfter="false"
           android:duration="700" />

    <set android:interpolator="@android:anim/accelerate_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:fillEnabled="true"
               android:fillBefore="false"
               android:fillAfter="true"
               android:startOffset="700"
               android:duration="400" />

        <rotate android:fromDegrees="0"
                android:toDegrees="-45"
                android:toYScale="0.0"
                android:pivotX="50%"
                android:pivotY="50%"
                android:fillEnabled="true"
                android:fillBefore="false"
                android:fillAfter="true"
                android:startOffset="700"
                android:duration="400" />
    </set>
</set>

Diese Animation führt alle Animationen gleichzeitig aus. Die erste Skalierungsanimation dehnen das Bild horizontal und verkleinert es vertikal, und dann wird das Bild gleichzeitig um 45 Grad gegen den Uhrzeigersinn gedreht und verkleinert und vom Bildschirm verschwindet.

Die Animation kann programmgesteuert auf eine Ansicht angewendet werden, indem die Animation aufgeblasen und dann auf eine Ansicht angewendet wird. Android stellt die Hilfsklasse Android.Views.Animations.AnimationUtils bereit, die eine Animationsressource aufblasen und eine Instanz von Android.Views.Animations.Animation. Dieses Objekt wird auf eine Ansicht angewendet, indem das Animation Objekt aufgerufen StartAnimation und übergeben wird. Der folgende Codeausschnitt zeigt ein Beispiel dafür:

Animation myAnimation = AnimationUtils.LoadAnimation(Resource.Animation.MyAnimation);
ImageView myImage = FindViewById<ImageView>(Resource.Id.imageView1);
myImage.StartAnimation(myAnimation);

Nachdem wir nun ein grundlegendes Verständnis dafür haben, wie Ansichtsanimationen funktionieren, können Sie zu Eigenschaftenanimationen wechseln.

Eigenschaftenanimationen

Eigenschafts-Animatoren sind eine neue API, die in Android 3.0 eingeführt wurde. Sie stellen eine erweiterbarere API bereit, die verwendet werden kann, um jede Eigenschaft für jedes Objekt zu animieren.

Alle Eigenschaftenanimationen werden von Instanzen der Animator-Unterklasse erstellt. Anwendungen verwenden diese Klasse nicht direkt, sondern eine dieser Unterklassen:

  • ValueAnimator – Diese Klasse ist die wichtigste Klasse in der gesamten Eigenschaftenanimations-API. Es berechnet die Werte von Eigenschaften, die geändert werden müssen. Diese ViewAnimator Werte werden nicht direkt aktualisiert. Stattdessen werden Ereignisse ausgelöst, die zum Aktualisieren animierter Objekte verwendet werden können.

  • ObjectAnimator – Diese Klasse ist eine Unterklasse von ValueAnimator . Es soll das Animieren von Objekten vereinfachen, indem ein Zielobjekt und eine Eigenschaft zum Aktualisieren akzeptiert werden.

  • AnimationSet – Diese Klasse ist dafür verantwortlich, zu koordinieren, wie Animationen im Verhältnis zueinander ausgeführt werden. Animationen können gleichzeitig, sequenziell oder mit einer angegebenen Verzögerung zwischen ihnen ausgeführt werden.

Evaluatoren sind spezielle Klassen, die von Animatoren zum Berechnen der neuen Werte während einer Animation verwendet werden. Android bietet die folgenden Bewertungen:

Wenn es sich bei der animierten Eigenschaft nicht um eine floatoder int eine Farbe handelt, können Anwendungen ihre eigene Bewertung erstellen, indem sie die ITypeEvaluator Schnittstelle implementieren. (Das Implementieren von benutzerdefinierten Bewertern liegt außerhalb des Umfangs dieses Themas.)

Verwenden des ValueAnimator

Es gibt zwei Teile für jede Animation: die Berechnung animierter Werte und anschließendes Festlegen dieser Werte für Eigenschaften für ein bestimmtes Objekt. ValueAnimator berechnet nur die Werte, wird aber nicht direkt für Objekte verwendet. Stattdessen werden Objekte innerhalb von Ereignishandlern aktualisiert, die während der Lebensdauer der Animation aufgerufen werden. Mit diesem Design können mehrere Eigenschaften aus einem animierten Wert aktualisiert werden.

Sie erhalten eine Instanz, von ValueAnimator der Sie eine der folgenden Factorymethoden aufrufen:

  • ValueAnimator.OfInt
  • ValueAnimator.OfFloat
  • ValueAnimator.OfObject

Nachdem dies geschehen ist, muss für die ValueAnimator Instanz deren Dauer festgelegt sein, und sie kann gestartet werden. Das folgende Beispiel zeigt, wie Sie einen Wert von 0 bis 1 über den Zeitraum von 1000 Millisekunden animieren:

ValueAnimator animator = ValueAnimator.OfInt(0, 100);
animator.SetDuration(1000);
animator.Start();

Der obige Codeausschnitt ist jedoch nicht sehr nützlich – der Animator wird ausgeführt, aber es gibt kein Ziel für den aktualisierten Wert. Die Animator Klasse löst das Update-Ereignis aus, wenn es entscheidet, dass listener über einen neuen Wert informiert werden müssen. Anwendungen können einen Ereignishandler bereitstellen, um auf dieses Ereignis zu reagieren, wie im folgenden Codeausschnitt gezeigt:

MyCustomObject myObj = new MyCustomObject();
myObj.SomeIntegerValue = -1;

animator.Update += (object sender, ValueAnimator.AnimatorUpdateEventArgs e) =>
{
    int newValue = (int) e.Animation.AnimatedValue;
    // Apply this new value to the object being animated.
    myObj.SomeIntegerValue = newValue;
};

Nachdem wir nun über ein Verständnis verfügen ValueAnimator, erfahren Sie mehr über die ObjectAnimator.

Verwenden des ObjectAnimator

ObjectAnimator ist eine Unterklasse, die ViewAnimator das Timing-Modul und die Wertberechnung der ValueAnimator Logik kombiniert, die zum Verbinden von Ereignishandlern erforderlich ist. Die ValueAnimator Anwendungen müssen einen Ereignishandler explizit verkabeln – ObjectAnimator übernimmt diesen Schritt für uns.

Die API ist der API ViewAnimatorfür ObjectAnimator sehr ähnlich, erfordert jedoch, dass Sie das Objekt und den Namen der zu aktualisierenden Eigenschaft angeben. Das folgende Beispiel zeigt ein Beispiel für die Verwendung ObjectAnimatorvon :

MyCustomObject myObj = new MyCustomObject();
myObj.SomeIntegerValue = -1;

ObjectAnimator animator = ObjectAnimator.OfFloat(myObj, "SomeIntegerValue", 0, 100);
animator.SetDuration(1000);
animator.Start();

Wie Sie aus dem vorherigen Codeausschnitt sehen können, können Sie den Code reduzieren und vereinfachen, ObjectAnimator der zum Animieren eines Objekts erforderlich ist.

Zeichnungsfähige Animationen

Die endgültige Animations-API ist die Drawable Animation API. Drawable animation load a series of Drawable resources one after the other and display them sequenzly, similar to a flip-it cartoon.

Drawable resources are defined in an XML file that has an <animation-list> element as the root element and a series of <item> elements that define each frame in the animation. Diese XML-Datei wird im /Resource/drawable Ordner der Anwendung gespeichert. Der folgende XML-Code ist ein Beispiel für eine zeichnungsfähige Animation:

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@drawable/asteroid01" android:duration="100" />
  <item android:drawable="@drawable/asteroid02" android:duration="100" />
  <item android:drawable="@drawable/asteroid03" android:duration="100" />
  <item android:drawable="@drawable/asteroid04" android:duration="100" />
  <item android:drawable="@drawable/asteroid05" android:duration="100" />
  <item android:drawable="@drawable/asteroid06" android:duration="100" />
</animation-list>

Diese Animation wird durch sechs Frames ausgeführt. Das android:duration Attribut deklariert, wie lange jeder Frame angezeigt wird. Der nächste Codeausschnitt zeigt ein Beispiel für das Erstellen einer Drawable-Animation und das Starten, wenn der Benutzer auf eine Schaltfläche auf dem Bildschirm klickt:

AnimationDrawable _asteroidDrawable;

protected override void OnCreate(Bundle bundle)
{
    base.OnCreate(bundle);
    SetContentView(Resource.Layout.Main);

    _asteroidDrawable = (Android.Graphics.Drawables.AnimationDrawable)
    Resources.GetDrawable(Resource.Drawable.spinning_asteroid);

    ImageView asteroidImage = FindViewById<ImageView>(Resource.Id.imageView2);
    asteroidImage.SetImageDrawable((Android.Graphics.Drawables.Drawable) _asteroidDrawable);

    Button asteroidButton = FindViewById<Button>(Resource.Id.spinAsteroid);
    asteroidButton.Click += (sender, e) =>
    {
        _asteroidDrawable.Start();
    };
}

An diesem Punkt haben wir die Grundlagen der Animation-APIs abgedeckt, die in einer Android-Anwendung verfügbar sind.

Zusammenfassung

In diesem Artikel wurden viele neue Konzepte und APIs eingeführt, um einer Android-Anwendung einige Grafiken hinzuzufügen. Zunächst wurden die verschiedenen 2D-Grafik-APIs erörtert und gezeigt, wie Android anwendungen das direkte Zeichnen auf dem Bildschirm mithilfe eines Canvas-Objekts ermöglicht. Wir haben auch einige alternative Techniken gesehen, mit denen Grafiken deklarativ mithilfe von XML-Dateien erstellt werden können. Anschließend diskutierten wir die alten und neuen APIs zum Erstellen von Animationen in Android.