Aller au contenu principal

Accès réseau client et asynchronisme

Avant la séance : théorie (2h)

Nous allons utiliser les recettes suivantes :

Séance 1

On expliquera comment envoyer une requête HTTP aux web services des exercices et réceptionner le résultat. On utilisera RETROFIT.

On réitérera l'importance des tests et des points d'arrêt en appels synchrones et asynchrones.

On parlera des cas où on a besoin de récupérer des données une seule fois à l'ouverture de la page ou si on a besoin de faire des mises à jour régulièrement.

Séance 2

On expliquera comment démarrer le serveur du TP2:

  • dans IntelliJ, ouvrir le projet KickMyB-Server
  • depuis powershell, se placer dans le dossier du projet puis .\mvnw spring-boot:run
  • accéder au serveur à l'URL http://localhost:8080/ depuis le poste de travail
  • accéder à l'URL http://10.0.2.2:8080/ depuis l'émulateur Android

On expliquera à quoi servent les différentes classes de transfert dans la bibliothèque de DTO ou classes de transfert. On montrera comment inclure la bibliothèque dans votre projet:

  • Ajout du repository Jitpack (permet d'accéder à un projet Github sans qu'il soit déployé sur un repo Maven)
  • Ajout de la librairie et format de la dépendance : 'com.github.compte-github:repo-github:hash-du-commit'
  • Exemple : implementation 'com.github.departement-info-cem:KickMyB-Library:9298b57'
Séance 3

Souvent, les classes de modèle ont beaucoup de champs, car la base de données garde énormément d'information.

Mais pour plusieurs raisons (sécurité, espace, etc.), le client n'a pas besoin de toutes ces informations.

On utilise alors des classes de transfert (DTO) qui permettent de transférer seulement l'information utile entre le client et le serveur.

Exercices de la semaine

Exercice formatif​

En préparation de l'examen de la prochaine séance, assurez-vous de savoir effectuer des appels réseau avec Retrofit et d'afficher les résultats dans une interface graphique.

Exercice RetrofitSimple​

Créez un projet appelé RetrofitSimple. Le web service ici prend un nombre et retourne son double.

Vous devez démontrer un appel avec succès à ce web service dans une application Android depuis l'interface graphique.

Par exemple, un écran avec un OutlinedTextField pour le nombre et un bouton pour déclencher l'appel. Au retour de la valeur (doublée), celle-ci est affichée soit dans un texte sur l'écran, soit dans un SnackBar.

Exercice RetrofitComplexe​

Créez un projet appelé RetrofitComplexe. Le web service ici prend un nom et retourne un objet complexe (remplacez whippsie par votre prénom dans l'URL).

Vous devez démontrer un appel avec succès à ce web service dans une application Android depuis l'interface graphique.

Par exemple, un écran avec un Text qui affiche les données retournées par l'appel.

Exercice RetrofitListes​

Créez un projet appelé RetrofitListes. Le projet doit démarrer un écran coupé en 2 dans le sens de la hauteur. Chaque moitié est occupée par un LazyColumn qui sera peuplé par les appels suivants :

  • Webservice 1 renvoie une liste de Long. Chaque élément dans le LazyColumn est un simple champ texte où vous affichez la valeur du nombre.
  • Webservice 2 renvoie une liste d'objets complexes. Chaque item du LazyColumn doit afficher les 2 champs simples ainsi que la taille de la liste.

Exercice RetrofitEnvoiPost​

Créez un projet appelé RetrofitEnvoiPost.

Tu vas envoyer une requête

{
  "a": 100,
  "b": "gndsadsa",
  "c": [
    8,
    12,
    14,
    18,
    1998
  ]
}
  • le type de retour sera le même format que celui envoyé.

Tu peux afficher le résultat sur l'interface graphique du téléphone ou programmer directement un test unitaire synchrone.

Exercice RetrofitGithub​

Créez un projet appelé RetrofitGithub dans lequel vous créerez un service simple en GET sur l'URL https://api.github.com/users/departement-info-cem/repos.

Chaque élément du LazyColumn doit afficher les champs "name" et "description" ainsi qu'un bouton qui mène à l'URL (champ html_url) (doit fonctionner).

Une fois que ça fonctionne, appuyez sur votre bouton pour accéder à la page du cours 4N6-Mobile, cliquez sur le lien bleu info.cegepmontpetit.ca/4N6-Mobile/ et naviguez le site pour retrouver cet exercice-ci! ♻️

DTO - Exercice de compréhension​

Dans cet exercice, on vous donne la classe de modèle et on cherche les champs qu'on va mettre dans la classe de transfert (PersonneDTO).

L'interface graphique à droite montre les informations nécessaires à l'application.

Créez un fichier dto.md dans votre repo exercice pour garder votre réponse avec le format suivant :

# PersonneDTO
- ID: Long
- pipo: String (justification de pourquoi le champ est dans le DTO)
- etc.

Tinder 1

Tinder 2

DTO - Exercice de compréhension 2​

On reprend l'exercice précédent mais avec maintenant deux classes modèles. On cherche les champs qu'on va mettre dans la classe de transfert (CompteDTO) toujours avec la même interface graphique.

Créez un fichier dto2.md dans votre repo pour garder votre réponse avec le format suivant :

# PersonneDTO
- ID: Long
- pipo: String (justification de pourquoi le champ est dans le DTO)
- etc.

Tinder 3

Tinder 2