Testen von animierten Ansichten in iOS-Apps: Anleitung durch Experten

Animationen bieten fließende visuelle Transaktionen zwischen den verschiedenen Zuständen einer App-Benutzeroberfläche. In der iOS-Anwendungsentwicklung werden Animationen zum Neupositionieren von Ansichten oder zum Ändern ihrer Größe sowie zum Ausblenden von Ansichten oder zum Entfernen von Ansichten aus Hierarchien verwendet. Animationen spielen eine wichtige Rolle bei der Implementierung erstaunlicher visueller Effekte in einer Anwendung. Sie vermitteln auch visuelles Feedback für die Aktionen der Benutzer. Das Ergebnis ist eine ansprechende und dynamische Benutzeroberfläche und eine verbesserte UX für Benutzer von iOS-Apps.

Eine animierte Ansicht ist eine benutzerdefinierte Ansicht, die ihr Aussehen oder Erscheinungsbild als Reaktion auf einen bestimmten Kontext ändert. Beispielsweise hat ein Karussell-Layout mehrere Folien, die sich in Größe und Aussehen als Reaktion auf die Interaktion eines Benutzers ändern. Animierte Ansichten funktionieren jedoch nur dann wie erwartet und bieten eine erstaunliche UX, wenn sie korrekt getestet werden. Es ist eine Herausforderung, animierte Ansichten in iOS-Apps zu testen, da Animationen zeitbasierte Änderungen in der Benutzeroberfläche beinhalten.

Dieser Beitrag führt Sie durch den korrekten Prozess zum Testen animierter Ansichten in iOS-Anwendungen.

Wichtige Schritte zum Testen animierter Ansichten in iOS

Identifizieren Sie die animierte Ansicht und ihre Komponenten

Eine animierte Ansicht bezieht sich auf eine Ansicht mit einem animierten Verhalten oder einer animierten Darstellung. Es umfasst verschiedene Komponenten wie Bilder, Schaltflächen, Beschriftungen und andere Elemente einer Benutzeroberfläche. Der allererste Schritt, bevor Sie mit dem Testen animierter Ansichten in iOS beginnen, besteht also darin, die animierte Ansicht zusammen mit ihren Komponenten zu identifizieren. Sie müssen die folgenden Faktoren berücksichtigen.

• Identifizieren Sie die Art der Animation, die Sie in der App verwenden möchten, z. B. Vergrößern/Verkleinern, Einblenden/Ausblenden und Einschieben/Ausschieben.
• Stellen Sie die Dauer der Animation ein – die Zeit, die für den Abschluss der Animation benötigt wird. Legen Sie diese Zeit sehr sorgfältig fest, da sie die Wirkung Ihrer Animation bestimmt.
• Identifizieren Sie die spezifischen Benutzerinteraktionen oder die bestimmten Ereignisse, die die Funktion der Animation auslösen. Beispiele für solche Auslöser sind das Scrollen und das Antippen von Schaltflächen.
• Untersuchen Sie, wie genau und präzise die Animation funktionieren oder sich verhalten wird.
• Überprüfen Sie, wie sich die Animation auf CPU, Leistung und Speichernutzung der App auswirkt.
• Berücksichtigen Sie das Feedback, das Benutzer während und nach der Animation geben – visuelle Indikatoren oder haptisches Feedback.

Die richtige Identifizierung einer animierten Ansicht und ihrer Komponenten ist wichtig, wenn Sie Tests in Softwareentwicklungsprojekten durchführen. Es hilft Ihnen, den Testprozess in kleinere und überschaubarere Teile zu unterteilen.

Richten Sie die Testumgebung ein

Sie müssen eine Testumgebung einrichten, die es Ihnen ermöglicht, die Ansichten zu überprüfen und sie während verschiedener Phasen der Animation zu manipulieren. Hier sind die wichtigsten Schritte dafür.

Erstellen Sie zunächst ein separates Testziel und auch separate Dateien für jede Komponente. Auf diese Weise können Sie das erwartete Verhalten jeder Komponente separat überprüfen. Um ein separates Ziel für Ihre Testumgebung zu erstellen, gehen Sie zu „Datei“, dann zu „Neu“ und dann zu „Ziel“. Wählen Sie das im Abschnitt „Test“ vorhandene „iOS Unit Testing Bundle“ aus. Ein neues Ziel wird erstellt. Sie können dieses Ziel zum Schreiben von Tests für die animierte Ansicht verwenden. Erstellen Sie dann eine Testklasse für die animierten Ansichten. Diese Klasse sollte Testfälle enthalten, die verschiedene Phasen des Animationsprozesses simulieren und sicherstellen, dass die Ansichten wie gewünscht funktionieren.

Konfigurieren Sie nun eine Testvorrichtung, die die zu testende Ansicht enthält. Dieser Schritt beinhaltet wesentliche Abhängigkeiten wie Datenquellen und Ansichtsmodelle. Sie müssen auch Mock-Objekte für Abhängigkeiten wie Datenquellen und andere Ansichten einrichten. Sobald dies erledigt ist, können Sie die erforderlichen Testdaten erstellen.

Die oben genannten Schritte helfen Ihnen, während der iOS-Anwendungsentwicklung eine Testumgebung für Animationen einzurichten. Dadurch können Sie den Testprozess kontrolliert und wiederholbar durchführen.

Schreiben Sie Komponententests für die zugrunde liegende Logik der iOS-App

Zerlegen Sie die Animationen in kleine Komponenten und testen Sie dann jede Komponente einzeln. Diese Vorgehensweise ist besser, als die gesamte Animation auf einmal zu testen. Hier ist ein Beispiel. Es gibt eine benutzerdefinierte Ansicht, die beim Antippen animiert wird. Hier müssen Sie überprüfen, ob sich die Ansicht beim Antippen ändert und ob sich die Farbe der Ansicht beim Antippen ändert. Außerdem sollten Sie darauf achten, dass die Ansicht ruckelfrei animiert wird.

Identifizieren Sie als Nächstes die in der Animation vorhandenen Komponenten. Schreiben Sie Testfälle für jede Komponente, um zu überprüfen, ob die Komponenten wie gewünscht funktionieren. Es wird empfohlen, zum Schreiben solcher Tests das von Apple bereitgestellte XCTest-Framework zu verwenden. Mit XCTestExpectation können Sie beispielsweise warten, bis eine Animation beendet ist, bevor Sie Behauptungen aufstellen. Mit diesem Tool können Sie das Verhalten der Ansicht in verschiedenen Phasen der Animation testen.

Animationen haben wahrscheinlich Abhängigkeiten wie andere Ansichten oder Datenquellen von anderen Teilen der Anwendung. Aus diesem Grund müssen Sie Ihre Tests isolieren und ihre Zuverlässigkeit verbessern. Dazu müssen Sie Mock-Objekte für die Abhängigkeiten verwenden. Auf diese Weise können Sie die Animationslogik der App testen, ohne sich um die anderen Teile der iOS-Anwendung kümmern zu müssen.

Debuggen mit den integrierten Debug-Tools für Animationen in Xcode

Xcode verfügt über eine Vielzahl integrierter Debugging-Tools, die das Debuggen von Animationen erleichtern. Solche Tools helfen Ihnen zu verstehen, wie Animationen funktionieren, und Fehler zu identifizieren. Dank dieser Tools können Sie Aktionen wie das Setzen von Haltepunkten in Ihrem Code ausführen, um eine Animation an bestimmten Punkten anzuhalten, damit Sie den Zustand der Ansicht untersuchen können. Auf diese Weise können Sie die im Code vorhandenen logischen Fehler identifizieren, die die Funktionsweise der Animation beeinträchtigen.

Die Debug-Ansichtshierarchie des Tools hilft Ihnen, eine Ansicht während der Animation zu untersuchen. Sie können die Eigenschaften einer Ansicht in verschiedenen Phasen einer Animation sehen, einschließlich der Einschränkungen, des Frames usw. Xcode bietet ein weiteres großartiges Tool, das Debug Memory-Diagramm. Dieses Tool untersucht die Speichernutzung einer Ansicht während der Animation und hilft Ihnen, Leistungsprobleme wie Speicherlecks zu identifizieren. Einige andere Beispiele für Xcode-Tools sind der Hierarchieinspektor für Animationsansichten, der Zeitprofiler und der Simulator für langsame Animationen.

Was sind die verschiedenen Methoden zum Testen animierter Ansichten in iOS?

Informieren Sie sich über die verschiedenen Testmethoden. Jede dieser Testtechniken spielt eine entscheidende Rolle, um sicherzustellen, dass animierte Ansichten rigoros getestet werden.

Asynchrones Testen

Animationen beinhalten Verzögerungen oder Rückrufe, die asynchron auftreten. Aus diesem Grund müssen Sie beim Testen animierter Ansichten asynchrone Tests durchführen. Sehen Sie sich die Schritte für asynchrones Testen an.

Schritt 1

Verwenden Sie XCTestExpectation, ein integriertes Tool, das im XCTest-Framework in iOS verfügbar ist. Mit diesem Tool müssen Sie eine Erwartung für ein asynchrones Ereignis erstellen. Legen Sie ein Timeout-Intervall für das Ereignis fest. Nachdem Sie die Erwartung für den Abschluss der Animation erstellt und ein Timeout-Intervall festgelegt haben, schlägt der Test fehl, wenn die Erwartung nicht erfüllt wird. Hier ist ein Beispiel.

let animationExpectation = XCTestExpectation(description: „Animation complete“)

// Animationscode hier starten

// Erfüllen Sie nach Abschluss der Animation die Erwartung

animationCompletionHandler = {

animationErwartung.erfüllen()

}

// Warten bis die Erwartung erfüllt wird

warten (auf: [animationExpectation], timeout: 5)

Schritt 2

Mehrere iOS-Animations-APIs enthalten Abschlusshandler, die nach Abschluss der Animation aufgerufen werden. Tester verwenden diese Abschluss-Handler, um Tests nach Abschluss einer Animation durchzuführen. Sehen Sie sich dieses Beispiel an.

// Animationscode hier starten

// Führen Sie am Ende der Animation den Test durch

animationCompletionHandler = {

// Test hier durchführen

}

Schritt 3

Bestimmte Animationen können eine Änderung des Zustands der Benutzeroberfläche beinhalten; Dies muss auf dem Haupt-Thread durchgeführt werden. Hier müssen Sie Versandwarteschlangen verwenden. Auf diese Weise können Sie den Testcode nach Abschluss der Animation im Hauptthread ausführen. Schauen Sie sich an, wie es passiert.

// Animationscode hier starten

// Führen Sie am Ende der Animation den Test in der Hauptwarteschlange durch

animationCompletionHandler = {

DispatchQueue.main.async {

// Test hier durchführen

}

}

Manuelles Testen

Stellen Sie sicher, dass Sie die Tests sowohl auf simulierten als auch auf realen Geräten durchführen. Sie benötigen diesen Vorgang, um zu prüfen, ob Animationen auf allen Gerätetypen und OS-Versionen wie gewünscht funktionieren.

Beim manuellen Testen wird manuell mit der Ansicht interagiert und beobachtet, wie sich die Animation verhält. So wird manuelles Testen durchgeführt. Tester führen die iOS-Anwendung entweder auf einem Gerät oder im iOS-Simulator aus. Dann lösen sie die Animation manuell aus, indem sie mit der Anwendung interagieren. Auf diese Weise können Sie mehr über Animationsprobleme wie unerwartetes Verhalten oder Funktionsstörungen erfahren. Denken Sie daran, dass das Verhalten von Animationen auf verschiedenen Geräten und Simulatoren unterschiedlich sein kann. Testen Sie daher animierte Ansichten in verschiedenen Umgebungen, um die besten Ergebnisse zu erzielen.

Wir empfehlen außerdem, animierte Ansichten mit echten Benutzern zu testen und zu beobachten, wie sie mit den Animationen interagieren. Sie können dies tun, indem Sie eine Usability-Testsitzung oder eine Benutzerstudie durchführen. Auf diese Weise erhalten Sie dringend benötigtes Benutzerfeedback zur Animation Ihrer iOS-App, identifizieren Probleme und beheben diese rechtzeitig.

Automatisiertes Testen

Erstellen Sie automatisierte Tests für animierte Ansichten mit Testframeworks wie EarlGrey, XCUITest oder KIF, um Benutzerinteraktionen zu simulieren und zu überprüfen, ob sich Animationen wie gewünscht verhalten. Automatisierte Tests helfen Ihnen, Probleme in den frühen Phasen eines Entwicklungszyklus zu erkennen. Dieser Testansatz ermöglicht es Ihnen auch, Ihre Animation funktionsfähig zu halten, während Sie den Code ändern.

Sehen Sie sich die Schritte zum Testen animierter Ansichten mit dem XCUITest-Tool an.

Schritt 1

Identifizieren Sie die Ansicht, die die zu testende Animation enthält. Identifizieren Sie als Nächstes die Benutzerinteraktion, die die Animation auslöst.

Schritt 2

Schreiben Sie einen Testfall, der die Benutzerinteraktion zum Auslösen der Animation simuliert. Wenn beispielsweise eine Animation durch das Drücken einer Schaltfläche ausgelöst wird, müssen Sie einen Testfall erstellen, um auf diese Schaltfläche zu tippen.

Schritt 3

Nachdem die Animation ausgelöst wurde, überprüfen Sie das Verhalten der Animation mithilfe von Behauptungen. Überprüfen Sie beispielsweise die Größe, Position und Kapazität der Ansicht, während die Animation stattfindet.

Schritt 4

Wiederholen Sie nun die oben genannten Schritte mit verschiedenen Szenarien, wie z. B. verschiedenen Animationen oder verschiedenen Benutzereingaben.

Sehen Sie sich dieses Beispiel an. Hier wird der XCUITest verwendet, um einen Testfall für eine „Button“-Animation zu erstellen.

func testButtonAnimation() {

let app = XCUIApplication()

app.launch()

let button = app.buttons["myButton"]

button.tap()

// Überprüfen Sie die Animation

let animationExpectation = Erwartung (Beschreibung: „Schaltflächenanimation abgeschlossen“)

DispatchQueue.main.asyncAfter(Frist: .now() + 1.0) {

XCTAssertTrue(button.frame.origin.x > 0, „Schaltfläche soll sich während der Animation nach rechts bewegen“)

animationErwartung.erfüllen()

}

waitForExpectations(timeout: 2.0, handler: nil)

}

Abschließende Ansichten

Das Testen von animierten Ansichten kann manchmal schwierig werden, da es dynamische und visuelle Änderungen beinhaltet. Aus diesem Grund müssen Sie animierte Ansichten Ihrer iOS-App gemäß den Best Practices und Strategien testen. Sie können technische Unterstützung von einem professionellen Entwicklungsdienst für mobile Apps erhalten, der auf die Entwicklung von iOS-Apps spezialisiert ist. Auf diese Weise können Sie den App-Entwicklungs- und Testprozess richtig gestalten.