Java pour les développeurs Android

Réaliser l'interface graphique

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Apprenez à créer un affichage sous forme de liste. Puis, ajoutez le RecyclerView à l'IHM (Interface Homme Machine) et créez un fichier représentant une ligne.
10:30

Transcription

Dans cette vidéo, nous allons commencer l'intégration du composant graphique Recyclerview. Commençons par la partie IHM dans les fichiers XML. Recyclerview se trouve dans ma palette, tout à la fin. Quand je clique dessus, il me propose d'ajouter la librairie Recyclerview à mon projet. Je lui dis que je suis d'accord. Là, une petite fenêtre jaune est apparue, indiquant qu'elle recompile le projet. Qu'est-ce qu'il s'est passé, concrètement, derrière ? Pour cela, il faut revenir sur le build.gradle de notre module et, dans la partie du bas, nous avons les dépendances. C'est-à-dire toutes les libraires ajoutées pour que le module fonctionne normalement. De base, vous en avez déjà certaines qui sont ajoutées automatiquement à la création du module. Vous n'aurez pas forcément le même rendu que moi. Tout simplement parce que cela évolue très fréquemment. En fonction des évolutions d'Android Studio, du Sdk qui change, etc. Donc vous avez votre version de base à la création de votre module. Ici, ce qui a été rajouté, pour les Recyclerviews, c'est cette ligne. Nous avons : « com.android.support:recyclerview-v7 ». À quoi ça sert ? À utiliser les Recyclerviews, mais surtout à être retro-compatible sur les anciennes versions d'Android. Ici, le 25 qu'on a là, correspond à la version actuelle utilisée pour la compilation d'Android. La dernière version d'Android au moment où la vidéo est tournée est Android Nougat, version 25, c'est pour ça que nous avons 25. Nous le retrouvons ici aussi. Ces deux 25 doivent correspondre à la version de compilation qui est indiquée en haut du fichier. Si je souhaite faire passer mon projet à la version 26 pour la nouvelle version d'Android ou une nouvelle version de Nougat qui aura évolué, il faudra inscrire 26 ici, il faudra inscrire 26 ici et mettre les buildTools version adéquate. La targetSdk, même chose, il faudra passer en 26 et avoir les bons chiffres qui correspondent. Comment on devine tous ces chiffres ? Les .3.0, les .0.2, ceux-ci se trouvent dans le Sdk d'Android qui est, je vous le rappelle, dans File, Settings, Sdk, Android Sdk, j'ai ma plate-forme Android Nougat version 25. Les SdkTools qui sont en version 25.0.4, je pourrai incrémenter mon SdkTools qui est à 25.0.2, car les nouvelles versions sont sorties. Concernant le Recyclerview et grâce à Gradle, si on veut toujours la dernière version et être sûr de ne pas se tromper, on peut remplacer le .3.0 par « + », ce qui veut dire qu'il ira chercher toujours la dernière version en 25. Même chose ici, je peux mettre « .+ », il ira chercher la dernière version. En l'occurrence, je peux laisser ça, les changements qui s'appliquent sont généralement assez mineurs sur ces petites versions. Concernant les Recyclerviews, pour être sûr d'avoir la dernière version, je peux remplacer le 3.0. par un « + », qui veut dire qu'il ira toujours chercher la dernière version en 25. Même chose ici. Et ensuite, j'appuie sur « Sync Now ». Gradle recompile et, pendant sa compilation, il va aller vérifier sur les serveurs s'il y a une nouvelle version. On va aller voir quelle est la dernière version 25. J'ouvre les ExternalLibrairies et je n'ai plus qu'à chercher, dedans, mon Recyclerview, il est là. Je vois que la dernière version est la 25.3.0. Normal, je viens de l'ajouter. Revenons maintenant à notre IHM, je vais rajouter mon Recyclerview. Je vais enlever mon Scrollview qui faisait office d'affichage, et à la place, je vais mettre un Recyclerview. Je vais essayer de faire en sorte de ne pas le mettre dans le LinearLayout, je vais le mettre ici, fermer LinearLayout et faire monter le LinearLayout. Voilà, mon Recyclerview est bien ici, il est en match_parent / match_parent, et il nous indique plein de lignes, voilà, je n'ai plus qu'à mettre son ID. Je vais l'appeler « rv », pour Recyclerview. Cela paraît super simple mais ce n'est que la partie graphique. Maintenant, il va falloir dire à quoi ressemble une ligne du Recyclerview. Notre ligne ressemble à ça. Pour cela, nous allons créer un nouveau fichier XML qui va représenter une seule ligne. Et en fait, cette ligne-là, va être dupliquée par le Recyclerview. Je vais fermer mon External Libraries, je vais dans les Fichiers de ressources, dans Layout et, à côté de Activity_main, je crée un nouveau Layout Resource File. Qui a en composant Layout de départ, LinearLayout. Ça tombe bien, c'est ce qu'on utilise depuis le début de la formation. Je vais donner un nom à ce fichier, je vais l'appeler : « ligne_personne ». Si l'on regarde ici, on voit que la syntaxe c'est le typage. Ça représente l'interface graphique de l'activité Main. Du coup, c'est « activity_main ». Ici, on va représenter une ligne et c'est une ligne d'une personne. Je vais l'appeler : « ligne_personne ». ou « row_person », si on met ces variables en anglais. Mon fichier XML a été créé, il est représenté sur tout un écran, mais nous savons qu'en réalité il ne sera affiché que sur une ligne. je vais donc, pour ce fichier, je vous remontre l'exemple, partir sur un LinearLayout de haut en bas, ici, un LinearLayout de gauche à droite, pour avoir deux Textviews et un autre Textview. Donc je vais ajouter un Layout de LinearLayout horizontal, pour le côté gauche à droite et dedans, je vais mettre deux Textviews. Et un troisième Textview qui sera en dessous. Maintenant, il faut mettre tout cela en forme. Le premier, ici, je viens à hauteur match_parent. Justement, on veut que notre ligne prenne le moins de place possible. Sur la largeur, pas d'importance, on peut laisser match_parent. Ici, même chose, à hauteur, wrap_content, on fait en sorte que ça prenne le moins de place possible. Maintenant, je vais donner des ID à mes Textviews. « tv_nom », « tv_prenom » et « tv_section ». Section pour mettre la matière ou la classe. La classe de l'élève, pas la classe Java. Je vais mettre un exemple pour pouvoir travailler avec mon rendu, et je n'ai plus qu'à mettre en forme. Ici, nous allons enlever le poids pour que les deux soient collés, voilà, je veux mettre un peu de couleur. TextColor, je vais choisir, dans les couleurs, colorPrimaryDark. Même chose pour lui, je vais les sélectionner tous les deux pour aller plus vite, les mettre en gras, je vais augmenter un peu la taille de mon texte, je vais mettre 18. Je vais appliquer un « margin » à gauche, à mon deuxième Textview pour ne pas qu'il soit collé. « marginLeft » : 10dp, pour le deuxième, je vais le mettre en italique, lui mettre une valeur de 14. Et maintenant, je vais laisser un petit bord sur le contour pour éviter que mes lignes soient collées les unes aux autres car ma ligne, terminant sous Français, la deuxième ligne commencera ici. Je vais laisser un petit espace pour ça dans mon composant Layout principal, je vais lui appliquer un « padding » de 20 à droite et à gauche, et un « margin10 » en bas, pour laisser un peu d'espace avec la ligne d'après. J'aimerais maintenant voir le rendu. Android Studio permet d'indiquer au Recyclerview quel fichier XML on va utiliser. Attention, la manipulation que je vais faire ici est juste une manipulation qui permet d'avoir un rendu graphique. Cela ne modifie en rien l'exécution. Ici, je vais juste dire quel fichier je compte utiliser : Ligne_personne. Le fait d'indiquer la ligne, à cet endroit-là, n'influence en rien l'exécution du programme. Là, je vois un rendu de ce que ça va donner. Nous avons maintenant créé un Template d'une ligne, et ajouté le Recyclerview dans notre IHM d'Activity_main. Le fait d'avoir supprimé le TextViewConsole fait que l'ID TextViewConsole va être supprimé. Il va être supprimé, il n'a pas encore été supprimé, question d'optimisation. Pour éviter qu'Android Studio ne rame à contrôler tout le temps vos actions. Dès que je vais lancer mon application, je vais me retrouver avec une erreur. Il m'indique, après une recompilation, que mon TextViewConsole n'existe plus. Si je veux forcer cette recompilation, je peux faire un Build, Rebuild project, qui « rebuild » tout le projet. Pour le moment, nous allons nous contenter de mettre cette ligne en commentaire pour que l'ensemble compile, mais à l'exécution, il y aura des erreurs. Voilà pour l'intégration de l'IHM du Recyclerview.

Java pour les développeurs Android

Prenez en main la syntaxe et les concepts de Java pour vos développements d’applications pour Android. Abordez les variables, les chaînes de caractères, les conditions, etc.

7h01 (65 vidéos)
Aucun commentaire n´est disponible actuellement
Logiciel :
Spécial abonnés
Date de parution :24 avr. 2017

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !