Appli android qui présente les mesures de l'Arduino sous forme cartésienne

Aujourd'hui, je vous propose de programmer, au moyen de MIT App Inventor 2, une appli android qui va représenter sous forme de graphique cartésien les données analogiques reçues via bluetooth depuis une carte Arduino.

La vidéo ci-dessous montre l'appli en action:  les données du graphique affiché en temps réel sur la tablette sont contrôlées par un potentiomètre relié à l'entrée A0 de la carte Arduino Uno.

Avant que vous vous imaginiez que je suis un inventeur génial, je tiens à préciser que mon point de départ pour ce projet est ce tuto sur le blog Gadgetas.  J'ai utilisé le programme App Inventor conçu par Augusto Valdez et j'y ai apporté quelques modifications.

Le circuit émetteur (Arduino)

Le circuit émetteur est essentiellement constitué d'un module bluetooth HC-06 branché à une carte Arduino.  Si vous préférez utiliser une autre carte, vous pouvez consulter mes précédents billets concernant l'utilisation du module HC-06 avec le STM32 Nucleo ou avec le MSP430 Launchpad.

L'utilisation d'un circuit intégré 4050 pour abaisser le signal logique qui va de l'Arduino vers le HC-06 est nettement conseillée, afin de ne pas endommager votre HC-06 (voir ici pour plus d'informations concernant le 4050).

Pour faire varier le signal analogique qui sera mis en graphique, j'ai utilisé un potentiomètre, qui pourrait bien sûr être remplacé par n'importe quel capteur analogique (photorésistance, thermistance) ou même par un capteur numérique sous réserve de quelques modifications à l'intérieur de nos programmes.

Les principales connexions sont:

• VCC du HC-06:  5 V de l'Arduino
• GND du HC-06 : GND de l'Arduino
• TXD du HC-06:  Rx de l'Arduino
• RXD du HC-06 : 4050 : Tx de l'Arduino 

Le sketch de l'Arduino

Rien de bien compliqué du côté de l'Arduino:  il se contente d'envoyer régulièrement l'état de son entrée A0.  Seule particularité digne de mention:  chaque message commence par le symbole "#".  Ce symbole sera utilisé par l'appli Android pour valider les messages reçus.

Programmation de l'appli android avec MIT App Inventor 2

Je suppose de votre part une certaine aisance avec MIT App Inventor 2.  Au besoin, consultez mes précédents billets:  Introduction à MIT App Inventor 2 et Programmer une appli android pour communiquer en bluetooth.

Commençons en mode "Designer":  dans les propriétés de la fenêtre, assurez-vous de régler le paramètre "Orientation écran" à "Paysage".  C'est l'orientation la plus appropriée pour la plupart des graphiques cartésiens, et nous n'aurons pas à gérer les changements d'échelle qui seraient occasionnés par un passage du mode paysage vers le mode portrait, ou inversement.  J'ai aussi réglé le paramètre "Alignement horizontal" à "Centrer: 3".

Cette fenêtre comportera 9 composantes d'interface:

A) Un rectangle "Arrangement horizontal", qui sert à garder les éléments B, C et D sur une même ligne.

B)  Un "Label" que j'ai renommé "StatutConnexion". Un message indiquant si la connexion bluetooth est active ou non apparaîtra dans ce label.

C) Un "Sélectionneur de liste" que j'ai rebaptisé "BoutonConnecter".  Lorsque l'utilisateur cliquera sur cet élément, on lui présentera la liste des périphériques bluetooth disponibles.  Le paramètre "Texte" du sélectionneur de liste a été modifié pour contenir le mot "Connecter".

D) Un "Bouton" qui servira à interrompre la communication bluetooth avec l'Arduino.  J'ai remplacé son nom par "BoutonDeconnecter" et son paramètre "Texte" par "Déconnecter".

E) Un "Cadre" dans lequel notre programme dessinera le graphique.  Je lui ai laissé son nom par défaut "Cadre1", mais j'ai réglé son paramètre "Hauteur" à "Remplir parent..." , son paramètre "Largeur" à "Remplir Parent", la "Largeur de ligne" à 2.0 et la "Couleur de dessin" à "Rouge".

F) Un deuxième rectangle "Arrangement Horizontal" complètement vide, qui n'est qu'une astuce pour me réserver une marge dans le bas de la fenêtre.  Je trouvais ça plus joli.  J'ai réglé sa hauteur à 20 pixels.

G) Un "Notificateur" qui présentera un message d'alerte si bluetooth n'est pas activé sur l'appareil.

H) Un "Client Bluetooth" nécessaire pour la communication bluetooth.

I) Une "Horloge" qui détermine le moment de consulter les messages reçus via bluetooth.  Dans les paramètres de l'horloge, réglez IntervalleChronomètre à 100 millisecondes.

Voici, pour récapituler, la liste des composants de la fenêtre.  J'ai laissé les noms par défaut, sauf pour le contenu du premier arrangement horizontal:

Passons maintenant en mode "Blocs".  On définit d'abord trois variables globales:  "echelley" qui établit une relation entre la hauteur du cadre en pixels et la valeur analogique (entre 0 et 1023) reçue par bluetooth, "ancienx" qui est la position horizontale du dernier point tracé sur le graphique, et "ancieny" qui est la position verticale du dernier point tracé.

Au début de l'exécution du programme, on vérifie si bluetooth est activé sur l'appareil, on ajuste l'échelle en fonction de la hauteur du cadre, et on appelle la procédure qui trace le quadrillage.

Notez que pour la variable echelley, j'ai divisé la hauteur du cadre par 1050 plutôt que 1023 pour me réserver une petite marge libre au bord du cadre.

Lors du clic sur le sélectionneur de liste, on présente la liste des périphériques bluetooth disponibles.  Suite à un choix dans cette liste, on se connecte au périphérique choisi par l'utilisateur.

On interrompt la connexion bluetooth si l'utilisateur clique sur le bouton "Déconnecter".

C'est dans la routine d'horloge qu'on fait le gros du travail...voici une vue d'ensemble:

Faisons un zoom...

Toutes les 100 millisecondes, nous vérifions si nous avons reçu un message via bluetooth.

Si c'est le cas, nous extrayons la partie numérique du message.

Et nous traçons une droite joignant le point précédemment tracé et ce nouveau point.  Attention:  la coordonnée y du cadre est nulle en haut et de plus en plus grande à mesure qu'on descend, alors qu'on veut le contraire sur notre graphique.  C'est pourquoi la valeur de y est calculée de cette façon:

 y = hauteur du cadre - (echelley * mesure de l'Arduino)

(Je me suis gardé une petite marge de 2 pixels à gauche et en bas du cadre).

Il faut ensuite mettre à jour les variables qui contiennent les coordonnées du point précédent, et gérer le retour à gauche si on a atteint la limite droite du cadre:

Tel que son nom l'indique, la procédure "quadrillage" dessine un quadrillage dans le cadre (5 lignes horizontales, en fait). 

Puisque je vous aime bien, le programme complet sous forme de fichier .aia est disponible ici.

Yves Pelletier   (Twitter, Facebook)

Appli Android pour contrôler un moteur pas à pas par bluetooth (Arduino)

Vous désirez contrôler un moteur pas à pas par bluetooth au moyen de votre téléphone android? Ça tombe bien, c'est justement le sujet du billet d'aujourd'hui!

Côté récepteur, notre montage est constitué d'un moteur pas à pas bipolaire, d'une carte Arduino Uno, d'un module bluetooth HC-06, et d'un double pont en H L293D (un L298N aurait fait l'affaire aussi).

Côté émetteur, un appareil android qui exécutera une application que nous aurons nous-même conçue sur MIT App Inventor.

Cette activité suppose certaines connaissances préalables.  Si ce n'est pas déjà fait, je crois qu'il serait préférable de lire mon introduction au module bluetooth HC-06 avec Arduino, mes explications détaillées sur la façon de piloter un moteur pas à pas avec un L293D, mon introduction à la programmation d'une appli android avec MIT App Inventor 2 et, finalement, la programmation d'une appli androit pour communiquer en bluetooth avec MIT App Inventor 2!

Voici une vidéo du dispositif en action:

Connexions du L293D

Le circuit intégré L293D est branché de la même façon que dans ce précédent billet consacré au pilotage d'un moteur pas à pas.

• Les broches 1, 9 et 16 du L293D sont branchées à la sortie 5 V de la carte Arduino.
• Les broches 4, 5, 12 et 13 constituent la masse du L293D.  On doit y brancher la masse (GND) de l'Arduino, et la borne négative de la source d'alimentation du moteur pas à pas.
• La borne positive de l'alimentation du moteur pas à pas est branché à la broche 8 du L293D.
• Le moteur pas à pas est branché aux borches 3, 6, 11 et 14 du L293D
• Les broches 2, 7, 10 et 15 du L293D sont branchées respectivement aux sorties 8, 9, 10 et 11 de l'Arduino.

Connexions du module bluetooth HC-06 et du CI 4050

Le module bluetooth HC-06 est conçu pour fonctionner à un niveau logique de 3,3 V.  Pour cette raison, l'utilisation d'un circuit intégré 4050 est conseillée pour abaisser le signal de 5 V émis par l'Arduino.

Voici les connexions du 4050; pour plus d'explications, référez-vous au billet sur l'utilisation d'un 4050 pour abaisser un niveau logique.

• Broche 1 du 4050:  sortie 3,3 V de l'Arduino
• Broche 2 du 4050:  entrée RXD du module HC-06
• Broche 3 du 4050:  sortie Tx de l'Arduino (pin 1)
• Broche 8 du 4050:  masse (GND de l'Arduino)

Le module HC-06, quant à lui, est branché de la façon suivante:

• Vcc du HC-06 --- sortie 5 V de l'Arduino
• GND du HC-06 --- GND de l'Arduino
• TXD du HC-06 --- Rx de l'Arduino (pin 0)
• RXD du HC-06 --- broche 2 du 4050

Vous pouvez bien sûr vous référer au billet Bluetooth et Arduino: le module HC-06 pour plus de détails.

Circuit complet

Voici donc le schéma complet, incluant la carte Arduino, le L293D, le 4050, le module HC-06 et le moteur pas à pas!

Sketch de l'Arduino

L'Arduino recevra par bluetooth un nombre entier situé entre 0 et 100.  Par défaut, on considère que la position angulaire initiale du moteur est 50.  À partir de cette position initiale, le moteur doit faire un demi-tour dans un sens pour atteindre la position 0, et un demi tour dans l'autre sens pour atteindre la position 100.




Réalisation de l'appli android avec MIT App Inventor 2

L'appli android comporte les boutons nécessaires pour établir une communication bluetooth, ainsi qu'un "ascenseur" que l'utilisateur déplace afin de faire tourner le moteur pas à pas à la position désirée.

L'interface comporte 8 éléments:

1)  Un rectangle "Arrangement horizontal", pris dans la catégorie "Disposition", qui permet de faire en sorte que les éléments 2, 3 et 4 seront disposés dans la fenêtre sur une même ligne horizontale.

2)  Un "Label" (disponible dans la catégorie "Interface Utilisateur").  Par défaut, ce label portait le nom "Label1", mais je l'ai renommé "StatutConnexion".  La mention "connecté" ou "déconnecté" s'affichera à cet endroit.

3)  Un "Sélectionneur de liste" (disponible dans la catégorie "Interface Utilisateur").  Lorsque l'utilisateur cliquera sur cet élément, la liste des appareils bluetooth disponibles s'affichera à l'écran. J'ai renommé cet élément "BoutonConnecter", et j'ai remplacé son texte par "Connecter".

4)  Un "Bouton" (disponible dans la catégorie "Interface Utilisateur") qui servira à interrompre la connexion avec l'Arduino.  J'ai renommé cet élément "BoutonDéconnecter", et j'ai remplacé son texte par "Déconnecter".

5)  Un deuxième "Label" (disponible dans la catégorie "Interface Utilisateur").  J'y ai inscrit le texte "Position".

6)  Un "Ascenseur" (disponible dans la catégorie "Interface Utilisateur").  Largeur:  80% de la fenêtre, valeur maximale:  100, valeur minimale:  0.

7) Un "Client Blutooth" (disponible dans la catégorie "Connectivité"), indispensable pour toute application qui communique avec bluetooth.

8)  Un "Notificateur" (disponible dans la catégorie "Interface Utilisateur"), qui permet d'afficher un message d'alerte si bluetooth n'a pas été activé sur l'appareil android.

Construction du programme

Passons maintenant en mode "Blocs".  Tout ce qui concerne le contenu le contenu de l'élément "Arrangement horizontal" est identique à ce que j'avais décrit dans le billet intitulé "Programmer une appli android pour communiquer en bluetooth":

Il ne reste plus qu'à gérer le comportement de notre ascenseur:  lorsqu'on le déplace, il envoie sa nouvelle position (un nombre situé entre 0 et 100) par l'entremise du client bluetooth:

Fichier .aia

Vous pouvez télécharger ici le programme complet:  Moteur_PAP.aia

Yves Pelletier   (Twitter, Facebook)

Appli Android qui présente graphiquement le signal mesuré par un Arduino

Supposons que vous avez branché un capteur à votre Arduino, qui est relié par bluetooth à un appareil android.  Si vous avez lu mon récent article sur MIT App Inventor et bluetooth, vous savez comment programmer votre propre application android pour qu'elle affiche en temps réel la valeur numérique reçue de l'Arduino.  Mais ne pourrions-nous pas afficher à l'écran une jauge qui montrerait le résultat d'une façon plus visuelle?

Aujourd'hui, je vous montre deux options permettant d'obtenir un tel résultat.

Montage Arduino

Nous utiliserons une fois encore un module bluetooth HC-06.  Le circuit 4050 abaisse le signal de 5 V de la sortie Tx de l'Arduino car le module bluetooth HC-06 est conçu pour recevoir des signaux logiques de 3,3 V.

Pour effectuer mes tests, j'ai branché un potentiomètre à l'entrée A0 de l'Arduino.  Bien entendu, vous pouvez remplacer ce potentiomètre par tout autre capteur analogique ou numérique (photorésistance, thermomètre, etc).

En résumant un peu:

• VCC du HC-06:  5 V de l'Arduino
• GND du HC-06 : GND de l'Arduino
• TXD du HC-06:  Rx de l'Arduino
• RXD du HC-06 : 4050 : Tx de l'Arduino 

Sketch Arduino

Le sketch de l'Arduino est d'une très grande simplicité:  la valeur de l'entrée A0 est lue et envoyée à intervalles réguliers.


Appli android version 1:  utilisation de Google Charts

Pour cette première version, je me suis inspiré de ce document sur le portail Eduscol.  Il est possible d'utiliser Google Charts pour générée une jauge dont l'aiguille indique la valeur désirée.

Par exemple, cet url affiche une image indiquant une valeur équivalent à 20% du maximum (cliquez-le, pour voir!):

http://chart.apis.google.com/chart?cht=gom&chco=00CC00,0000CC&chs=450x200&chd=t:20

Alors que celui-ci affiche une image indiquant une valeur équivalent à 75% du maximum:

http://chart.apis.google.com/chart?cht=gom&chco=00CC00,0000CC&chs=450x200&chd=t:75

Évidemment, pour que ça fonctionne, votre appareil android doit avoir accès à internet.

En mode "Designer", j'ai créé 10 composants d'interface (la plupart de ces éléments se trouvaient déjà dans le programme créé dans l'article Programmer une appli Android pour communiquer en bluetooth, que vous pouvez consulter pour plus de détails):

A)  Un rectangle "Arrangement horizontal", contenant les éléments  B, C et D.
B)  Un label renommé "StatutConnexion" qui indiquera sur l'Arduino est connecté ou non.
C) Un sélectionneur de liste renommé "BoutonConnecter", qui affiche le texte "Connecter".
D) Un bouton renommé "BoutonDéconnecter" qui affiche le texte "Déconnecter".
E) Un label renommé "Label_Pourcentage", qui affichera la valeur mesurée en %.
F) Une image renommée "Image_Jauge".
G) Un label renommé "Label_Tension", qui affichera la valeur mesurée en volts.
H) Une horloge
I) Un client_bluetooth
J) Un notificateur

Tout ça est résumé dans la zone "Composants" d'App Inventor:

En mode "Blocs", je passe très rapidement sur tout ce qui concerne la connexion et la déconnexion: c'est identique à ce que nous avions fait dans Programmer une appli Android pour communiquer en bluetooth (vous pouvez cliquer sur l'image pour l'agrandir):

La partie nouvelle, se trouve dans la partie "Quand Horloge1.Chronomètre".  À intervalles réguliers (500 millisecondes, grâce au réglage effectué à l'initialisation de la fenêtre), le programme vérifie si on a reçu un message par bluetooth en provenance de l'Arduino.

Si c'est le cas, il calcule un pourcentage qu'il affiche dans le label "Label_pourcentage", il utilise ce même pourcentage pour afficher l'image "Image_Jauge" appropriée à partir de Google Charts, et il calcule le résultat en volts, qu'il affiche dans le label "Label_Tension".

Petite précaution, toutefois:  pendant que notre application android travaille pour afficher la jauge, l'Arduino a parfois le temps d'envoyer plusieurs messages consécutifs.  La variable "messageRecu" contient alors plusieurs nombres.  Au cas où une telle chose survient, il faut donc séparer cette variable en une liste de nombre, et utiliser dans nos calculs le dernier élément de la liste.

Voici le résultat à l'écran de l'appareil android.  Ça fonctionne très bien pour des valeurs qui ne changent pas très rapidement.  Si vous tournez brusquement le potentiomètre, vous remarquerez probablement que le temps de réponse est un peu long.

Vous pouvez télécharger le programme complet sous forme de fichier .aia.

Appli android version 2:  jauge linéaire

Cette deuxième version ne fait pas appel à Google Charts.  J'utilise plutôt les possibilités graphiques d'App Inventor pour dessiner une jauge linéaire (genre "progress bar").

En mode "Designer", un seul des 10 composants est différent par rapport à la version 1: le composant "F" est maintenant un cadre plutôt qu'une image (un cadre est un rectangle dans lequel notre programme pourra tracer des formes géométriques).

A)  Un rectangle "Arrangement horizontal", contenant les éléments  B, C et D.
B)  Un label renommé "StatutConnexion" qui indiquera sur l'Arduino est connecté ou non.
C) Un sélectionneur de liste renommé "BoutonConnecter", qui affiche le texte "Connecter".
D) Un bouton renommé "BoutonDéconnecter" qui affiche le texte "Déconnecter".
E) Un label renommé "Label_Pourcentage", qui affichera la valeur mesurée en %.
F) Un cadre auquel j'ai laissé le nom par défaut "Cadre1"
G) Un label renommé "Label_Tension", qui affichera la valeur mesurée en volts.
H) Une horloge
I) Un client_bluetooth
J) Un notificateur

Votre liste de composants devrait donc avoir cette allure:

Je vous montre aussi les caractéristique du cadre "cadre1".  J'ai réglé la couleur de fond à gris, pour que le rectangle soit visible.  La hauteur est de 20 pixels, alors que la largeur représente 80% de la largeur de la fenêtre.  La largeur de ligne est de 20 pixels, et la couleur de dessin est bleu.  Pour fournir une indication visuelle du signal reçu via bluetooth, nous allons donc tracer une grosse ligne bleue aussi large que le rectangle gris.

Basculons maintenant en mode "Blocs".  Toute la première partie demeure identique à ce qu'elle était dans la première version (il s'agit de la gestion des connexions/déconnexions).

La différence se trouve à l'intérieur de la partie "Quand Horloge1.Chronomètre".  Dans "Appeler Cadre1.Dessiner ligne", nous indiquons les coordonnées des deux extrémités de la ligne bleue que nous désirons tracer.  L'extrémité gauche se trouve à la coordonnée horizontale 0 (l'extrême gauche du cadre), alors que l'extrémité droite se trouve à une position proportionnelle à la valeur que nous désirons représenter.  La valeur donnée à nos coordonnées verticales (10) représentent le centre vertical de notre cadre.

Voici le résultat à l'écran de l'appareil android:

Vous pouvez télécharger le programme complet sous forme de fichier .aia.

Yves Pelletier   (Twitter, Facebook)

Programmer une appli Android pour communiquer en bluetooth

L'objectif du tuto d'aujourd'hui est de réaliser, au moyen de MIT App Inventor 2, une application Android qui communiquera par bluetooth avec une carte Arduino.

Une application de ce genre pourrait permettre de contrôler de l'éclairage ou des moteurs (un robot!) au moyen de votre appareil Android, ou encore de lire au moyen de votre appareil Android l'état de capteurs externes branchés à l'Arduino.

Quelques préalables

Pour réaliser l'activité d'aujourd'hui, vous devez disposer d'un ordinateur sur lequel vous programmerez, d'un appareil android (smartphone ou tablette), d'une carte Arduino et d'un module Bluetooth HC-06.

Cette activité suppose que vous avez déjà un tout petit peu d'expérience avec MIT App Inventor.  Si ce n'est pas le cas, je vous conseille vivement de réaliser le programme d'exploration décrit dans mon article Introduction à MIT App Inventor 2.

Je vais également supposer que vous savez comment brancher le module HC-06 à votre carte Arduino, et que vous avez déjà réglé votre appareil Android pour permettre une communication bluetooth avec l'Arduino.  Si ce n'est pas le cas, pas de panique:  tout ça est couvert dans mon article Bluetooth et Arduino:  le module HC-06.

Le produit fini

Je crois que les explications seront plus facile à suivre si vous connaissez, dès le départ, les caractéristiques de l'application que nous désirons réaliser.

Il s'agit d'une appli très générale, qui se divise en trois parties principales:

1)  Dans le haut de la fenêtre, une paire de boutons permet d'établir ou d'interrompre la connexion avec l'Arduino.  Si aucune connexion bluetooth n'est active, le mot "Déconnecté" apparaît en rouge. Si une connexion bluetooth est active, le mot "Connecté" apparaît en vert.

2)  Un peu plus bas, une zone de texte accompagnée d'un bouton permet à l'utilisateur d'envoyer à l'Arduino un message de son choix.

3)  Finalement, un label affiche le plus récent message reçu en provenance de l'Arduino.

Certains lecteurs pourraient mettre en doute la pertinence de réaliser soi-même une telle application alors qu'il en existe déjà des dizaines de ce genre dans le Google Play Store... Sachez qu'une fois réalisé ce programme général de communication bluetooth, il sera facile de le modifier pour en faire une application spécifique à un projet particulier.

Construction de l'interface

Commençons par construire l'interface, dans le mode "Designer":

L'interface comporte 11 composants:

1)  Un rectangle "Arrangement horizontal", pris dans la catégorie "Disposition".  Cet élément (qui n'est pas indispensable) permet de faire en sorte que les éléments 2, 3 et 4 seront disposés dans la fenêtre sur une même ligne horizontale (il faut placer les éléments 2, 3 et 4 à l'intérieur de ce rectangle).

2)  Un "Label" (disponible dans la catégorie "Interface Utilisateur").  Par défaut, ce label portait le nom "Label1", mais je l'ai renommé "StatutConnexion".  La mention "connecté" ou "déconnecté" s'affichera à cet endroit.

3)  Un "Sélectionneur de liste" (disponible dans la catégorie "Interface Utilisateur").  Lorsque l'utilisateur cliquera sur cet élément, la liste des appareils bluetooth disponibles s'affichera à l'écran. J'ai renommé cet élément "BoutonConnecter", et j'ai remplacé son texte par "Connecter".

4)  Un "Bouton" (disponible dans la catégorie "Interface Utilisateur") qui servira à interrompre la connexion avec l'Arduino.  J'ai renommé cet élément "BoutonDéconnecter", et j'ai remplacé son texte par "Déconnecter".

5)  Un deuxième rectangle "Arrangement horizontal", pris dans la catégorie "Disposition".  Les éléments 6 et 7 seront placés à l'intérieur de ce rectangle.

6)  Une "Zone de texte"  (disponible dans la catégorie "Interface Utilisateur") dans laquelle l'utilisateur écrira le message à envoyer vers l'Arduino.  J'ai renommé cet élément "MessageAEnvoyer".

7)  Un "Bouton" (disponible dans la catégorie "Interface Utilisateur") pour envoyer le message.  Je l'ai renommé "BoutonEnvoyer", et j'ai remplacé son texte par défaut par "Envoyer".

8)  Un deuxième "Label" (disponible dans la catégorie "Interface Utilisateur").  Notre programme y placera le dernier message en provenance de l'Arduino.  Je l'ai renommé "MessageRecu", et j'ai remplacé son texte par défaut par "Aucun message reçu".

9)  Une "Horloge" (disponible dans la catégorie "Capteurs").  Grâce à cette horloge, une fois par seconde, notre programme vérifiera s'il a reçu un message en provenance de l'Arduino.

10) Un "Client Blutooth" (disponible dans la catégorie "Connectivité"), indispensable pour toute application qui communique avec bluetooth.

11)  Un "Notificateur" (disponible dans la catégorie "Interface Utilisateur"), qui permet d'afficher un message d'alerte si bluetooth n'a pas été activé sur l'appareil android.

Pour récapituler, voici ma zone "Composants":  on peut y voir le nom et la hiérarchie de chaque composant placé dans la zone "Interface".  (Au cas où vous ne l'auriez pas déjà remarqué: c'est au bas de cette zone qu'on retrouve un bouton "Renommer" qui nous permet d'assigner un nom plus approprié à chaque composant).

Construction du programme

Basculons maintenant en mode "Blocs" pour construire notre programme.  Rappelez-vous que la couleur des blocs vous donne un indice concernant la catégorie où vous pouvez le trouver.

1)  Une première série d'instructions concerne ce que le programme doit faire au démarrage de l'application.

Lors de l'initialisation de la fenêtre, on vérifie si bluetooth est activé sur l'appareil android.  Si ce n'est pas le cas, un message d'alerte est présenté à l'utilisateur.

Que bluetooth soit activé ou non, aucun appareil bluetooth n'est lié à notre application au démarrage. Nous réglons donc le texte du label "StatutConnexion" à "Déconnecté" (en rouge).

2)  Occupons-nous maintenant de notre "Sélectionneur de liste" intitulé "BoutonConnecter".

Cette instruction fait en sorte que, lorsqu'on clique sur cet élément, une liste des appareils bluetooth disponibles s'affiche à l'écran.

3)  Ensuite, il faut décrire les actions à accomplir lorsque l'utilisateur clique sur le nom d'un appareil bluetooth, dans la liste affichée par le sélectionneur de liste "BoutonConnecter".

On se connecte à l'appareil choisi par l'utilisateur et, si la connexion s'effectue avec succès, on remplace le contenu du label "StatutConnexion" par la mention "Connecté" (en vert).

4) Si l'utilisateur clique sur le bouton "Déconnecter"...on se déconnecte!   (En n'oubliant pas de mettre à jour le contenu du label "StatutConnexion").

5) Si l'utilisateur clique sur le bouton "BoutonEnvoyer", on envoie par bluetooth le contenu de la zone de texte "MessageAEnvoyer".

6) Une fois par seconde, l'horloge vérifie si un message a été reçu.  Si c'est le cas, le message est affichée à l'intérieur du label "MessageRecu".

(vous pouvez cliquer sur l'image pour l'agrandir...)

Fichier "aia"

Si vous éprouvez quelques difficultés à reproduire le programme, ou si vous êtes simplement paresseux, vous pouvez télécharger le fichier tout fait et l'importer dans App Inventor.

Mise à l'essai

Pour une première mise à l'essai de notre application android fraîchement programmée, je vous propose d'utiliser, du côté Arduino, le montage et le sketch proposés dans mon article Bluetooth et Arduino: le module HC-06.  Vous pourrez alors envoyer des message à l'Arduino à partir de votre appareil android.  Sur réception de ces message, l'Arduino allumera ou éteindra deux LEDs, et retournera un message expliquant le nouvel état des deux LEDs.

Personnalisation de l'application

J'ai volontairement choisi une application générale qui montre comment envoyer et recevoir n'importe quel message par bluetooth.  Dans le cas particulier de notre Arduino qui allume et éteint deux LEDs, seulement 5 messages sont pertinents (a, b, c, d ou e).  Il serait donc plus approprié de placer 5 boutons:  un bouton qui envoie le message "a", un autre qui envoie le message "b", etc.  Ce serait plus simple pour l'utilisateur, et ça lui éviterait d'envoyer des messages qui ne sont pas pertinents.

C'est là tout l'intérêt de savoir programmer ses propres applis avec App Inventor:  vous pouvez créer une application qui répond à un besoin très spécifique.

Yves Pelletier   (Twitter, Facebook)