Projet : créer une application My City

1. Avant de commencer

Dans ce module, vous avez appris à :

  • Créer une application avec plusieurs écrans
  • Créer une mise en page adaptative pour que votre application fonctionne bien sur différentes tailles d'écran
  • L'importance de l'architecture des applications
  • Comment s'assurer que votre application respecte le cycle de vie de l'activité sans gaspiller des ressources
  • Conserver l'état des utilisateurs lors des changements de configuration de l'appareil

Il y avait beaucoup à apprendre !

En suivant les étapes de l'atelier de programmation, vous avez appris à maîtriser ces nouveaux concepts, mais vous allez approfondir vos connaissances et compétences avec une nouvelle application.

Vous utiliserez vos connaissances lorsque vous rencontrerez de nouveaux problèmes et bugs, ou lorsque vous devrez concevoir vous-même une solution. Vous pouvez toujours vous référer aux applications et ateliers de programmation précédents pour un piqûre de rappel et mettre ce savoir en action.

Vous en apprendrez davantage si vous essayez de résoudre ces problèmes par vous-même. Vous pourrez ainsi vous immerger dans le quotidien d'un développeur. Savoir décomposer un problème, le résoudre et trouver des ressources pour apporter une solution est une compétence à part entière. C'est pourquoi nous vous encourageons à travailler sur ces projets à la fin de chaque module. Avec cet objectif à l'esprit, consultez l'invite suivante pour le projet du module 4.

Conditions préalables

  • Vous êtes capable de créer et d'exécuter un projet dans Android Studio.
  • Vous maîtrisez les bases du langage de programmation Kotlin.
  • Vous savez comment créer des mises en page d'UI dans Compose et les adapter à différentes tailles d'écran.
  • Vous êtes capable d'ajouter et d'implémenter le composant Navigation de Jetpack avec Compose.
  • Vous êtes capable d'implémenter une application avec l'architecture recommandée à l'aide de ViewModels, UiState et la Navigation de Jetpack.

Objectifs de l'atelier

  • Une application Android qui affiche des recommandations d'activités et de lieux à visiter dans votre ville

Ce dont vous avez besoin

  • Un ordinateur sur lequel est installé Android Studio

2. Présentation

Félicitations ! Vous avez terminé le module 4.

Pour consolider les nouvelles connaissances acquises au cours de ce module, vous allez créer une application contenant des listes de recommandations pour différentes activités et lieux à visiter dans la ville de votre choix.

Cette application doit :

  • contenir plusieurs écrans (chaque écran peut par exemple afficher une catégorie différente de recommandations) ;
  • utiliser le composant Navigation de Jetpack pour permettre aux utilisateurs de naviguer dans votre application ;
  • séparer clairement la couche de l'UI et la couche de données ;
  • utiliser un ViewModel et mettre à jour l'UI à partir du modèle de visualisation à l'aide du flux de données unidirectionnel (UDF) ;
  • utiliser des mises en page adaptatives qui prennent en compte toutes les tailles d'écran ;
  • suivre les consignes de Material Design pour le design adaptatif et la navigation.

3. Collecter les contenus de l'application

Collectez les contenus de votre application : notez-les sur une feuille de papier ou dans un document. Il est plus facile d'organiser le contenu de votre application avant de commencer à la coder.

Choisissez la ville ou la région que vous souhaitez utiliser pour l'application. Nous vous suggérons d'utiliser votre ville préférée ou votre ville de résidence. Si vous préférez, vous pouvez également choisir une région plus étendue qui inclut plusieurs villes.

Choisissez un nom d'application en fonction de la ville que vous avez sélectionnée. Même si ce projet s'appelle Application My City, nous vous encourageons à personnaliser son nom pour l'adapter à votre ville.

Créez des listes pour différentes catégories de recommandations pour votre ville. Par exemple, vous pouvez créer une liste de recommandations sur les :

  • Cafés
  • Restaurants
  • Lieux adaptés aux enfants
  • Parcs
  • Centres commerciaux

Votre application doit contenir plusieurs listes de recommandations de différentes catégories. Essayez de créer au moins trois à cinq recommandations pour chaque catégorie pour que l'écran ne soit pas trop vide.

Si vous souhaitez ajouter des photos à votre application, collectez les photos à ce stade.

4. Dessiner les écrans de l'application

Sur une feuille, esquissez les différents écrans de l'application. Vous pouvez dessiner des flèches entre les écrans et ajouter des boutons à votre mise en page pour montrer à l'utilisateur comment passer d'un écran à l'autre.

Ce dessin n'a pas besoin d'être très détaillé ni soigné. L'objectif principal est de développer une idée pour les destinations sur le graphique de navigation et dans la mise en page globale de l'application. Ces dessins peuvent vous aider pour la prochaine étape.

Si vous avez besoin d'aide pour dessiner l'application et le flux de navigation, consultez l'exemple suivant :

Le premier écran liste les catégories. Lorsqu'une catégorie est sélectionnée, des recommandations s'affichent sur l'écran suivant. Lorsqu'une recommandation est sélectionnée, des détails s'affichent sur l'écran Détails.

Pouvez-vous utiliser cet exemple pour dessiner votre application et le flux de navigation pour les grands écrans ? Si vous avez besoin d'aide, n'hésitez pas à consulter l'atelier de programmation au cours duquel vous avez créé l'application Reply.

5. Planifier les étapes

Rédigez les principales étapes permettant de créer l'application que vous avez dessinée.

Exemple :

  • Créez la classe de données d'un lieu recommandé.
  • Créez la mise en page pour les cafés recommandés.
  • Créez le graphique de navigation pour tous les écrans.

Ces remarques peuvent vous aider à identifier la partie de l'application que vous développerez en premier.

Pour mieux vous organiser, vous pouvez numéroter les étapes dans l'ordre chronologique. Si vous devez avoir réalisé une étape avant de passer à la suivante, alors créez une série d'étapes adaptée.

6. Implémenter l'application

Maintenant que vous disposez d'un plan général pour l'application, vous pouvez commencer à la coder.

Créez le projet et terminez chaque tâche une par une. Si une tâche prend beaucoup de temps, faites preuve de patience. Il est normal d'avoir une courbe d'apprentissage ardue lorsque vous créez une application de cette complexité.

Conseils :

  • Consultez les précédents ateliers de programmation et les dépôts de code GitHub pour référence.
  • Consultez d'autres exemples d'applications Compose ou l'application Now in Android. Ces applications sont plus volumineuses et plus complexes que celles que vous avez développées jusqu'à présent.
  • Si vous rencontrez un bug dans l'application et que vous ne parvenez pas à le résoudre, vous pouvez utiliser les outils de débogage d'Android Studio.

7. Obtenir les commentaires d'un utilisateur (facultatif)

Cette section constitue une bonne expérience d'apprentissage. Lorsque vous disposez d'une version fonctionnelle de votre application, présentez-la à un utilisateur potentiel et demandez-lui ce qu'il en pense.

Si vous possédez un appareil Android, installez l'application. Vous pouvez également utiliser un émulateur, mais n'oubliez pas que l'utilisateur ne sait pas forcément ce qu'est un émulateur et ce qui le différencie d'un appareil réel.

Essayez de ne pas donner de conseils ni d'instructions à l'utilisateur. Concentrez-vous plutôt sur l'observation de l'utilisateur et posez-lui des questions pour comprendre comment les utilisateurs utiliseraient votre application pour la première fois. Surveillez sa façon d'interagir avec l'application, et déterminez si la navigation semble intuitive ou source de confusion. Peut-il utiliser l'application comme vous l'avez prévu, ou rencontre-t-il des difficultés ?

Assurez-vous qu'il parcourt tous les écrans et qu'il interagit avec chaque partie de l'application. Vous pouvez lui poser d'autres questions. Voici quelques exemples :

  • Quelle est votre première impression concernant cette application ?
  • Qu'est-ce qui vous plaît dans cette application ?
  • Avez-vous des suggestions pour améliorer cette application ?

Déterminez si vous souhaitez intégrer les suggestions de l'utilisateur dans votre application afin d'améliorer l'expérience de vos utilisateurs.

8. Tester l'application avec l'émulateur de redimensionnement

Nous vous recommandons de tester votre création sur un émulateur de redimensionnement pour voir si l'application fonctionne comme prévu sur différentes tailles d'écran. Assurez-vous de modifier la taille de l'émulateur et essayez différentes options d'appareils comme indiqué dans l'image ci-dessous.

Vous pouvez modifier les options de l'appareil de l'émulateur redimensionnable à partir du menu déroulant.

9. Bonne chance !

Bonne chance pour la création de votre appli ! Lorsque vous l'aurez terminée, partagez-la sur les réseaux sociaux avec le hashtag #AndroidBasics. Nous sommes impatients de découvrir le résultat et de recevoir vos recommandations.