Construisez une application de chat sous Android avec Java et Firebase

1. Présentation de la classe: Bonjour tout le monde. Merci d'avoir manifesté de l'intérêt pour ma classe. Dans cette classe, nous allons apprendre comment les applications telles que les applications de conversation sont construites en général. Avant de continuer, je dois souligner que ces classe II conçu pour les gens qui sont déjà familiers avec le développement d'applications Android dans Android Studio. Environnement de développement intégré, ou langage de programmation Java, au moins. Et si vous n'êtes pas familier, vous pourriez trouver certaines parties difficiles à comprendre au début. Voyons maintenant un aperçu rapide de l'application que nous allons construire et des choses que nous allons apprendre. Ici, nous avons deux émulateurs. Sur la droite, nous sommes déjà connectés et nous pouvons voir une liste de tous les utilisateurs. Et sur la gauche, vous pouvez voir que nous n'avons pas de nom d'utilisateur ici parce que nous n'en avons pas besoin. Nous nous connecterons avec e-mail et mot de passe. Donc, nous allons maintenant créer un nouvel utilisateur. Appelons-le John. Nous allons mettre un email aléatoire et nous allons mettre une sorte de mot de passe ici. Lorsque nous cliquons sur l'inscription. Une fois l'inscription terminée et réussie, nous recevrons l'écran. Et l'écran est en fait écran où tous les utilisateurs de notre application seront affichés. Donc voici John, et du côté droit, on ne l'a pas encore. Mais si nous faisons quelque chose comme ça, nous aurons aussi John. Donc, nous verrons comment mettre en œuvre cette chose ici. Maintenant, si nous cliquons sur cette icône ici, nous pouvons voir l'activité de profil où nous pouvons applaudir image de profil. Donc, nous allons utiliser un de la galerie. Et quand nous cliquons sur télécharger la photo, nous pouvons voir ces progrès. Et puis l'image téléchargée message. Si nous revenons maintenant, vous pouvez voir que ces images n'ont toujours pas été mises à jour. Nous pouvons facilement modifier cela aussi, mais nous verrons comment le faire avec rafraîchissement, avec la mise en œuvre de la fonctionnalité balayée ou actualisée. Donc maintenant, si nous le faisons encore une fois, nous verrons aussi cette image. Maintenant va commencer la conversation avec cet utilisateur. Donc ici, nous allons ouvrir John parce que sur la gauche ou l'appareil nous sommes enregistrés comme John. Maintenant, je vais envoyer un message d'ici. Et vous pouvez voir que nous recevons un message juste là. Donc, je vais maintenant envoyer quelques sourires. Et ça marche très bien. Ainsi, vous pouvez voir qu'une fois que nous envoyons le message, il est automatiquement enregistré ici. Donc maintenant, si nous revenons en arrière et si nous ouvrons à nouveau ce chat, vous pouvez voir que les messages sont toujours là. Après avoir terminé ce cours, vous apprendrez des compétences qui sont très populaires et largement utilisées quand il s'agit du développement d'applications mobiles. Ainsi, non seulement vous apprendrez à créer une application de chat, mais vous apprendrez également des technologies que vous pouvez appliquer dans vos autres projets. Ainsi, par exemple, nous allons apprendre à utiliser Firebase comme base de données en ligne. Nous verrons pourquoi l'utilisons-nous. Nous allons apprendre une vue recycleur, vues cicatrisées et bien d'autres choses. Alors c'est tout. Commençons et je te vois dans la prochaine vidéo. 2. Concevoir l'écran d'inscription/de connexion: Hey tout le monde, c'est le moment de commencer à créer notre application de chat. Donc, nous allons tout d'abord créer un nouveau projet Android Studio. Choisissons l'activité vide. Et pour le nom de l'application. Mettons le chat en place. Vous pouvez changer le nom du paquet comme vous le souhaitez et cliquer sur Terminer. La construction est maintenant terminée et nous sommes prêts à continuer. Donc, tout d'abord, allons changer les couleurs que nous allons utiliser dans notre application. Alors ouvrons le dossier des valeurs et ouvrons les couleurs. Changons donc la couleur primaire à la 33 a2 OFF. Maintenant, changeons l'obscurité primaire à la 3.3.1 un FF. Changez celui-ci en f, f, a, f, f. Et ajoutons une couleur de plus, qui sera appelée couleur secondaire. Et la couleur sera F 4, 33 A à F, donc nous avons ici une sorte de transparence. Donc maintenant, lorsque nous avons changé de couleur, nous allons commencer à créer notre activité principale où un utilisateur peut se connecter et se connecter. En passant, vous pouvez utiliser les couleurs que vous aimez. Vous pouvez faire ce que vous pensez que c'est le meilleur. Alors ouvrons l'activité principale et cliquez sur Split. Nous allons supprimer ce TextView. Mettez le texte d'édition avec le parent correspondant comme la largeur de la hauteur. Nous utiliserons le contenu de l'emballage. Fermons cette étiquette. Celui-ci sera utilisé pour le nom d'utilisateur. Donc, nous allons mettre conseil pour être nom d'utilisateur. Nous allons maintenant ajouter ID, qui sera le nom d'utilisateur ADT. Et nous allons le déplacer quelque part ici. Maintenant, nous allons cliquer sur ce est allé à la contrainte, ce texte d'édition. Nous allons maintenant ajouter un autre EditText, qui sera également correspondre au contenu parent et envelopper. Mais celui-ci sera pour l'email. Alors mettons ID, e-mail ADT. Contraintons celui-ci comme ça. Donc, il sera en dessous du nom d'utilisateur éditer le texte. Nous allons maintenant ajouter le dernier texte d'édition pour le mot de passe. Donc, ici, nous allons mettre conseil mot de passe. L' ID sera le mot de passe EDTA. En outre, nous voulons changer le type d'entrée pour être mot de passe texte afin que nous ayons notre mot de passe caché lorsque l'utilisateur tape dans. Donc, nous voulons avoir ces points quand l'utilisateur commence, il commence à écrire son mot de passe. Nous pouvons maintenant déplacer ça un peu comme ici. Nous pouvons également mettre manuellement ici quelques valeurs, mais je vais les garder. Maintenant, nous allons ajouter un bouton où l'utilisateur va soumettre ce formulaire. Ce bouton sera Envelopper le contenu. Id sera btn soumettre. Le texte initial sera inscrit. Et nous allons le contraindre ici. Mais il sera centré. Et nous ajouterons une certaine marge ici. Sera la marge supérieure et il sera de dix dB. En dessous de ce bouton. Nous voulons ce texte qui dira avoir déjà accès au compte. Donc, ce sera la vue texte. Envelopper le contenu. Id sera dx t informations de connexion. Et le texte initial sera I. J'ai déjà un compte login. Et nous allons déplacer celui-ci en dessous de ces boutons. Donc, nous pouvons le contraindre comme ça aussi. Pour qu'il soit centré selon ces boutons. Donc, si nous déplaçons ce bouton éveillé ici, il sera lié à ces Boutons. Nous allons maintenant changer cette marge en haut de la 24, et nous allons ajouter la marge à ce TextView à dix d. p. Maintenant, nous devons changer l'arrière-plan ici ainsi que la forme de notre bouton. Donc, nous allons créer un fichier à l'intérieur du dossier drawable. Appelons-le dégradé. Ici, au lieu du sélecteur, nous voulons avoir la forme. Et nous allons maintenant déclarer dégradé, qui aura la couleur de départ. Accent, et la couleur de fin sera. Couleur secondaire comme celle-ci. Appliquons maintenant ces dégradés à notre mise en page racine, qui est la mise en page de contrainte. Maintenant, mettons-le pour l'attribut d'arrière-plan comme ceci. Et maintenant, nous devons changer la couleur du texte en blanc et blanc droïde. Et nous devons changer la forme de ces boutons. Nous allons donc créer un fichier de plus dans ce dossier dessinable. Nous l'appellerons de forme ronde bleue. Donc, ici, nous allons changer cela à la forme. Il sera coloré en couleur secondaire, et les coins auront un rayon de 90 dB. Nous allons simplement l'appliquer à l'attribut d'arrière-plan du bouton. Et nous avons notre bouton. Donc maintenant permet également de changer la couleur du texte en blanc ici. Et je crois que nous avons notre écran principal conçu. Alors exécutons l'application pour voir à quoi elle ressemble. Maintenant, vous pouvez voir que cet angle de la couleur est un peu faux. Nous avons donc cette couleur rose à gauche et bleu à droite. Donc, c'est à cause du problème de rendu dans Android Studio, nous obtenons une fausse image. Donc, nous allons changer l'angle de cette couleur au 270 pour obtenir ces couleurs de dégradé exactes. Donc ici, vous pouvez essayer différentes choses. Donc, par exemple, si nous mettons 19, nous aurons au fond. Si nous mettons 135, nous aurons du coin inférieur droit. Donc, fondamentalement, nous pouvons définir des angles aux nombres qui peuvent être divisés par 45. Donc, si vous mettez 5454, par exemple, vous voyez que nous n'avons rien. Donc, vous pouvez essayer avec 4726 et similaire. On utilisera 270. Nous allons maintenant relancer l'application pour voir si nous avons la couleur correcte maintenant. Donc maintenant, cela fonctionne très bien. Maintenant, allons dans l'activité principale pour déclarer ces points de vue. Donc, déclarons éditer des textes. Nous aurons EDTA nom d'utilisateur, mot de passe et e-mail ADT. Nous l'aurons. Bouton. Et nous avons une vue de texte, qui concerne la journalisation des informations. Nous allons maintenant les initialiser. Il est ici. Maintenant, nous allons initialiser le bouton. Et enfin TextView, comme ça. Donc maintenant, nous voulons différencier en quelque sorte si l'utilisateur va s'inscrire ou se connecter. Donc, nous aurons une variable qui sera de type booléen. Et il s'appellera la facilité d'inscription. Donc, par défaut, il sera égal au vrai parce que pour ouvrir notre application, nous voulons présenter la page d'inscription au début. Et quand l'utilisateur clique sur la vue de texte ici, nous voulons changer cet écran pour celui de connexion, donc nous voulons mettre à jour le texte à l'intérieur du bouton. Nous voulons mettre à jour ces textes ici. Et nous voulons cacher le champ de nom d'utilisateur. Alors, comment faire ça ? Nous allons définir onClickListener à la vue de texte ici d'abord, alors faisons-le comme ceci. Et quand nous cliquons si l'écran était pour l'inscription, nous voulons maintenant le changer à l'écran de connexion et nous allons définir cette variable sur false. Et si nous étions sur la page de connexion, nous voulons maintenant la changer à la page d'inscription, et cette variable sera maintenant vraie. Nous avons également besoin de mettre à jour le texte. Maintenant, le bouton doit avoir un texte qui sera la connexion. Et ici, nous voulons dire inscrivez-vous. Nous voulons également modifier le texte. Ici. Le texte ne sera pas inscrit à un compte. Et ici, nous voulons définir le texte à l'avoir déjà un compte. Connectez-vous. Va également mettre à jour ce texte ici. Comme ça. Et aussi ce que nous voulons faire est de cacher ce texte d'édition. Donc, nous allons ici définir la visibilité de ces nom d'utilisateur EDTA à disparu. Et ici, nous voulons être visibles. Maintenant, exécutons l'application et voyons si cela fonctionne. Si nous cliquons sur ce texte pour vous, nous avons maintenant cet écran qui nous dira connexion. Et si nous n'avons pas de compte et que nous voulons nous inscrire, nous pouvons cliquer ici et nous serons présentés avec ce champ. Donc maintenant, si vous vous demandez pourquoi avons-nous cette variable ? Variable est utilisé pour déterminer quand nous cliquons sur le bouton S'inscrire, si nous voulons commencer le processus de connexion ou l'inscription. Donc, vous verrez que lorsque nous commencerons à implémenter la logique pour l'authentification de l'utilisateur. Donc c'est pour cette vidéo. Et dans la prochaine, nous connecterons cette application à la Firebase et nous enregistrerons nos premiers utilisateurs. Alors on se voit dans la prochaine vidéo. 3. Authentification de l'utilisateur: Hey tout le monde, dans cette conférence, nous allons intégrer Firebase à notre projet. moyen donc plus simple de mettre en œuvre Firebase dans notre projet est de cliquer sur Outils, Firebase, et de cliquer sur l'authentification, l' e-mail et l'authentification par mot de passe. Et puis nous allons nous connecter à Firebase. Maintenant peut-être que vous ne voyez pas ce genre d' écran si vous n'êtes pas déjà connecté, dans Android Studio. Mais puisque je suis connecté avec ce compte, je suis présenté avec l'écran. Et il connaît déjà certains de mes projets qui sont dans Firebase qui sont associés à ce compte. Donc, si vous ne voyez pas quelque chose comme ça, je crois que vous serez invité à signer le formulaire. Et je vous suggère de vous connecter. Il sera donc beaucoup plus facile d'intégrer Firebase de cette façon. Donc, ici, vous voyez que je suis déjà suggéré avec le nom du projet, qui est le même du projet dans Android Studio. Donc, je vais maintenant cliquer sur se connecter à Firebase. La connexion est en cours. Maintenant, je vais ouvrir mon navigateur Internet. Ouvrez Firebase. Je vais maintenant ouvrir ma console Firebase, mais avec le compte qui est associé à Android Studio. Et je vais maintenant cliquer sur aller à la console. Mei. Vous pouvez voir que j'ai l'application de chat, qui est juste créé. Ici. Il dit que le projet Firebase est créé et nous sommes maintenant connectés. C' est donc le moment d'intégrer l'authentification à notre application. Donc, cliquez ici et acceptons les changements. Il va maintenant injecter les dépendances dans nos scripts Gradle dans le fichier Gradle construit pour être plus précis. Mais comme les versions plus récentes de l'authentification Android Firebase est disponible, nous allons la changer à la plus récente et cliquer sur synchronisation. Maintenant. Maintenant, nous pouvons fermer cet assistant et ouvrir l'activité principale. Pour pouvoir authentifier les utilisateurs, nous devons d'abord activer l'authentification dans notre projet. Donc, nous allons ouvrir le projet dans la console. Et nous allons passer à l'authentification et nous allons mettre en place la méthode de signature. Nous allons activer le mot de passe e-mail. Et nous pouvons maintenant créer des utilisateurs. Puisque cette activité sera utilisée à la fois pour l'enregistrement et la connexion, nous allons créer deux méthodes ici. Un sera appelé handle login, et le second sera appelé handle. Inscrivez-vous. La connexion à la poignée sera appelée lorsque nous cliquerons sur le bouton. Et nous ne nous inscrirons pas. Donc ici et ici, nous allons gérer l'inscription parce que cela signifie que nous sommes actuellement, disons, en mode d'inscription. Maintenant, mettons en œuvre cette méthode. Donc, nous allons appeler l'authentification Firebase. Dot instance point créer l'utilisateur avec e-mail et mot de passe. L' e-mail sera prélevé à partir de ce texte d'édition et mot de passe. De celui-là. Nous allons également ajouter OnComplete écouteur. Et ici, nous allons vérifier si la tâche a été couronnée de succès. Nous allons créer dosé, qui dira signé avec succès. Sinon, nous dirons que le point Ask get exception qui obtient le message localisé. Donc il nous dira ce qui a mal tourné. Et c'est tout pour la méthode d'inscription. Et dans la méthode de connexion de la poignée. Nous voulions dire une chose similaire, mais maintenant, au lieu de créer un utilisateur avec e-mail et mot de passe, nous voulons utiliser la connexion avec e-mail et mot de passe. Nous utiliserons les mêmes textes d'édition pour ceci et le même écouteur OnComplete. Et si ça s'est mal passé, nous voulons obtenir le message. Alors c'est tout. Maintenant, nous voulons nous assurer que l'utilisateur a une entrée correcte. Donc, si l'utilisateur, par exemple, laisse vides certains champs, nous ne voulons pas gérer l'inscription ou la connexion. Il va d'abord vérifier ici si l'e-mail. Est vide ou mot de passe vide. Et ici, si nous sommes en mode d'inscription, nous devons également vérifier le nom d'utilisateur. Donc, nous ne voulons pas laisser l'utilisateur s'inscrire sans mettre le nom d'utilisateur. Donc ici, nous devons vérifier si nous sommes en mode d'inscription et le nom d'utilisateur eDD est vide. Nous mettrons ceux qui diront entrée invalide. Et nous entendrons revenir. Donc le code ci-dessous ne sera pas exécuté. Maintenant, expliquons cela plus en détail. Donc, si nous sommes dans l'activité de connexion, par exemple, en mode connexion, en fait, c'est la même activité. Nous n'avons pas de champ nom d'utilisateur, et il sera vide par défaut. C' est pourquoi nous devons séparer la déclaration CIF d'ici. Donc, nous ne pouvions pas dire ou le nom d'utilisateur EDTA est vide parce que le nom d'utilisateur doit être vide si nous regardons dans. C' est pourquoi nous entendons vérifier spécifiquement si le nous sommes en mode d'inscription, alors seulement vérifier si le nom d'utilisateur est vide. Alors exécutons l'application et voyons comment elle se comporte. Donc ici, il est dit que le fichier Google services.js ou est manquant. Pour obtenir ce fichier, nous devons ouvrir Chrome. Vous devez également ouvrir notre projet et cliquer sur les paramètres de ce projet ici. Et ce fichier peut être téléchargé à partir d'ici. Et nous le ferons. Nous allons maintenant copier ce fichier. Je l'ai déjà copié, et je vais juste le coller dans ce dossier d'application. Alors choisissons tout d'abord le projet pour le rendre plus clair. Ouvrez ce dossier d'application et collez-le ici. Alors assurez-vous qu'il est appelé comme ça. Donc, pourquoi nous avons besoin de ce fichier est parce qu'il contient la clé, il contient essentiellement des informations sur Project et sur Firebase afin que notre projet puisse communiquer avec la Firebase avec succès. Essayons maintenant d'exécuter à nouveau l'application. Veille également à ajouter une autorisation Internet dans le fichier manifeste. Parce que parfois cela ne fonctionnera pas. Si nous n'avons pas l'autorisation Internet puisque notre application utilise Internet pour effectuer des opérations avec Firebase. Donc maintenant, je dois exécuter cette application une fois de plus afin que ces autorisations Internet soient appliquées. Je vais l'exécuter maintenant. Si nous commençons maintenant à taper quelque chose ici et cliquez sur Inscrivez-vous, nous obtiendrons un message d'entrée invalide. Si nous créons un utilisateur comme celui-ci, et si nous cliquons sur l'inscription, nous avons un message qui dit que l'utilisateur est inscrit avec succès. Et actualisons cette console ici. Et nous avons notre utilisateur authentifier avec succès. Alors maintenant, vérifions si la connexion fonctionne. Donc, nous allons maintenant cliquer sur login. Si nous cliquons maintenant sur Login, il indique que nous sommes connectés avec succès. Donc c'est sympa. Donc c'est pour cette conférence. 4. Concevoir l'activité du profil: Dans cette conférence, nous allons apprendre comment télécharger l' image de profil sur la Firebase et associée à l'utilisateur. Mais tout d'abord, créons une activité Amis, qui sera une activité où tous les utilisateurs seront affichés ici. Donc, nous allons d'abord créer ces activités parce que nous voulons aller à l'activité de profil où nous voulons applaudir l'image de l'activité de l'ami, de l'ami. Plus d'abord, créez cette activité. Ils ont besoin d'activités entre amis. Et cliquez sur Terminer. Maintenant, nous allons cliquer dessus. Je clique sur Afficher l'interface utilisateur du système. Et fondamentalement ce que nous voulons avoir ici, une sorte d'icône où nous pouvons taper et aller sur le profil. Donc, pour ce faire, nous devons créer un menu. Pour créer un menu, allons faire un clic droit sur le dossier de repos. Et passons maintenant sur le nouveau répertoire de ressources Android. Changez ceci dans le menu et cliquez sur OK. Maintenant, ici, nous allons créer un nouveau fichier de ressources de menu. Et appelons-le. Le menu de profil se divise. Et ici, nous voulons ajouter l'élément, qui aura l'ID du profil de l'élément de menu. Il guérira icône, qui sera créé en ce moment. Donc, continuons sur drawable et créons un actif vectoriel. Commençons à chercher le compte. Alors choisissez-la. Pour que nous puissions le laisser tel qu'il est. Il suffit de changer le nom à l'image du compte, et de l'ajouter ici. Et nous voulons le montrer comme l'action toujours. Donc maintenant nous sommes ici pour avoir un avertissement, c' est-à-dire que nous devrions avoir un titre, mais nous ne voulons pas de titre car il sera toujours mis ici. Maintenant, allons dans l'activité de l'ami et gonflons ce menu. Donc, nous allons appeler sur créer le menu d'options en fait, nous allons remplacer cette méthode, qui sera appelée par le système automatiquement. Nous allons obtenir le menu gonfleur et nous allons gonfler le menu que nous venons de créer. Et ici, nous voulons le mettre à l'intérieur de ces menus, qui est paramètre ici. Et nous reviendrons vrai. Nous voulions donc aller à une autre activité une fois que nous sommes connectés avec succès. Et nous allons ouvrir l'activité principale pour cela. Et lorsque nous gérons la connexion, si elle est terminée avec succès, nous commencerons l'activité de l'activité principale à l'activité de l'ami. Nous ferons également la même chose lorsque nous, lorsque nous serons inscrits avec succès. Donc, nous ne voulons pas que l'utilisateur soit à l'écran. Lorsque nous vous inscrirons, nous voulons le traduire immédiatement à l'activité de l'ami. Exécutons maintenant l'application et voyons ce qui se passe. Alors passons à la connexion. Mettons les informations d'identification et cliquez sur connexion. Donc nous sommes maintenant dans l'activité de l'ami et nous avons notre article ici. Donc, puisque nous sommes dans l'activité principale, faisons encore une chose. Et ce sera quand cette activité sera créée. Nous voulons ici vérifier si l'utilisateur est déjà connecté. Et si c'est le cas, nous voulons l'envoyer. Nous voulons l'envoyer à l'activité de l'ami. Donc, pour vérifier si l'utilisateur est déjà connecté, tout ce que nous devons faire est de vérifier si l'utilisateur actuel n'est pas égal à null. Donc c'est comme ça que ça marche. Et puis ici, nous voulons terminer l'activité principale. Donc maintenant, si vous exécutez l'application, encore une fois, nous serons présentés avec cette activité tout de suite. Comme ça. Alors maintenant, nous allons mettre sur l'écouteur de clic à cet élément de menu. Et nous allons le faire en remplaçant sur l'élément de menu options sélectionné. Et ici, nous voulons vérifier si l'élément que nous avons sélectionné est le profil de l'élément de menu. Et si c'est le cas, nous commencerons alors une nouvelle activité, qui passera de l'activité Amis à l'activité de profil. Mais nous devons créer une activité de profil maintenant puisqu'elle n'existe pas. Alors allons-y et faisons-le. Nommez le profil, puis cliquez sur terminer. Donc maintenant, si vous allez ici, l'erreur a disparu. Maintenant, exécutons l'application pour tester si cela fonctionne. Ok, maintenant, si nous cliquons sur cet article ici, nous sommes maintenant dans l'activité de profil. Donc, nous allons maintenant concevoir l'activité de profil. Ici, nous voulons avoir cela autour de lui image. Nous voulons avoir deux boutons pour applaudir et se déconnecter. Et nous voulons que vous ayez ici des textes qui seront utilisés pour présenter des informations sur l'utilisateur actuel, comme le courrier électronique. Donc, nous devons vous télécharger des cartes. Tout d'abord, maintenant nous pouvons revenir à la conception. Nous allons mettre des cartes vous, qui sera 180 DP large et 180 dB hauteur. Il aura un rayon d'angle de 90. Et nous allons maintenant fermer la balise comme celle-ci afin que nous puissions mettre la vue de l'image ici. Il sera match_parent id de l'image sera image de profil. Et nous pouvons le contraindre comme ça. On a besoin d'une sorte de détenteur de place ici. Et à cet effet, nous pouvons utiliser l'image que nous avons créée pour le menu Profil. Nous allons donc utiliser cette image de compte comme image source de cette vue d'image. Et nous voulons que le type d'échelle soit une culture centrée. Maintenant, ouvrons cette image et changeons réellement la couleur à l'accent de couleur. Et enlevons cette teinte pour que nous puissions, pour que nous ayons l'érudit comme ici. Maintenant, nous allons ajouter le bouton, qui sera Wrap Content. Id sera btn. Télécharger l'image. Le fond sera celui-ci. Le texte sera téléchargé photo et la couleur du texte sera blanc. Donc, nous allons le mettre ici. Comme ça. Nous ajouterons de la literie à ces boutons. Nous allons maintenant ajouter un bouton de plus pour la connexion ou désolé, pour le but de connexion OUT. L' arrière-plan sera le même, et l'ID sera btn déconnexion. Nous allons déplacer celui-ci ici. Alors maintenant, ajoutons quelques marges. Nous ajouterons ici. Nous ajouterons également une certaine marge ici. Et nous pouvons déplacer cette carte vers le haut en changeant le biais vertical à la 0,4. Donc, si vous mettez 0.5. vous l'aurez centré. Si vous en mettez un, ce sera en bas. Et si vous mettez 0, ce sera en haut. Donc on peut utiliser quelque chose comme ça. Alors maintenant, ajoutons TextView. La couleur sera noire. Id sera dxdy, info utilisateur ou email de l'utilisateur. Nous vous enverrons ce texte pour être ici. Nous allons ajouter le bas de la marge, dB, 30 dB, comme ceci. Alors maintenant, exécutons l'application pour voir à quoi il ressemble sur notre émulateur. J' ai donc une erreur parce que j'ai oublié d'ajouter le P ici. On recommence. Ok, alors nous allons cliquer sur cet article et nous avons notre activité de profil conçu. Donc, cette vidéo devient longue et à cause de cela, nous allons continuer dans la prochaine vidéo où nous allons voir comment télécharger données de notre utilisateur dans la base de données Firebase. Alors, à vous voir. 5. Télécharger une image de profil dans Firebase - Travailler avec Firebase Storage: Maintenant, nous voulons télécharger des données utilisateur, telles que le nom d'utilisateur, l'e-mail et l'image de profil dans notre base de données. Nous devrons donc d'abord activer la base de données en temps réel. Et nous allons cliquer sur créer une base de données. Et nous allons le démarrer en mode test. Maintenant, nous allons ouvrir Android Studio. Nous ouvrirons cet assistant. Et nous allons maintenant intégrer la base de données en temps réel. Nous allons donc cliquer sur enregistrer et récupérer les données. Maintenant, ajoutez la base de données en temps réel à l'application. Et fermons cet assistant pour l'instant. Ouvrez Gradle build-up afin que nous puissions mettre à jour version de base de données Firebase à la dernière, comme ceci. Et cliquez sur Synchroniser. Donc, en gros, lorsque nous nous inscrirons ici, nous voulons mettre quelques données supplémentaires dans notre base de données. Et que les données supplémentaires seront en fait objet utilisateur. Nous allons donc créer une classe appelée user. Objet utilisateur, aura le nom d'utilisateur. Si nous avons un email. Et il aura une image de profil. Donc image de profil est également une chaîne, qui sera en fait une URL à l'image de profil que nous allons, nous allons télécharger plus tard. Donc, nous allons créer, va réellement générer un constructeur comme celui-ci. Nous allons également créer un constructeur vide. A cause de Firebase. Il en a besoin pour utiliser des objets directement. Dans. Base de données. Les opérations génèrent également des getters et setters comme ceci. Donc, ici, lorsque nous gérons l'inscription, si la tâche est réussie, nous voulons accéder au point d'instance de point de base de données Firebase obtenir référence. Et cette référence sera utilisateur. Donc, quand nous mettons l'utilisateur ici comme référence, il va créer un nœud utilisateur ici. Et cela, il définira la valeur, qui sera un nouvel objet utilisateur avec le nom d'utilisateur qui est passé dans cette méthode ici. Il aura cet e-mail. Et pour l'image de profil, initialement ce sera une chaîne vide. Nous voulons donc que l'utilisateur puisse ajouter une image de profil plus tard. Et initialement, il aura un par défaut comme celui-ci. Mais ici, comme déréférencement, chaque utilisateur est unique. Et donc, nous voulons avoir un nœud central qui sera utilisateur. Et après cela, nous voulons avoir une sorte de branche où chaque utilisateur sera séparé de chacun par une sorte d'identifiant. Et l'identificateur est en fait un que nous pouvons obtenir de la Firebase devrait objecter avec obtenir l'utilisateur actuel, obtenir UID. Et maintenant, si nous exécutons notre application, mais d'abord, maintenant ajoutons d'abord la fonctionnalité de déconnexion afin que nous puissions déconnecter notre utilisateur. Donc, nous allons pour l'instant simplement initialiser le bouton Déconnexion. Et une fois que le bouton de déconnexion est cliqué, nous voulons nous déconnecter. Et nous voulons également commencer une nouvelle activité, qui est l'activité principale. Mais nous voulons aussi effacer toutes les activités pour que nous puissions, sorte que nous ne puissions pas revenir en arrière réellement. Et nous fermerons celui-là. Alors, lançons maintenant l'application pour tester cela. OK, alors nous allons cliquer sur ce profil. Déconnectons-nous. Et nous allons maintenant créer un nouvel utilisateur. Donc, un utilisateur aléatoire. Et nous allons cliquer sur l'inscription. Et voyons ce qui se passera dans la base de données. Donc, nous avons un nouvel utilisateur ici. Cet utilisateur dispose désormais d'un e-mail, d'un nom d'utilisateur et d'une image de profil, qui est vide pour le moment. Maintenant, vous comprenez pourquoi nous avons utilisé ici l'utilisateur et ensuite nous avons ajouté avec ces UID. Donc, de cette façon, nous pouvons avoir plusieurs utilisateurs ici. Et si nous étions sur le point d'omettre cette partie ici, nous ne supprimerions cet utilisateur et en créerions un nouveau à chaque fois. Nous allons donc nous déconnecter et créer un utilisateur de plus. Disons quelque chose comme ça. Cliquez sur s'inscrire. Et puis nous avons un autre utilisateur ici. Ok, donc c'est comme ça que ça marche. Il est maintenant temps de travailler sur applaudir la partie photo. Revenons donc dans le code et ouvrez l'activité de profil. Donc, ce que nous voulons faire est que lorsque l'utilisateur clique sur cette image, nous voulons ouvrir la galerie avec nos photos. Et quand l'utilisateur sélectionne une photo particulière, nous la voulons ici. Et puis lorsque nous cliquons sur le téléchargement, nous voulons qu'il soit téléchargé sur Firebase quelque part. Donc nous allons maintenant nous concentrer sur la première partie où nous allons obtenir l'image de la galerie ici. Donc, tout d'abord, allons initialiser cette vue d'image. Donc, nous allons d'abord le déclarer. Ok, donc c'est ça, c'est ça. Définissons onClickListener pour cette image. Et ici, nous allons ouvrir les solides de la galerie, voir comment c'est fait. Nous devons créer un nouvel objet Intent, qui sera appelé l'intention de photo. Ce sera égal à l'intention. Mais cette fois, nous spécifions quelque chose appelé action. Et cette action est un pic d'action. Donc, il saura que nous voulons choisir quelque chose de cet objet d'intention. Et ce sera l'image. cette raison, nous devons spécifier le type, qui sera imagé. Astérix barre oblique. Maintenant, nous allons commencer l'activité, mais l'activité pour le résultat parce que nous voulons obtenir une image particulière avec le code de requête un. Donc, cette chaîne ici dit fondamentalement à notre système que nous voulons ouvrir la galerie. Alors exécutons l'application et testez-la. Qu' est-ce que l'activité de profil ouvert et cliquez sur l'image. Vous pouvez voir qu'il nous envoie à la galerie où nous pouvons sélectionner une photo. Mais nous n'avons pas de photo sur notre appareil. Et pour cette raison, nous devrons prendre quelques photos plus tard. Mais maintenant, nous devons gérer ces résultats. Donc, nous devons gérer notre image culminante. On doit l'amener ici d'une manière ou d'une autre. Pour cela, nous allons remplacer la méthode appelée sur le résultat de l'activité. Ici, nous allons vérifier si le code de demande est égal à un. Et le code de résultat est ok. Nous devons également vérifier que les données ne sont pas égales à null car ces données seront en fait une image. Et si tout cela est le cas, nous obtiendrons l'image de ces données avec data.dat. Données. Et maintenant, nous devons le stocker quelque part. Pour cela, nous aurons besoin d'avoir une variable globale ici. Si vous vous demandez quel est le type de données que nous obtenons ? C' est URI. Donc, il est fondamentalement pad à une sorte de fichier dans notre appareil. Et nous allons le déclarer ici, URI privé, image Pat. Et ici, nous allons assigner ces données à cette image Pat, comme ça. Maintenant, ce que nous devons faire est d'obtenir l'image en vue de l'image. Et nous allons créer cette méthode ici. Donc, ce sera nul. Nous aurons besoin d'avoir un bitmap. Et ce bitmap sera essentiellement l'image que nous obtiendrons de ces paris image. Donc, pour ce faire, nous devons appeler media store, images.me, dot get bitmap. Et ici, nous devons obtenir le résolveur de contenu. Et nous allons utiliser notre pari image pour l'obtenir. Il est donc difficile de se souvenir de tout ça. Tu n'as même pas besoin de t'en souvenir. Juste Google sur la façon de transformer URI en bitmap et vous trouverez quelque chose comme ça. Et maintenant, quand nous avons notre image ici, nous voulons la définir sur notre profil d'image. Donc, nous allons nous référer au profil de l'image et nous allons définir image bitmap. Ce bitmap. Maintenant, vous pouvez voir cela sous-jacent ici. Et cela nous dit que nous devons gérer l'exception si fondamentalement notre image n'est pas trouvée. Donc, ce que nous allons faire, c'est que nous pouvons simplement faire plus d'actions et nous pouvons l'entourer. Nous essayons le bloc de capture. Et c'est tout. Donc, si l'image n'est pas trouvée, notre application ne se bloquera pas. Maintenant, exécutons notre application et testons son fonctionnement. Tout d'abord, nous devons prendre quelques photos pour les avoir dans notre galerie. Nous allons donc ouvrir la caméra de notre émulateur. Ok, allons, ok, capturer celui-là. Maintenant, nous allons revenir en arrière et nous allons ouvrir notre application. Donc, lorsque nous ouvrons le profil et cliquez sur cela, nous aurons maintenant des photos. Donc, nous allons en choisir un. Et vous pouvez voir que notre photo est ici. Nous avons donc résolu avec succès la première tâche. Et la seconde est d'applaudir ces photos sur Firebase. Alors comment nous faisons ça, où nous faisons, nous applaudissons réellement ces photos. Pour cela, nous devrons utiliser le stockage Firebase. Donc, en fait, le stockage est quelque chose où nous pouvons télécharger des fichiers sur Firebase. Et pour cela, nous devrons d'abord inclure les dépendances. Alors ouvrons notre assistant d'assistance Firebase. Et nous allons cliquer sur le stockage. Et cliquez dessus. Et ajoutons le stockage Cloud à notre projet. Pendant qu'il est construit, ouvrons un navigateur Web et activons le stockage. Donc, nous allons cliquer sur commencer. Cliquez sur Suivant. Cliquez sur Terminé. Et ce sera notre stockage de base de données. Et ici, nous pouvons télécharger des fichiers. Revenons maintenant au code et voyons comment le faire à travers l'application. Maintenant, nous allons définir onClickListener à ces bouton photo de téléchargement. Mais nous devrons d'abord le déclarer et l'initialiser. Donc nous allons le mettre ici, et nous allons l'initialiser ici. Nous allons définir onClickListener sur ces boutons. Et lorsque nous cliquons sur ce bouton, nous voulons télécharger l'image. Donc, créons cette méthode ci-dessous. Maintenant, quand nous commençons à applaudir tâche, nous voulons montrer une sorte de progrès de cette tâche à l'utilisateur, et ce sera ProgressDialog. Nous allons donc créer un dialogue sur les progrès. Le contexte sera cette classe. Nous donnerons le titre de ces progrès aux trois points applaudissants. Et nous voulions montrer ce dialogue. Enfin. Maintenant, nous voulons obtenir une référence du stockage afin que nous puissions applaudir ces images et nous entendrons appeler Firebase, stockage, point getInstance, obtenir référence et référence. Et seront des images avec une sorte de chaîne aléatoire qui sera générée de cette façon. Donc, cela nous donnera une chaîne aléatoire. Quel sera le nom de la photo que nous voulons télécharger. Et de cette façon, nous pouvons mettre plusieurs photos sans surcharger. Donc il n'y a aucune chance que nous ayons le même nom pour une sorte de photo. Et quand nous applaudissons cette photo au stockage, nous devons l'associer à nos utilisateurs d'une manière ou d'une autre. Et vous verrez dans un instant comment nous allons le faire. Alors voici maintenant, disons mettre le fichier. Le fichier sera notre image PET. Et nous voulons mettre sur écouteur complet afin que nous sachions une fois terminé, lorsque la tâche de téléchargement est terminée. Et si la tâche a été couronnée de succès. Nous allons maintenant rejeter notre dialogue de progression. Et puis nous allons sortir le message Doest, qui dira l'image téléchargée. Sinon. Nous dirons que quelque chose s'est mal passé avec le message correspondant. Mais aussi nous devons rejeter ProgressDialog de toute façon. Et pour cette raison, nous allons simplement déplacer cela ici pour que même notre tâche ait été couronnée de succès ou non. Nous serons sûrs que le dialogue sur les progrès sera rejeté. Exécutons maintenant l'application et testons comment cela fonctionne. Maintenant, allons ouvrir l'activité de profil. Mettons une image ici. Et nous allons cliquer sur télécharger. Photo. L' application est plantée. Et voyons pourquoi c'est ça. Donc, l'erreur est probablement parce que lorsque nous mettons la dépendance du stockage Firebase, il est obsolète. Et nous devrions le mettre à jour à la dernière version possible. Parce que vous pouvez voir qu'il est dit qu'il n'y a pas de méthode qui est utilisée dans le stockage Firebase. Et nous allons changer ceci à la dernière version. Et après que nous synchronisons le projet va essayer à nouveau. Alors lançons l'application maintenant et voyons comment nous allons travailler. Donc, sélectionnons Photo. Encore une fois. Cliquez sur télécharger la photo. Et il est dit que les images téléchargées. Alors actualisons cette page dans notre navigateur web. Vous pouvez voir qu'il y a des images de dossier que nous avons créées. N' importe quel côté, il y a une image avec ces chaînes aléatoires que nous avons générées. Donc ça marche, ça marche. D' accord. Maintenant, ce que nous voulons faire, c'est que nous voulons garder une trace de la quantité de notre photo est téléchargée. Nous voulons donc une sorte de pourcentage des données téléchargées. Donc, pour ce faire, nous devrons mettre sur l'auditeur de progrès ici. Et lorsque ces progrès changent, nous mettrons à jour notre boîte de dialogue de progression avec ce texte afin que la progression soit double variable, ce qui sera égal à 100 multiplié par point d'instantané. Obtenir les octets transférés. Divisé par point d'instantané obtient le nombre total d'octets. Et quand nous aurons ce progrès, nous mettrons à jour le message à quelque chose comme celui-ci. Et nous allons convertir cette progression en entier. Nous allons également ajouter le signe de pourcentage. Alors, lançons maintenant l'application et voyons si cela fonctionne. Eh bien, c'est maintenant ouvert ce profil. Applaudissons encore une fois quelque chose que vous pouvez voir ici que nous avons des progrès, mais vous pouvez remarquer qu'il a sauté à travers, droit à la 100%. Cela probablement parce que notre image est trop petite, donc il a fini vite. Je crois que si l'image est plus grande, cela fonctionnera bien. C' est maintenant la partie où nous voulons associer cette image à un certain utilisateur qui a téléchargé cette image. Donc, pour ce faire ici, lorsque la tâche est réussie, nous aurons besoin d'obtenir l'URL de cette image. Et puis nous allons mettre cette URL dans notre base de données au lieu de cette chaîne vide que nous avons ici. Donc, ici, nous avons une chaîne vide. Nous mettrons à jour ce champ avec l'URL correspondante pour obtenir le téléchargement, l'URL de téléchargement. Pour obtenir l'URL à partir de laquelle cette image peut être chargée, nous nous référerons à ces tâches. Nous obtiendrons un résultat. Ensuite, nous allons obtenir le stockage et obtenir l'URL de téléchargement. Cela prend donc aussi un certain temps. Fondamentalement, cette URL de téléchargement ne sera disponible que lorsque ces, cette tâche d'obtenir le stockage et d'obtenir cette URL est terminée. Donc, nous aurons besoin d'ajouter un de plus sur complètement Center ici. Et lorsque cela est terminé, si la tâche est réussie, nous mettrons à jour l'image de profil de notre utilisateur. Et nous allons mettre l'argument ici, qui sera l'URL exacte. Et maintenant que l'URL est simplement le résultat de cette tâche, et cette tâche est en fait obtenir l'URL de téléchargement. Donc maintenant, nous allons créer une méthode ici et nous allons voir comment cela fonctionne. Donc, nous passons l'URL de chaîne. Donc maintenant, nous devons mettre cette URL de chaîne ici. Et c'est ainsi que cela sera fait. Donc, nous devons obtenir en quelque sorte pat dans notre base de données à ce champ d'image de profil. Et ce Pat est celui-là. Donc, nous allons d'abord se référer à la base de données Firebase GetInstance et obtenir référence. Ici. Nous allons mettre animal de compagnie sur cette photo de profil et cette chauve-souris est utilisateur. Donc, nous avons une barre oblique utilisateur. Nous avons maintenant besoin d'obtenir l'UID d'un utilisateur spécifique. Nous allons obtenir cela de l'ancien objet Firebase et obtenir l'utilisateur actuel, obtenir UID. Et maintenant tout ce que nous avons à faire est d'écrire une image de profil. Nous sommes donc là. Et pour mettre enfin cette URL, nous allons juste définir la valeur et nous allons écrire URL. Alors maintenant, exécutons l'application et voyons si elle fonctionne ou non. Ouvrons le profil. Eh bien, c'est maintenant télécharger l'image. Cliquez sur télécharger la photo. Et quand l'image est téléchargée, nous avons notre image ici. Alors pourquoi on a de la ficelle ici, pourquoi on a fait ça ? C' est parce que plus tard, nous allons gonfler notre vue d'image du profil de notre utilisateur avec cette chaîne. Nous allons donc utiliser la bibliothèque glide pour gonfler notre vue avec cette image. Et si vous copiez ce lien et le collez ici, vous pouvez voir que nous avons l'image. Alors maintenant, vous apprenez à télécharger une photo ou n'importe quel fichier à la Firebase et à l'associer à notre utilisateur. Donc, dans la vidéo suivante, nous allons voir comment récupérer une liste de tous les utilisateurs. Alors, je te vois. 6. Concevoir l'activité des amis - Fetching les utilisateurs de Firebase: Il est temps de concevoir l' activité de notre ami et de chercher une liste de tous les utilisateurs dans Firebase. Donc, nous aurons besoin de vue recycleur où nous allons mettre tous les utilisateurs. cette raison, nous aurons d'abord besoin de télécharger le composant de vue recycler. Revenons au codage ici. Pour l'arrière-plan de notre mise en page racine mettra dégradé. Ici, nous voulons barre de progression, qui sera 200 dp haut et large, mettra ID à barre de progression. Et nous allons le déplacer au centre. Et c'est tout. Maintenant, nous allons mettre vue recycleur. vue Recycler sera essentiellement correspondre à l'ID parent de celui-ci sera recycleur. Mais au départ, nous voulons que la vue recycler disparaisse parce que nous voulons afficher une barre de progression en premier. Et quand nous obtenons des données, nous cacherons cette barre de progression et nous montrerons la vue du recycleur. Maintenant, allons et créer un adaptateur pour notre vue recycleur va créer une nouvelle classe qui sera appelée adaptateur utilisateurs. Il va étendre l'adaptateur point de vue recycleur. Nous allons créer ici interclasse, qui sera notre titulaire de vue. Il est titulaire de l'utilisateur et il étend le support .edu. Ici, nous devons générer un constructeur. Et nous entendrons au type d'être de notre utilisateur Titulaire. Maintenant, nous devons implémenter des méthodes qui sont nécessaires pour se débarrasser des erreurs. A l'intérieur de ces adaptateurs, nous aurons besoin d'ArrayList des utilisateurs. Il sera appelé utilisateurs. Nous allons stocker les objets utilisateur utilisateurs ici. Nous aurons besoin de contexte. Et nous aurons également besoin d'une sorte d'interface pour l'événement click. Écouter sont en fait passer des événements de clic à l'activité de nos amis afin que nous puissions répondre aux événements onclick. Et nous entendrons créer une nouvelle interface qui sera appelée Sur l'écouteur de clic utilisateur. Il aura la méthode appelée sur l'utilisateur cliqué. Et nous allons passer la position de l'utilisateur qui est cliqué, position à l'intérieur de ces ArrayList. Donc, dans l'activité d'un ami, nous savons quel utilisateur est réellement cliqué. Nous allons maintenant ajouter cette interface ici. Et nous allons maintenant créer un constructeur avec ces trois paramètres. Nous allons maintenant créer un titulaire de vue. Il sera View, qui est égal à la mise en page inflateur du point de contexte gonfler. Et nous devons créer notre support utilisateur à l'intérieur de la mise en page. Alors maintenant, nous allons concevoir une ligne qui sera affichée dans l'activité de notre ami. La mise en page racine sera des cartes vous. Ce sera le contenu de l'emballage. Pour la hauteur. Nous donnerons quelques marges ici. Donc la marge horizontale sera de dix dB. La marge supérieure sera de dix dB. Donc, nous voulons avoir de l'espace entre les lignes utilisateur et le rayon de coin sera 40 DP, 14. Ici, nous aurons la mise en page linéaire qui sera assortie de remplissage de blé parent de 70 b. Nous fermerons l'étiquette de cette façon. Et ici, nous voulons avoir une autre vue de carte parce que nous voulons avoir notre photo de profil autour d'elle. Nous allons donc utiliser tarik avec vue Descartes et rayon de coin pour obtenir l'image au sol. Donc ici, ce sera l'image, qui contiendra notre profil comme nous allons chercher à partir de la Firebase. Idée de ce sera l'image prof et type d' échelle de cette image sera recadrée de sorte que nous pouvons avoir notre image recadrée à l'intérieur de l'arrière-plan cercle de ces vues de carte. En fait, la couleur d'arrière-plan sera la couleur primaire. Et nous avons également besoin d'avoir une vue de texte ici, qui affichera un nom d'utilisateur de notre utilisateur. Donc, nous allons le mettre ici ci-dessous jeter vue. Ce sera Wrap Content. Id, techs dx, t, nom d'utilisateur. La couleur du texte sera blanche. On va mettre une marge de gauche ici. Et Gravity sera au centre, sorte qu'il va maintenant revenir à notre adaptateur. Nous entendrons gonflé ces utilisateurs détenteurs mettra les parents et nous ne voulons pas l'attacher à écrit. Et nous retournerons un nouveau titulaire d'utilisateur avec cette vue. Ici, nous voulons obtenir la taille des points d'un utilisateur. Et dans le support de vue OnBind, nous allons définir les données sur notre mise en page que nous venons de concevoir. Donc, tout d'abord, laissez aller dans ce support de vue et mettez vue de texte et d'image que nous venons d'ajouter dans notre fichier XML. Donc, ici, nous allons initialiser ces noms d'utilisateur TXT. Donc, c'est la vue de texte, et maintenant nous devons initialiser cette vue d'image. Et sur la liaison vous méthode de support est appelé lorsque nous voulons gonfler les données dans notre mise en page. Donc, nous allons nous référer à ceux-ci. Le nom d'utilisateur. Nous allons définir le texte aux utilisateurs point obtenir la position, point obtenir le nom d'utilisateur. Faisons un point-virgule ici. Si tu ne l'as pas fait. Si vous vous demandez maintenant comment le gonfler, cette vue d'image avec image de profil, nous devons utiliser glide. Ouvrez donc votre navigateur Web et recherchez la dépendance glide. Alors ouvrez ce lien et copiez ceux pour revenir au studio Android. Et ici, il suffit de le coller et de cliquer sur synchronisation. Maintenant, revenons à l'adaptateur et référez-vous à cette charge de point contextuel twit glide. Pour obtenir l'URL de l'image, nous devons faire référence aux utilisateurs ArrayList. Nous obtiendrons l'utilisateur spécifique, la position et nous obtiendrons l'image du profil. Si vous, si vous ne vous souvenez pas, c'est le métal que nous faisons référence. Donc, nous le récupérons essentiellement à partir de l'objet utilisateur, qui est dans Firebase. Ici, nous allons spécifier quelle image sera gonflée au cas où l'erreur se produirait. Donc, cette image sera ces images. Maintenant, nous devons mettre un détenteur de place. Et il est, Je crois qu' il n'y a pas d'erreur, mais l'image n'est pas récupérée parce qu'elle n'existe pas. Ou si l'URL n'est pas valide. On va mettre la même image. Et enfin, nous allons le gonfler en vue de l'image de point de support. Alors c'est tout. Notre adaptateur est fini. Revenons à l'activité de l'ami et L. Dans l'activité France, nous devons déclarer vue recycleur. Nous aurons besoin tableau une liste d'utilisateurs. Et puis l'adaptateur utilisateur de barre de progression que nous venons de créer. Adaptateur utilisateur point OnClickListener. Nous faisons donc référence à l'interface que nous avons mise ici. Maintenant, dans la méthode onCreate, nous allons initialiser certains d'entre eux. Nous allons donc initialiser la barre de progression. Utilisateurs ArrayList, vue recycleur. Et sur l'écouteur de clic utilisateur sera égal à nouveau point d'adaptateur d'utilisateurs sur le nouvel utilisateur clic écouteur. Nous avons oublié de définir l'écouteur d'échantillonnage sur notre article. Et nous le ferons ici dans ce constructeur. Donc, nous allons ici juste dire point de vue d'élément setOnClickListener, nouveau onClickListener. Et ici, nous allons les appeler sur l'utilisateur cliqué, comme ceci. Sur l'utilisateur cliqué et obtenir la position de l'adaptateur. Donc, nous nous référons à cette interface, à ces utilisateur clic écouteur. Et parce que l'activité des inférences, nous allons passer cet écouteur de clic au constructeur de notre adaptateur. Lorsque nous cliquons ici quelque chose, ceci ici sera déclenché et nous saurons que l'utilisateur est cliqué. Donc, nous allons pour l'instant mettre un message de toast qui dira tapé sur l'utilisateur. Et nous allons obtenir l'utilisateur par cette position, et nous allons obtenir le nom d'utilisateur de cet utilisateur. Maintenant, nous allons devoir chercher les utilisateurs une manière ou d'une autre et nous allons créer une nouvelle méthode pour, à cet effet. Nous ferons référence au point de base de données Firebase GetInstance obtenir à l'utilisateur de référence. Et nous ajouterons. Un écouteur pour un événement unique, comme ça. Donc, ici, nous allons utiliser pour la boucle pour obtenir nos utilisateurs. Donc, pour l'instantané de données, dans cet instantané, point obtenez des enfants. Fondamentalement obtenir les enfants nous donnera une liste de ces éléments. Donc, ce sera les premiers enfants, ce sera les deuxièmes enfants dans cette boucle. Donc, nous allons ajouter ces enfants, mais nous devons obtenir la valeur et cette valeur sera objet est lui-même. Donc, de cette façon, quand ces Tout d'abord obtient en boucle, Première fois, nous aurons cet objet utilisateur. D' ici. La prochaine fois, nous aurons celui-ci, et ainsi de suite. Lorsque cela est terminé, nous allons créer des utilisateurs adaptateur, blé, utilisateurs ArrayList. Nous cliquerons sur l'écouteur qui est spécifié ici. Et l'activité est celle-ci. Voyons donc si la commande est correcte. Donc nous devons changer de place ici. Ce sera comme ça. Maintenant, nous voulons définir le gestionnaire de mise en page de notre vue recycleur à gestionnaire de mise en page linéaire. Et nous allons définir l'adaptateur pour être celui-ci. Maintenant, ce que nous devons faire, c'est que nous devons définir la visibilité de la barre de progression sur le pistolet, et la visibilité de la vue du recycleur sur visible. Donc, lorsque nous ouvrons notre application, lorsque nous ouvrons cette activité, nous appellerons les utilisateurs get comme ceci. Alors exécutons l'application et voyons si cela fonctionne. Donc maintenant l'application est en cours d'exécution et vous pouvez voir que la barre de progression tourne car elle n'a toujours pas récupéré les données. Et une fois les données récupérées, progrès ont disparu et nous avons deux utilisateurs de notre base de données. Voyons maintenant comment implémenter le balayage pour rafraîchir quelque chose. Lorsque nous tirons, quand nous avons appelé click and pull de haut en bas, nous voulons récupérer les utilisateurs une fois de plus. Donc aussi, vous pouvez voir que lorsque nous cliquons sur l'utilisateur, nous avons un message de toast que nous avons mis ici. Donc, pour mettre en œuvre le balayage pour rafraîchir , nous devrons, nous devrons rechercher cela sur Google parce que c'est la bibliothèque. Si nous cliquons sur cela, nous pouvons trouver facilement. Code de mise en œuvre et qui sera mis en place Gradle. Nous allons mettre à jour ceci vers la dernière version et synchroniser. Maintenant. Maintenant, revenons à l'activité des amis. Et ici, nous devons utiliser ces balayages pour actualiser la mise en page. Et ce doit être la mise en page racine. Commençons donc à taper la mise en page d'actualisation par balayage. Et nous devrons déplacer notre mise en page de contrainte pour être en dessous. Donc, ce sera match_parent et il entourera tous ceux à l'intérieur. Mais la mise en page de contrainte elle-même sera entourée de balayage pour actualiser, avec la mise en page d'actualisation par balayage. Donc, ici, nous avons une erreur. Nous avons fait, Nous n'avons pas d'image réelle parce que o ici juste injecté ces mise en page de rafraîchissement 5p et Android Studio n'est pas encore prêt, mais croyez-moi cela fonctionne. Définissons un ID ici pour que nous puissions faire référence à l'activité des inférences, écoutons déclarer, survivre, actualiser la mise en page. Nous allons l'initialiser ici. Et nous allons mettre sur rafraîchir l'écouteur. Fondamentalement, quand nous avons tiré de haut en bas, ce métal ici sera déclenché. Et ce que nous allons faire, nous appellerons à nouveau obtenir les utilisateurs. Mais voyons ce qui se passera si nous exécutons l'application dès maintenant. Si nous tirons comme ça, il commencera à tourner indéfiniment. Et le, nous avons des valeurs dupliquées ici. Donc, pour résoudre le premier problème avec la rotation indéfinie, après l'appel de cette méthode, nous devons définir la mise en page d'actualisation de balayage, définir l'actualisation sur false. Et maintenant, il va arrêter de rafraîchir après que nous l'avons tiré. Mais pour empêcher ces données de dupliquer. Ici, nous devons d'abord effacer toutes les données de notre base de données d'utilisateurs. Parce que rappel obtenir les utilisateurs, nous disons que c'est que nous ajoutons simplement notre liste d'utilisateurs avec les mêmes données. Alors maintenant, quand nous exécutons l'application, elle sera corrigée. Alors voyons. Ok, alors tirons maintenant et vous pouvez voir que tout fonctionne comme prévu. Dans la vidéo suivante, nous allons travailler sur l'activité des messages, et nous allons enfin voir comment envoyer des messages d'utilisateur à utilisateur. 7. Messagerie - ChatApp final: Il est maintenant temps de créer une activité de message. Alors, allons ici et créer une nouvelle activité vide. Donnons un nom à l'activité du message. Cliquez sur Terminer ou appuyez sur la touche Entrée. Et nous allons d'abord concevoir XML. fond sera dégradé. Nous allons mettre la disposition linéaire ici, qui sera parent correspondant, et la hauteur sera 75 dp. Donc, ce que nous voulons faire avec cette LinearLayout, et fondamentalement nous voulons que ces dispositions linéaires soient à la place de cette barre d'outils ici. Donc, tout d'abord, nous devrons supprimer ces barres d'outils ici. Pour cela, nous devrons définir un nouveau style ici. Ce style sera le style. On dit barre d'outils. Le parent sera en fait celui-là. Les couleurs seront les mêmes que les couleurs de cette équipe. Mais la différence est que nous ne voulons pas de barre d'action. Maintenant, dans le fichier manifeste, ici, nous allons appliquer. Et cette équipe que nous venons de créer. Donc maintenant pour actualiser ces mises en page, tout ce que vous devez faire est de cliquer ici et de cliquer sur forcer l'actualisation de la mise en page. Notre mise en page n'est toujours pas mise à jour pour une raison quelconque, probablement à cause de certains bugs dans Android Studio. Mais si nous revenons à l'activité des amis, commençons cette activité de message pour voir si elle n'a vraiment pas ActionBar, ou si elle est dans ceci, ou c'est comme dans cet aperçu. Donc, nous allons juste l'ouvrir à partir d'ici quand nous cliquons sur un utilisateur. Alors exécutons l'application. Si nous cliquons sur l'utilisateur, nous voyons qu'il n'y a pas de barre d'outils comme prévu. Mais pour une raison quelconque, Android Studio est buggé. Ainsi, vous pouvez essayer avec la fermeture et l'ouverture d'Android Studio. Encore une fois si cela vous arrive aussi. Donc je vais travailler comme ça parce que ça ne me dérange pas trop. Je sais que ça fonctionnera bien. Donc je vais continuer. On travaille sur ça. Donc, l'arrière-plan de ces LinearLayout sera la couleur secondaire. Son orientation sera horizontale. Et je vais devoir le fermer de cette façon parce que je veux mettre quelques articles ici. Ces éléments seront en mode carte. Nous avions 55 DP pour la largeur et la hauteur. La gravité sera au centre. Et ici, je veux une vue d'image, qui sera apparié parent. Et cette image sera essentiellement l'image de profil de l'utilisateur, qui discute avec nous. Nous allons ajouter Corner Radius à 44 DP, par exemple, pour le rendre arrondi. Id de la barre d'outils de l'image. Et le type d'échelle sera centré culture. Par défaut, l'image source sera celle-ci. Donc nous pouvons le faire de cette façon. Aussi. À côté de ces images de profil, nous voulons avoir un texte pour vous, qui montrera le nom d'utilisateur de l'utilisateur que nous discutons avec lui. Donc, nous pouvons être enveloppés contenu. Nous allons ajouter une marge à gauche, et nous le ferons au centre. Vous pouvez également voir sur ce plan, où il sera positionné. Maintenant, nous devons ajouter l'ID fiscal, qui sera TXT, en discutant avec, par exemple. Maintenant, nous devons concevoir cette pièce ici. Nous allons donc mettre une barre de progrès qui sera de 200 dp. Il sera centré au milieu. Nous allons le contraindre. Nous allons le contraindre comme ça. L' ID de celui-ci sera des messages de progression. Nous devons mettre la vue du recycleur ici aussi, qui sera 0 dP. Large et grand parce que nous allons le contraindre plus tard à certains ID de composant de celui-ci sera des messages de recyclage. Et en dessous de ce recycleur, nous voulons modifier le texte. Mettons une largeur aléatoire pour l'instant parce que nous allons également contraindre que quelque chose ID sera texte edD. Et pour l'instant ce sera une contrainte comme celle-ci. Nous devons donner un peu d'arrière-plan, un arrière-plan personnalisé à ce texte d'édition. Et nous allons le créer ici. Donc, nous allons mettre, nous l'appellerons entrée de message, arrière-plan. Ce sera la forme. On aurait la couleur unie de l'érudit. Nous allons ajouter un rayon à 13 dp. Nous appliquerons ceci. Donc, nous aurons également besoin d'une vue d'image ici, qui sera utilisé pour envoyer des messages. Nous allons donc créer un atout vectoriel pour cela. Cliquons et recherchons le sens. Donc ce sera celui-là. L' image de sable sera le nom. Et finir. Maintenant, nous allons mettre ici cette vue d'image avec 40 dB dimensions. Nous allons le déplacer ici. Nous devons mettre la source de cette image pour être image de sable. Donc, nous allons le contraindre comme ça. Maintenant, nous allons contraindre le texte d'édition à cette vue d'image. Maintenant, pour la largeur, nous allons mettre 0 pour la hauteur. Ce sera une chose intéressante. Donc, nous allons laisser cette hauteur pour être envelopper contenu. Mais nous allons définir la hauteur minimale, ce texte d'édition à 45 dp, et la hauteur maximale sera de 100 dB. Alors, qu'est-ce que ça veut dire ? Cela signifie que cet EditText ne peut pas être inférieur, peut être inférieur à 45 dp. Et lorsque nous commençons à taper des messages, il sera développé car ces attributs ici est le contenu enveloppé. Une fois en expansion. Atteindre 100 dp. Il ne sera plus étendu. C' est pourquoi nous utilisons la hauteur minimale et maximale. Rembourrage vertical sera dix dp et rembourrage horizontalement et B sera 20 db. Ce que nous devons faire maintenant, c'est de fixer la marge au bas de la page à 10 dp. Et aussi, nous allons mettre la marge inférieure à cette vue d'image à quelque chose comme ça. Ainsi, vous pouvez également le modifier un peu afin que vous puissiez mettre des marges horizontales à neuf DP, par exemple, pour obtenir ce look. Ou comme vous le souhaitez, vous pouvez même développer. Vous pouvez même augmenter ce rayon de coin pour réaliser quelque chose comme ça. Revenons maintenant à cette vue recycleur. Nous voulions que cette vue de recycleur soit une contrainte en bas à cela et que le haut devrait être ici. Donc, nous pouvons maintenant changer la largeur de ces vues recycleur pour correspondre au parent. Et ici, nous aurons des messages. Mais au départ, la visibilité sera disparue. Parce que lorsque nous recevons les messages, nous allons l'étendre et nous allons cacher la barre de progression. Alors maintenant, exécutons l'application et voyons à quoi elle ressemble. Ouvrons ça. Et c'est la mise en page. Il le fera, il tournera pour toujours parce que nous n'avons aucune logique dans notre activité de message dans le code Java. Nous allons donc travailler là-dessus. Ouvrons donc l'activité de message et initialisons tous les composants. Donc, nous avons une vue recycleur. Ensuite, nous avons EditText pour entrer un message. Nous avons TextView. Ce vin ici. Nous allons le nommer dxdy, en discutant avec. Nous aurons une barre de progression. Nous allons maintenant initialiser tous ces éléments. Ma, nous allons initialiser le texte ADT. Je crois. C' est le bon, alors oui. Maintenant, textez à vous. Et barre de progression. Donc c'est celui-là. Maintenant, ce que nous devons faire est que nous devons créer un objet de message. Donc, l'objet message aura les attributs suivants. Expéditeur, qui sera chaîne. Il aura le récepteur de message et le contenu du message. Donc, nous allons maintenant créer un constructeur. Créons des getters et setters. Et créons un constructeur vide à cause de Firebase comme ceci. Donc, ici, nous aurons aussi ArrayList de messages. Nous allons l'initialiser ici. Nous avons oublié d'ajouter cette vue d'image ici. Donc, nous allons le faire maintenant. Et nous allons l'initialiser ici. Nous avons également cette image pour envoyer des messages. C' est celui-là. Donc, il va changer son ID pour le message d'envoi IMG. Changez ceci ici aussi. Et nous allons l'initialiser ici. Maintenant, nous devons retourner à l'activité de l'ami. Et lorsque nous cliquons sur un utilisateur particulier, nous supprimerons ce message de toast. Et ce que nous voulons faire, c'est que nous voulons commencer l'activité Message, mais nous devons passer quelques éléments ici aussi. Donc, nous allons mettre un nom d'utilisateur supplémentaire de, disons, un compagnon de chambre. Parce que fondamentalement, nous avons des salles de chat. Vous verrez comment nous créons le plus tard et ce sera fait, disons. Ce sera users.js encore obtenir la position et obtenir, obtenir le nom d'utilisateur de leur colocataire. Parce que lorsque nous récupérons la liste des utilisateurs, lorsque nous cliquons sur un utilisateur particulier, nous voulons transférer son nom d'utilisateur à notre activité de message. Fondamentalement, si vous voulez discuter avec John, quand nous cliquerons sur John, John, nom d'utilisateur sera transféré ici. Et nous serons en mesure de mettre ce nom d'utilisateur ici, par exemple. Mais nous allons d'abord mettre ici toutes les données dont nous avons besoin. Nous avons aussi besoin de l'e-mail du colocataire. Et nous allons l'obtenir comme ça. Ensuite, nous allons mettre l'image de colocataire. Et nous voulons avoir notre propre image. Et maintenant avec la question comment obtenir notre propre image. Donc, nous allons entendre la variable de chaîne spécifiée, qui sera mon image, URL. Et ici, quand nous récupérerons les données, nous définirons cette image. Et comment faire ça. Ici, nous devrons aller dans ces get users méthode. Et après avoir fait tout cela, va simplement parcourir tous les utilisateurs que nous avons récupérés. Et nous allons vérifier si l'utilisateur dot get email est égal à Firebase doit dot, instance, point get utilisateur actuel. Nous recevons un email. Donc c'est notre email. Et ici, nous vérifions si notre email est égal à l'e-mail de l'utilisateur de la liste des utilisateurs. Et c'est parce que cette liste d'utilisateurs, la liste de cet utilisateur. Quand il est gonflé, il arrivera que aussi notre objet, notre propre profil sera stocké ici. Donc plus tard, ici, nous allons parcourir tous ces objets et nous voulons nous retrouver. Et si c'est le cas, mon image est égale à l'image de profil de cet utilisateur parce que c'est nous. Et nous entendrons revenir parce que si nous nous trouvons, nous ne voulons plus boucler. Pour économiser de la mémoire. Et à cause de la performance, nous n'avons pas besoin de lope plus tard si nous nous sommes déjà trouvés. Donc, nous allons mettre, donc nous allons mettre cette image aussi. Comme ça. Maintenant, nous pouvons revenir à notre, à notre activité de message. Ici, nous allons mettre quelques cordes. Ce sera, ce sera Nom d'utilisateur ou le colocataire. Ensuite, nous aurons bavarder avec l'utilisateur. Et nous aurons une pièce d'identité. Et vous verrez plus tard comment nous obtiendrons l'ID de la chambre et ce qu'il est réellement. Pour l'instant, nous allons d'abord obtenir le nom d'utilisateur ou un colocataire d'obtenir l'intention point getString supplémentaire. Et voici la ficelle. Maintenant, permet de discuter avec l'utilisateur. En fait, nous allons changer ceci en email d'un colocataire. Nous avons une faute de frappe ici, donc nous devons corriger ça aussi. Et maintenant, nous allons ici définir la largeur pour être Nom d'utilisateur, le colocataire. Donc, nous avons maintenant mis ce texte ici avec l'utilisateur avec lequel nous discutons. Donc maintenant est la partie difficile à saisir au début, peut-être que nous devons mettre en place une chambre fermée. Alors pourquoi nous faisons cela et ce que c'est. Donc, la logique de garder nos messages dans Firebase sera la suivante. Donc, ici à côté de l'utilisateur, nous n'avons pas appelé les messages. Et quand nous élargissons ce pas, nous aurons une pièce d'identité. Alors imaginons que nous avons Max et nous avons Alex, et ils discutent, qui l'un avec l'autre. Donc, nous avons fondamentalement besoin de générer une sorte d'identification, qui sera l'ID de la salle de chat. Pour Max et Alex, nous avons besoin d'une seule pièce pour deux utilisateurs différents. Et peu importe si Lx envoie des messages à max d'abord ou max à Alex, cette ligne doit être unique. Donc, pour générer ce type d'ID, la chose la plus simple à faire est de. Faire quelque chose avec les noms de nos utilisateurs. Donc, fondamentalement, notre identifiant de salon de chat devrait être composé des noms d'utilisateur des utilisateurs de cette salle de discussion. Alors, comment rendre ce nom unique ? Donc, fondamentalement, nous allons comparer un nom de nos utilisateurs et, par ordre alphabétique, nous allons générer ce genre de nom. Donc si on a Max et Alex, qui discutent, le nom de notre chambre devrait être comme des saccades. Et puis revenons à la Firebase, entendra avoir un message n'est pas. Il est préférable que je vous montre comment cela fonctionne sur l'application que j' ai créée avant d'enregistrer ces tutoriels. Donc, nous avons des utilisateurs et des messages pas et si nous élargissons celui-ci, ce sont essentiellement des salles de chat. Donc, quand nous aurons John Wayne ou avec Max communiquer, nous allons générer John Wayne max chat, et il contiendra des objets messages. Il contiendra des objets de message. Donc, chacun de ces objets sont des objets de message que nous avons créés, que nous avons créés auparavant. Nous avons donc l'expéditeur, destinataire et le contenu du message. Donc c'est comme ça. Si John a commencé la conversation en premier, nous aurons ce mal créé avec cet ID, qui est essentiellement le nom, qui est composé de deux noms d'utilisateur. Et si max commence la polarisation, tout d'abord, ce Romain sera aussi le même. De cette façon, nous évitons de dupliquer les pièces et nous économisons de l'espace dans la base de données. Donc, ça semble peut-être un peu difficile à saisir. Mais quand nous commencerons à le créer, et quand vous verrez comment il fonctionne réellement dans la pratique, ce sera beaucoup plus facile. Nous allons donc créer une méthode appelée setup chatter. Oh, donc nous entendrons parler de l'utilisateur. Nous aurons besoin ici d'obtenir UID de nous-mêmes. Nous allons ajouter écouteur pour un événement unique. Donc maintenant, quand nous allons à l'ID, nous allons obtenir le nom d'utilisateur de nous-mêmes. Ce nom d'utilisateur est. Snapshot dot obtenir les utilisateurs de valeur, cette classe, user_data classe en fait et obtenir le nom d'utilisateur. Donc, ici, nous avons notre nom d'utilisateur. Ensuite, nous devons comparer ce nom d'utilisateur avec le nom d'utilisateur de notre colocataire afin que nous puissions savoir quel nom ira en premier et quel nom ira en dernier. Et nous allons le comparer comme ça. Donc, si le nom d'utilisateur du roommate.com, mon nom d'utilisateur est supérieur à 0, cela signifie que notre nom d'utilisateur sera le premier et le nom d'utilisateur du colocataire sera le dernier. Donc, l'ID de la salle de chat sera égal à ceci. Sinon, si le nom d'utilisateur du colocataire compare à notre nom d'utilisateur est égal à 0, cela signifie que fondamentalement les noms d'utilisateur sont les mêmes et que leur ordre alphabétique sera le même. Il s'agit donc essentiellement de comparer. Si nous avons ici Mac par rapport à Alex, Il verra 0 avant un dans l'alphabet. Donc, au début, il peut voir que ce n'est pas le cas, est que nous allons retourner le nombre qui est supérieur à 0. Et nous obtiendrons ceci comme nom d'utilisateur. Ici. Cela arrivera si nous avons des utilisateurs, Alex, Alex. Donc, il va comparer a à a, puis il va comparer L2, l, et ainsi de suite. S' il détermine que tous ont le même ordre, il retournera 0. Donc, dans ce cas, peu importe comment nous les concaténons. On peut faire la même chose qu'avant. Et sinon. Cela signifie que l'ID de la salle de chat doit être composé comme ceci. Donc, votre nom d'utilisateur de l'utilisateur avec lequel nous discutons doit être le premier. Maintenant, ce que nous devons faire est que nous devons joindre le message, écouteur et il va également initialiser ces groupes. Jusqu' à présent, nous n'obtenons que les données et nous n'écrivons rien à Firebase. Et ce que je veux dire en attachant l'auditeur, c'est que nous devons mettre un auditeur à NADH spécifique. Et quand le message est changé ici, quand nous obtenons des données, nous devons notifier notre activité et il va récupérer de nouveaux messages. Donc nous allons créer cette méthode. Il obtiendra, il aura besoin essentiellement d'ID de chat. Nous allons définir et au moins dans nos deux messages plus chat id dot ajouter. Maintenant, nous avons besoin, nous sommes maintenant nous voulons obtenir un écouteur d'événement de valeur pas unique. Parce que si vous mettez unique, Nous ne serons pas informés des changements de données. Et de cette façon, le changement de données sera déclenché chaque fois qu'un nouveau message est reçu. Donc, quand nous recevons de nouveaux messages, Tout d'abord, nous voulons effacer les messages précédents. Et pour les instantanés de données. Dans l'instantané, obtenez des enfants. Nous allons ajouter un message à notre liste de messages. Donc, nous faisons une chose similaire comme nous l'avons fait quand nous avons ajouté des utilisateurs. Donc, après chaque fois que nous récupérons de nouveaux messages, nous voulons faire défiler jusqu'au dernier message qui est reçu. Donc, il est la taille de tous les messages minus1. Nous voulons donc garder les messages en bas. Donc, nous voulons, quand nous obtenons un nouveau message, vue recycler sera automatiquement défilé vers le bas. Vous verrez que dans la pratique, nous voulons définir la visibilité de notre vue recycleur sur visible et que la barre de progression doit être disparue. Maintenant, ce que nous devons également faire, c'est que nous devons créer cet adaptateur de messages. Donc, ici, ajoutons un point-virgule pour éviter les erreurs. Nous appellerons cette méthode. Après tous ces calculs avec l'ID de la salle de chat et mettre en place le salon de chat sera appelé lorsque nous ouvrons cette activité. Ok, maintenant nous devons créer un adaptateur de message. Nous allons donc créer une nouvelle classe. Il étendra l'adaptateur point de vue recycleur créera interclasse qui sera appelé porte-message. Il étend le titulaire de vue a été généré constructeur. Ici. Le type sera le détenteur du message. Et mettons en œuvre tous les métaux. Nous voulons avoir des champs, message ArrayList. Ensuite, nous voulons avoir l'image de l'expéditeur. Nous voulons avoir une image de récepteur, et nous voulons avoir un contexte. Alors pourquoi nous avons besoin de l'image de l'expéditeur et du destinataire parce que nous voulons avoir droit, juste à droite de nos images. À côté du ballon, qui contiendra le message. Et l'image de ponceuse sera sur le côté gauche de notre écran. Donc tu verras comment on le fera plus tard. Maintenant, créons un constructeur. Avec tout ça. Ici, nous voulons retourner la taille des messages. Et maintenant, nous devons créer un porte-message. Nous allons donc créer une nouvelle mise en page. Et nous allons diviser ici le code à l'intérieur. Nous allons mettre la disposition des contraintes. Il sera maillé parent et la hauteur sera Wrap Content. Id de celui-ci sera mise en page CC car c'est la mise en page de contrainte. A l'intérieur où vous avez appelé 35 DP, 35 jours faisceau, parce que nous voulons avoir une image arrondie de l'expéditeur et du destinataire. Donc, vous entendrez cette vue d'image. L' ID sera petit. Image de profil, type d'échelle sera recadrée centrée. Et la source. Nous pouvons dire que c'est par défaut celui-ci. Alors ajoutons Corner Rayon 35. Ajoutons également la marge horizontale. Maintenant, en dessous de la vue de la carte, nous voulons ajouter TextView, qui contiendra effectivement le contenu du message. Donc, il sera envelopper contenu avec marge horizontale de neuf DEP. L' arrière-plan sera celui-ci. On pourra le changer plus tard. Mettons quelques outils texte juste pour voir comment il est réel. Eh bien, c'est important. Mettons quelques textes aléatoires pour voir à quel point le message ressemble. Maintenant, vous pouvez voir que notre message va devenir blanc. Et pour corriger cela, nous devons également utiliser trois quid max largeur. Cette fois-ci, nous avons utilisé avec une hauteur maximale lorsque nous travaillions sur éditer le texte ici. Donc maintenant, vous voyez que notre message peut être plus large que cela. Nous allons ajouter un peu de rembourrage ici. Mettons ces draps. Et nous voulons mettre la marge supérieure. Pour que nous puissions avoir un espacement entre vos messages. Nous avons également besoin d'une pièce d'identité pour la vue de la cicatrice. Tu verras plus tard. Pourquoi ? Si vous vous demandez pourquoi ça ressemble à ça ? Pourquoi n'a-t-il rien modifié de contrainte ? Eh bien, c'est parce que dans l'exécution, nous voulons déplacer l'image de profil vers la gauche ou la droite. Et ces textes, selon qu'il est envoyé par nous ou par notre colocataire. Donc, si nous envoyons un message, nous voulons que l'image de profil soit ici et que le message texte soit là. Et si nous recevons un message, nous voulons que le profil soit ici et que le message texte soit à côté de lui. Donc, nous allons faire tout cela dans ces détenteurs de vue OnBind. Donc, tout d'abord, nous allons dans la mise en page de contrainte définie par le porteur de message. Affichage texte, qui sera message, ImageView, qui sera image de profil. Maintenant initialisez ces. Vérifions quelle était l'idée de ça ? On ne l'a pas ajouté. Donc, disons le contenu du message txt. Cette image est une petite image de profil. Et allons-y d'abord. Et voici créer notre vue et retourner nouveau porteur de message. Et cela, vous serez argument. C' est maintenant la partie intéressante. Dans le détenteur de vue OnBind, nous voulons d'abord obtenir un message. Et ce message sera pris à partir de cette ArrayList par position et obtenir du contenu. Et ici, nous devons manipuler avec des contraintes à travers le code Java. Alors, comment faire ça ? Nous devons utiliser la mise en page des contraintes. Et il est titulaire point LL, point de support, cc. Tout. Maintenant, nous voulons entendre le chèque. Si le message est, ne prenez pas position. N' oublie pas l'expéditeur. Est égal au point d'authentification Firebase getInstance point obtenir l'utilisateur actuel qui reçoit des e-mails. Cela signifie que nous sommes l'expéditeur de ce message et nous voulons les contraindre à droite. Alors voyons comment c'est fait. Nous voulons utiliser un jeu de contraintes, qui est égal au nouveau jeu de contraintes. Ensuite, nous devons cloner les contraintes définies mise en page de contrainte de clone de points, qui est, qui est cette contrainte, cette ligne entière, fondamentalement. Pour que nous puissions avoir des informations sur les contraintes en ce moment. Ensuite, nous voulons effacer les contraintes de la vue de la carte. Alors vérifions quelle vue de carte est cela. Nous voulons dégager de ce point de vue de la garde. Donc, nous devons utiliser ces ID en fait, nous voulons effacer les contraintes entre cette vue de carte de profil. Du côté gauche. Nous voulons également effacer le contenu du message du côté gauche. Et nous voulons connecter la vue de la carte de son côté droit. 2d linéairement à la disposition de contrainte et à droite de contrainte ? Marge 0. Alors, qu'est-ce que ça veut dire ? Rendons les choses plus claires. Donc, si vous allez ici, cela signifie fondamentalement que nous avons tiré la contrainte d'ici à là. Donc, en d'autres termes, à travers ce code, nous avons fait cela. Donc E ont une contrainte écrite, droite, pour radier le parent. Donc, du côté droit de la vue de la carte au côté droit de la mise en page de contrainte avec 0 marges. Ensuite, nous voulons contraindre ces TextView à ces vues de carte. Et nous allons le faire en changeant cela pour le contenu du message correctement ? le côté droit de la vue de la carte de profil. Et maintenant, une fois que tout cela sera terminé, nous aurons fondamentalement ceci. Et c'est à ça que ça ressemblera. Alors annulons ces changements et nous devons ouï-dire. Les contraintes définissent un point s'appliquent à la mise en page des contraintes. Sinon. Maintenant, cela signifie que nous ne sommes pas l'expéditeur du message. Nous avons reçu le message. Et nous voulons faire des choses différentes. Alors copions tout ça. Nous voulons faire le contraire. Donc, ici, nous allons effacer les bonnes contraintes, celles qui sont fixées ici. Fondamentalement, nous avons mis de bonnes contraintes ici. Ensuite, ici, nous voulons définir des contraintes de gauche au lieu de droite. Mais ici, nous voulons mettre de gauche à droite, parce que ce que nous voulons maintenant atteindre est ceci. Donc, côté gauche de ce texte à droite de la vue de la carte. Maintenant, nous devons mettre, nous devons gonfler l'image en utilisant glisse. Et ici, nous allons gonfler l'image centrale. Erreur va, va gonfler. Cette image. Joue en entier. Le titulaire sera également cette image. Et nous allons permettre aux Ds dans l'image de profil de point de support. Nous ferons la même chose ici, mais au lieu de l'image de l'expéditeur, nous voulons gonfler l'image du récepteur. Alors c'est tout. Revenons maintenant à l'activité du message. Et ici, à l'intérieur de la méthode onCreate, nous voulons initialiser un adaptateur de message. Mais d'abord, déclarons-le ici. Donc, ce que nous devons passer est Messages ArrayList. Nous devons mettre l'image Sander, que nous obtiendrons de GetInt et point obtenir chaîne supplémentaire. Revenons à l'activité de l'ami et à l'image de colocataire. Fondamentalement, mes images en fait l'image de l'expéditeur et l'image du récepteur est l'image de colocataire. Maintenant, nous devons mettre en contexte. Ce sera le cas. Activité du message. C' est ça. Maintenant, nous avons des erreurs parce que nous devons séparer ceci comme ça et assurez-vous que vous mettez qu'après avoir initialisé les messages, nous voulons aussi maintenant gonfler l'image à la barre d'outils ici. Donc nous allons faire ça comme ça. Donc c'est l'image de sa colocataire. Si je ne me trompe pas, le détenteur sera celui-ci. L' erreur sera celle-ci. Et nous allons les charger dans la barre d'outils d'image. Donc, ce que nous devons faire d'autre est ici, après avoir obtenu des messages avec succès, nous devons notifier l'adaptateur. Ce jeu de données a changé. Alors maintenant, lançons l'application et voyons ce qui se passe. Cliquez maintenant sur Alex, Qui est en passant, US. Et pour une raison quelconque, on ne voit pas d'image ici. Alors écoutons. Lx a une photo. Et ici, nous avons une faute de frappe et parce que et c'est pourquoi nous n'avons pas l'image appropriée ici. Alors exécutons à nouveau l'application. Alors, cliquez sur Alex. Vous pouvez voir que nous avons une image ici. Ça marche bien. Définissons une sorte de message. Nous avons oublié de setOnClickListener sur ces vues d'image ici. Donc, nous devons d'abord les accepter, ok, alors nous allons mettre onClickListener sur cette image envoyée. Et lorsque nous cliquons sur ce message sera envoyé de cette façon. Donc Firebase Database GetInstance obtenir référence. La référence est le message est plus l'ID de la salle de chat. Nous utilisons maintenant dot push parce que nous voulons générer une chaîne aléatoire, aléatoire comme, comme celle-ci ici, comme ceux-là. Et puis nous allons définir la valeur sur cette chaîne aléatoire. Nouveau message, Firebase, ot, la GetInstance, obtenir l'utilisateur actuel, obtenir un e-mail. Maintenant, nous devons mettre l'e-mail du destinataire. Cet e-mail du destinataire est tiré de l'activité des amis. C' est un email de colocataire. Donc, ici, nous le recevons ici et nous le référons simplement comme ceci. Et le contenu du message sera extrait de ce texte d'édition. Alors c'est tout. Et après avoir envoyé le message, nous voulons vider notre texte d'édition afin que nous puissions commencer à taper un nouveau message. Maintenant, la dernière chose est que nous devons définir cet adaptateur à ces vues recycleur. Et cette vue recycleur doit avoir un gestionnaire de mise en page. Maintenant, exécutez l'application et voyez ce qui va se passer. Donc, nous allons maintenant commencer à discuter avec Max. On va dire bonjour. Et ici, nous avons quelques problèmes avec l'interface utilisateur. Voyons comment ça s'est mal passé. Ouvrons l'adaptateur, et vérifions ces contraintes ici. Donc ici, nous étions censés dire à gauche parce que nous voulons connecter ce message sur le côté gauche de la carte vous. Alors exécutons l'application une fois de plus. Et maintenant ici, vous pouvez voir que nous avons des messages pas chat ID est Alex Max et objet message est celui-ci. Alors maintenant, quand nous courons à nouveau, quand nous ouvrons la conversation avec Max, nous voyons ce message. On peut envoyer même des emojis. Vous pouvez voir maintenant que nous avons un autre problème. Et c'est parce que dans le porteur de message, ce penser aurait dû être enveloppé contenu. Alors exécutons App une dernière fois. Ainsi, vous pouvez voir à quel point il devient compliqué de créer une application comme celle-ci. Il y a beaucoup d'essais et d'erreurs. Mais à la fin, le plus important est de comprendre pourquoi nous avons fait quelque chose comme nous l'avons fait. Maintenant, nous pouvons commencer à envoyer d'autres messages. Ça marche très bien. Alors exécutons cette application sur un appareil de plus pour tester comment il se comporte patinage avec un autre utilisateur. Enregistrez un utilisateur ici. Inscris-nous. Commençons à discuter avec Alex. Ici. Si nous actualisons les utilisateurs et la conversation OpenGL, nous voyons que nous avons un message de Jill et nous pouvons discuter. Ça marche très bien. Si vous vous demandez comment faire une notification. Si nous obtenons un nouveau message ou fondamentalement si notre application est fermée et nous envoyons un message, comment faire savoir à l'utilisateur qu'il y a un nouveau message. Nous utilisons les notifications push dans ce but et c'est le sujet. Pour d'autres conférences. Nous l'apprendrons aussi. Mais pour l'instant, c'est un sujet un peu avancé parce que nous avons besoin de connaître les notifications en général, et nous avons besoin de connaître les serveurs et les API. Je crois que vous avez aimé créer cette application. C' était un peu difficile avec beaucoup d'erreurs. Mais si vous avez des questions ou des doutes, je suis là pour répondre à toutes vos questions. Alors c'est tout pour moi. Rendez-vous à la prochaine conférence.