Test des vues animées dans les applications iOS : conseils d'experts
Publié: 2023-03-20Les animations offrent des transactions visuelles fluides entre les différents états d'une interface utilisateur d'application. Dans le développement d'applications iOS, les animations sont utilisées pour repositionner les vues ou modifier leur taille, ainsi que pour masquer des vues ou supprimer des vues des hiérarchies. Les animations jouent un rôle essentiel dans la mise en œuvre d'effets visuels étonnants dans une application. Ils transmettent également un retour visuel pour les actions des utilisateurs. Le résultat est une interface utilisateur engageante et dynamique et une UX élevée pour les utilisateurs d'applications iOS.
Une vue animée est une vue personnalisée qui change d'aspect ou d'apparence en réponse à un certain contexte. Par exemple, une mise en page carrousel comporte plusieurs diapositives dont la taille et l'apparence changent en réponse à l'interaction d'un utilisateur. Cependant, les vues animées fonctionneront comme prévu et ne fourniront une UX incroyable que si elles sont testées correctement. Il est difficile de tester des vues animées dans les applications iOS, car les animations impliquent des modifications temporelles dans l'interface utilisateur.
Cet article vous guidera à travers le processus correct de test des vues animées dans les applications iOS.
Étapes clés pour tester les vues animées dans iOS
Identifier la vue animée et ses composants
Une vue animée fait référence à une vue avec un comportement ou une présentation animés. Il implique différents composants tels que des images, des boutons, des étiquettes et d'autres éléments d'une interface utilisateur. Ainsi, la toute première étape avant de commencer à tester les vues animées dans iOS consiste à identifier la vue animée avec ses composants. Vous devez tenir compte des facteurs suivants.
- Identifiez le type d'animation que vous avez l'intention d'utiliser dans l'application, comme un zoom avant/zoom arrière, un fondu avant/arrière et un glissement avant/arrière.
- Définissez la durée de l'animation - le temps nécessaire à l'achèvement de l'animation. Décidez très soigneusement de ce temps car il détermine l'effet de votre animation.
- Identifiez les interactions utilisateur spécifiques ou les événements particuliers qui déclencheront le fonctionnement de l'animation. Des exemples de tels déclencheurs incluent le défilement et le tapotement de bouton.
- Examinez avec quelle exactitude et précision l'animation fonctionnera ou se comportera.
- Vérifiez l'impact de l'animation sur le processeur, les performances et l'utilisation de la mémoire de l'application.
- Tenez compte des commentaires que les utilisateurs de l'application donneront pendant et après l'animation - indicateurs visuels ou retour haptique.
L'identification correcte d'une vue animée et de ses composants est importante lorsque vous effectuez des tests dans des projets de développement de logiciels. Il vous aide à décomposer le processus de test en parties plus petites et plus gérables.
Configurer l'environnement de test
Vous devez mettre en place un environnement de test qui vous permettra d'inspecter les vues et de les manipuler au cours des différentes phases de l'animation. Voici les étapes clés pour cela.
Tout d'abord, créez une cible de test distincte ainsi que des fichiers distincts pour chaque composant. De cette façon, vous pouvez vérifier séparément le comportement attendu de chaque composant. Pour créer une cible distincte pour votre environnement de test, accédez à "Fichier", puis à "Nouveau", puis à "Cible". Sélectionnez le « Bundle de tests unitaires iOS » présent dans la section « Test ». Une nouvelle cible est créée. Vous pouvez utiliser cette cible pour écrire des tests pour la vue animée. Ensuite, créez une classe de test pour les vues animées. Cette classe doit contenir des cas de test qui simuleront différentes étapes du processus d'animation et affirmeront que les vues vont fonctionner comme souhaité.
Maintenant, configurez un appareil de test qui contient la vue que vous allez tester. Cette étape inclut les dépendances essentielles, telles que les sources de données et les modèles de vue. Vous devez également configurer des objets fictifs pour les dépendances telles que les sources de données et toute autre vue. Une fois cela fait, vous pouvez créer les données de test nécessaires.
Les étapes susmentionnées vous aideront à configurer un environnement de test pour les animations lors du développement d'applications iOS. Cela vous permettra de mener le processus de test de manière contrôlée et reproductible.
Écrire des tests unitaires pour la logique sous-jacente de l'application iOS
Décomposez les animations en composants de petite taille, puis testez chaque composant individuellement. Cette pratique est meilleure que de tester toute l'animation en une seule fois. Voici un exemple. Il y a une vue personnalisée qui s'anime lorsque vous appuyez dessus. Ici, vous devez vérifier si la vue change lorsque vous appuyez dessus et si la couleur de la vue change lorsque vous appuyez dessus. Vous devez également vous assurer que la vue s'anime de manière fluide et sans à-coups.
Ensuite, identifiez les composants présents dans l'animation. Rédigez des scénarios de test pour chaque composant afin de vérifier si les composants fonctionnent comme vous le souhaitez. Il est recommandé d'utiliser le framework XCTest fourni par Apple pour écrire de tels tests. Par exemple, XCTestExpectation vous permet d'attendre qu'une animation soit terminée avant de faire des assertions. Avec cet outil, vous pouvez tester le comportement de la vue à différentes phases de l'animation.
Les animations sont susceptibles d'avoir des dépendances telles que d'autres vues ou sources de données sur d'autres parties de l'application. De ce fait, vous devez isoler vos tests et améliorer leur fiabilité. Pour cela, vous devez utiliser des objets fictifs pour les dépendances. De cette façon, vous pourrez tester la logique d'animation de l'application sans avoir à vous soucier des autres parties de l'application iOS.
Déboguer à l'aide des outils de débogage intégrés pour les animations dans Xcode
Xcode est livré avec une large gamme d'outils de débogage intégrés qui facilitent les animations de débogage. Ces outils vous aident à comprendre le fonctionnement des animations et à identifier les bogues. Grâce à ces outils, vous pouvez effectuer des actions telles que la définition de points d'arrêt dans votre code pour mettre en pause une animation à des points particuliers afin que vous puissiez étudier l'état de la vue. Ainsi, vous pouvez identifier les erreurs logiques présentes dans le code qui affectent le fonctionnement de l'animation.
La hiérarchie des vues de débogage de l'outil vous aide à inspecter une vue pendant l'animation. Vous pourrez voir les propriétés d'une vue à différentes phases d'une animation, y compris les contraintes, le cadre, etc. Xcode offre un autre excellent outil, le graphique Debug Memory. Cet outil examine l'utilisation de la mémoire d'une vue pendant l'animation et vous aide à identifier les problèmes de performances tels que les fuites de mémoire. D'autres exemples d'outils Xcode sont l'inspecteur de hiérarchie de vue d'animation, le profileur temporel et le simulateur d'animations lentes.
Quelles sont les différentes méthodologies pour tester les vues animées dans iOS ?
Découvrez les différentes méthodologies de test. Chacune de ces techniques de test joue un rôle crucial pour garantir que les vues animées sont testées rigoureusement.
Tests asynchrones
Les animations impliquent des retards ou des rappels qui se produisent de manière asynchrone. Pour cette raison, vous devez effectuer des tests asynchrones tout en testant des vues animées. Jetez un œil aux étapes des tests asynchrones.
Étape 1
Utilisez XCTestExpectation, un outil intégré disponible dans le framework XCTest sous iOS. Avec cet outil, vous devez créer une attente pour un événement asynchrone. Définissez un intervalle de temporisation pour l'événement. Une fois que vous avez créé l'attente pour l'achèvement de l'animation et établi un intervalle de temporisation, le test échouera si l'attente n'est pas remplie. Voici un exemple.
let animationExpectation = XCTestExpectation(description : "Animation terminée")
// Commencer le code de l'animation ici
// Une fois l'animation terminée, remplissez l'attente
animationCompletionHandler = {
animationExpectation.fulfill()
}
// Attendez que l'attente soit remplie
attendre (pour : [animationExpectation], délai d'attente : 5)
Étape 2
Plusieurs API d'animation iOS contiennent des gestionnaires d'achèvement qui sont appelés une fois l'animation terminée. Les testeurs utilisent ces gestionnaires d'achèvement pour effectuer des tests après l'achèvement d'une animation. Regardez cet exemple.
// Commencer le code de l'animation ici
// A la fin de l'animation, effectuer le test
animationCompletionHandler = {
// Effectuez le test ici
}
Étape 3
Certaines animations peuvent impliquer une modification de l'état de l'interface utilisateur ; cela doit être effectué sur le thread principal. Ici, vous devez utiliser des files d'attente de répartition. De cette façon, vous pouvez exécuter le code de test sur le thread principal une fois l'animation terminée. Regardez comment cela se passe.
// Commencer le code de l'animation ici
// A la fin de l'animation, effectuer le test sur la file d'attente principale
animationCompletionHandler = {
DispatchQueue.main.async {
// Effectuez le test ici
}
}
Test manuel
Assurez-vous d'effectuer les tests sur des appareils simulés et réels. Vous avez besoin de ce processus pour vérifier si les animations fonctionneront comme vous le souhaitez sur chaque type d'appareil et de version du système d'exploitation.
Les tests manuels impliquent d'interagir manuellement avec la vue et d'observer le comportement de l'animation. C'est ainsi que les tests manuels sont effectués. Les testeurs exécutent l'application iOS sur un appareil ou dans le simulateur iOS. Ensuite, ils déclenchent manuellement l'animation en interagissant avec l'application. De cette façon, vous pouvez en savoir plus sur les problèmes d'animation tels que les comportements inattendus ou les problèmes de fonctionnement. N'oubliez pas que le comportement des animations peut être différent sur divers appareils et simulateurs, alors testez les vues animées dans différents environnements pour obtenir les meilleurs résultats.
Nous vous recommandons également de tester les vues animées avec de vrais utilisateurs et d'observer comment ils interagissent avec les animations. Vous pouvez le faire en exécutant une session de test d'utilisabilité ou une étude utilisateur. De cette façon, vous recevrez les commentaires des utilisateurs indispensables concernant l'animation de votre application iOS, identifierez les problèmes et les traiterez en temps opportun.
Tests automatisés
Créez des tests automatisés pour les vues animées à l'aide de cadres de test tels que EarlGrey, XCUITest ou KIF pour simuler les interactions des utilisateurs et vérifier si les animations se comportent comme vous le souhaitez. Les tests automatisés vous aident à détecter les problèmes dans les premières phases d'un cycle de développement. Cette approche de test vous permet également de garder votre animation fonctionnelle pendant que vous modifiez le code.
Jetez un coup d'œil aux étapes de test des vues animées à l'aide de l'outil XCUITest.
Étape 1
Identifiez la vue qui contient l'animation à tester. Ensuite, identifiez l'interaction de l'utilisateur qui déclenche l'animation.
Étape 2
Écrivez un scénario de test qui simule l'interaction de l'utilisateur pour déclencher l'animation. Par exemple, si une animation est déclenchée en appuyant sur un bouton, vous devez créer un cas de test pour appuyer sur ce bouton.
Étape 3
Une fois l'animation déclenchée, vérifiez le comportement de l'animation à l'aide d'assertions. Par exemple, vérifiez la taille, la position et la capacité de la vue pendant que l'animation se déroule.
Étape 4
Maintenant, répétez les étapes susmentionnées en utilisant divers scénarios tels que différentes animations ou différentes entrées utilisateur.
Découvrez cet exemple. Ici, le XCUITest est utilisé pour créer un cas de test pour une animation "bouton".
func testButtonAnimation() {
laissez app = XCUIApplication()
app.launch()
let button = app.buttons["myButton"]
bouton.tap()
// Vérification de l'animation
let animationExpectation = expectation(description : « Animation du bouton terminée »)
DispatchQueue.main.asyncAfter(délai : .maintenant() + 1.0) {
XCTAssertTrue(button.frame.origin.x > 0, "Le bouton doit se déplacer vers la droite pendant l'animation")
animationExpectation.fulfill()
}
waitForExpectations(timeout : 2.0, gestionnaire : nil)
}
Vues finales
Tester des vues animées peut parfois devenir délicat car cela implique des changements dynamiques et visuels. Pour cette raison, vous devez tester les vues animées de votre application iOS en suivant les meilleures pratiques et stratégies. Vous pouvez demander l'assistance technique d'un service professionnel de développement d'applications mobiles spécialisé dans le développement d'applications iOS. Cela vous permettra d'obtenir le bon processus de développement et de test de l'application.