Site icon AranaCorp

Créez une application avec App Inventor 2

Apprenez à créer un application pour Android très simplement en utilisant App Inventor 2.

Dans les domaines de la robotique et des objets connectés, une des fonctionnalités les plus intéressantes à mettre en œuvre est le pilotage à distance d’un projet électronique. Que ce soit pour afficher des mesures provenant de sa maison ou bien pour piloter un drone, une solution possible est de développer un application pour Smartphone et de communiquer avec un microcontrôleur en utilisant une liaison Bluetooth. Cette App peut être rapidement créée en utilisant le logiciel en ligne du MIT, App Inventor 2 (AI2).

Matériel

Création de l’application AI2

Dans cet exemple, nous créons une application afin d’activer une fonction (ON/OFF) et de récupérer une mesure de capteur provenant d’une carte Arduino. Ce tutoriel peut être appliqué pour bien d’autres applications.

Inscrivez-vous sur le site App Inventor 2.

Créer un nouveau projet myApp

L’écran designer du projet apparait

Configuration de l’Application AI2

Pour créer le design de notre application, nous utilisons les objets disponibles sous les onglets dans le menu déroulant à gauche de l’écran et modifier leurs paramètres qui apparaissent à droit de l’écran.

Dans User interface, ajoutez un objet label et renommez-le titleLbl. Il contiendra le titre de l’application myApp.

Dans layout, ajouter un objet VerticalArrangement qui permet d’aligner des objets verticalement.

Dans l’objet VerticalArrangement, placez un label btStatusLbl puis un ListPicker btBtn qui serviront à gérer la connexion Bluetooth.

Ajouter ensuite un label sensorLbl qui contiendra la valeur reçue de la carte Arduino.

Ajouter un HorizontalArrangement qui permet de disposer et d’aligner des objets horizontalement et qui contiendra les boutons permettant d’activer la fonction Arduino.

Dans l’HorizontalArrangement, ajouter deux boutons onBtn et offBtn.

Enfin, dans Connectivity, ajouter un objet BluetoothClient qui nous permettra d’interagir avec le Bluetooth de l’appareil.

Et dans Sensor, ajoutez deux objets Clock, qui permettront de réceptionner et d’envoyer des données à intervalle de temps régulier.

Vous personnaliser votre application comme vous le souhaitez en utilisant des couleurs, des polices ou des images différentes.

Programmation de l’Application AI2

Pour programmer l’application, AI2 nous propose d’utiliser le Scratch qui permet de créer un programme sous forme de schéma bloc. Très simple d’utilisation mais nécessitant un peu de logique de programmation.

Toutes les fonctions sont disponibles en cliquant sur les objets dans le menu déroulant à gauche de l’écran. Parcourez les fonctions des objets que vous avez rajouté sur l’application ainsi que celles des objets Variables, Text, Math et Control dont nous allons nous servir.

Créez la liste des modules Bluetooth disponibles sur l’appareil.

Gérez l’établissement de la connexion et modifiez le statut en fonction de la connexion.

Une variable globale « command » est définie afin de garder en mémoire la valeur donnée par le dernier bouton pressé (ON ou OFF).

Nous envoyons la valeur de la variable command par Bluetooth, si celui-ci est connecté, avec une fréquence définie par l’objet Clock1.

Pour récupérer la valeur du capteur envoyée de l’Arduino, nous vérifions si des données sont disponibles dans le buffer avec une fréquence définie par Clock2. Nous affichons ensuite cette valeur dans sensorLbl.

Code Complet

Une fois tous les blocs placés sur l’interface et configurés, le code devrait ressembler à ça.

Compiler et partager votre Application

Un fois que ce programme en Scratch est correctement configuré et qu’aucune erreur ne s’affiche, munissez-vous d’une application de lecture de code QR et compilez le programme en utilisant le menu Build > App (provide QR code for .apk)

Une fois le code QR généré, vous pouvez télécharger et installer l’application sur votre Smartphone.

Vous pouvez partager l’installateur de votre application .APK pour Android ou vous pouvez partager le projet .AIA afin que d’autres personnes puissent le modifier.

Exporter pour créer le fichier AIA correspondant sur votre ordinateur

Importer pour ouvrir un fichier AIA sur l’application en ligne et modifier le projet

Code Arduino

Voici le code à téléverser dans la carte Arduino pour réceptionner et envoyer des données sur le port série. (Vous pouvez retrouver plus d’information dans ce tuto)

#include <SoftwareSerial.h>

SoftwareSerial hc06(2,3);

String cmd="";
float sensor_val=0;

void setup(){
  //Initialize Serial Monitor
  Serial.begin(9600);
  //Initialize Bluetooth Serial Port
  hc06.begin(9600);
}

void loop(){
  //Read data from HC06
  while(hc06.available()>0){
    cmd+=(char)hc06.read();
  }

  //Select function with cmd
  if(cmd!=""){
    Serial.print("Command recieved : ");
    Serial.println(cmd);
    // We expect ON or OFF from bluetooth
    if(cmd=="ON"){
        Serial.println("Function is on");
    }else if(cmd=="OFF"){
        Serial.println("Function is off");
    }else{
        Serial.println("Function is off by default");
    }
    cmd=""; //reset cmd
  }
  // Simulate sensor measurement
  sensor_val=(float)random(256); // random number between 0 and 255
    
  //Write sensor data to HC06
  hc06.print(sensor_val);
  delay(100);
}


Résultat

Nous pouvons activer et désactiver la fonction de l’Arduino et recevoir les données d’un capteur sur l’application

N’hésitez pas à laisser un commentaire ou à nous contacter si vous avez besoin d’aide pour créer votre application ou si vous pensez que des informations manquent à ce tutoriel.

Applications

Sources

Quitter la version mobile