Voici un tuto pas à pas, très concret, pour ajouter START / STOP dans votre appli App Inventor.
On part de ce que vous avez déjà :
Web1 lit https://proxy-automate.latelier22.fr/api.phpClock1 relit régulièrementLabelEtatPac affiche l’état- vous avez déjà
global etat_pac
On va juste ajouter :
- un bouton
ButtonStart
- un bouton
ButtonStop
- un composant
Web2 pour envoyer les commandes
Étape 1 — Ajouter les composants dans le Designer
Dans App Inventor, allez dans Designer.
Ajoutez :
- un bouton nommé
ButtonStart
- un bouton nommé
ButtonStop
- un composant Web nommé
Web2
Vous gardez :
Web1Clock1LabelEtatPacLabelMot
Étape 2 — Régler l’URL du composant de commande
Toujours dans le Designer, ou dans les blocs ensuite :
Web1 servira à lire l’étatWeb2 servira à envoyer START / STOP
L’URL de commande est :
https://proxy-automate.latelier22.fr/control.php
Étape 3 — Dans Screen1.Initialize
Dans les blocs, ouvrez :
when Screen1.Initialize
Vous avez déjà un bloc qui met l’URL de Web1.
Ajoutez maintenant, juste dessous :
set Web2.Url to "https://proxy-automate.latelier22.fr/control.php"
Ajoutez aussi :
set ButtonStart.Visible to false
set ButtonStop.Visible to false
call Web1.Get
Donc au final, dans Screen1.Initialize, vous devez avoir l’idée suivante :
when Screen1.Initialize
set Web1.Url to "https://proxy-automate.latelier22.fr/api.php"
set Web2.Url to "https://proxy-automate.latelier22.fr/control.php"
set ButtonStart.Visible to false
set ButtonStop.Visible to false
call Web1.Get
Étape 4 — Laisser le timer relire l’état
Dans votre bloc :
when Clock1.Timer
gardez simplement :
call Web1.Get
Le Clock1 sert juste à relire l’état de la PAC.
Donc :
when Clock1.Timer
call Web1.Get
Étape 5 — Dans Web1.GotText, lire etat_pac
Vous avez déjà ce bloc.
Dedans, vous faites déjà :
- décoder le JSON
- stocker
global data
- lire
debit_eau_l_h
- lire
etat_pac
Gardez ça.
La ligne importante est celle-ci :
set global etat_pac to get value for key "etat_pac" in dictionary get global data
Puis vous faites déjà :
set LabelEtatPac.Text to get global etat_pac
Ça, il faut le garder.
Étape 6 — Ajouter la logique d’affichage START / STOP
Toujours dans Web1.GotText, juste après :
set LabelEtatPac.Text to get global etat_pac
ajoutez un bloc if then else.
La règle est :
si global etat_pac = "Marche"
alors :
set ButtonStart.Visible to false
set ButtonStop.Visible to true
sinon
alors :
set ButtonStart.Visible to true
set ButtonStop.Visible to false
Donc dans App Inventor, ça donne l’idée suivante :
if get global etat_pac = "Marche"
then
set ButtonStart.Visible to false
set ButtonStop.Visible to true
else
set ButtonStart.Visible to true
set ButtonStop.Visible to false
Étape 7 — Créer le bloc du bouton START
Ajoutez un nouveau bloc :
when ButtonStart.Click
À l’intérieur, mettez :
call Web2.PostText "action=start"
Donc :
when ButtonStart.Click
call Web2.PostText "action=start"
Ce bloc envoie la commande START au proxy.
Étape 8 — Créer le bloc du bouton STOP
Ajoutez un nouveau bloc :
when ButtonStop.Click
À l’intérieur, mettez :
call Web2.PostText "action=stop"
Donc :
when ButtonStop.Click
call Web2.PostText "action=stop"
Ce bloc envoie la commande STOP au proxy.
Étape 9 — Ajouter le retour après commande
Ajoutez un nouveau bloc :
when Web2.GotText
À l’intérieur, mettez un test :
si responseCode = 200
alors :
call Web1.Get
sinon
alors :
set LabelMot.Text to "Erreur commande"
Donc :
when Web2.GotText
if get responseCode = 200
then
call Web1.Get
else
set LabelMot.Text to "Erreur commande"
Le but est simple :
- on clique sur START ou STOP
- la commande est envoyée
- dès que le serveur répond, on relit l’état réel avec
Web1.Get
Étape 10 — Résultat attendu
Si la PAC est arrêtée
api.php renvoie :
etat_pac = "Arret"
Alors l’appli doit afficher :
ButtonStart.Visible = trueButtonStop.Visible = false
Si la PAC est en marche
api.php renvoie :
etat_pac = "Marche"
Alors l’appli doit afficher :
ButtonStart.Visible = falseButtonStop.Visible = true
Étape 11 — Ce que l’appli envoie exactement
Quand on clique sur START
elle envoie :
action=start
à :
https://proxy-automate.latelier22.fr/control.php
Quand on clique sur STOP
elle envoie :
action=stop
à :
https://proxy-automate.latelier22.fr/control.php
Étape 12 — Ce que l’appli reçoit
Quand elle lit l’état avec Web1.Get
elle lit :
{
"ok": true,
"etat_pac": "Marche"
}
ou :
{
"ok": true,
"etat_pac": "Arret"
}
Dans votre appli, vous utilisez seulement :
Étape 13 — Résumé ultra simple
Au démarrage
Si etat_pac = "Marche"
- cacher START
- montrer STOP
Si etat_pac = "Arret"
- montrer START
- cacher STOP
Si on clique START
- envoyer
action=start
- relire l’état
Si on clique STOP
- envoyer
action=stop
- relire l’état
Étape 14 — Les 4 blocs finaux à avoir
1. Screen1.Initialize
set Web1.Url to "https://proxy-automate.latelier22.fr/api.php"
set Web2.Url to "https://proxy-automate.latelier22.fr/control.php"
set ButtonStart.Visible to false
set ButtonStop.Visible to false
call Web1.Get
2. Clock1.Timer
call Web1.Get
3. ButtonStart.Click
call Web2.PostText "action=start"
4. ButtonStop.Click
call Web2.PostText "action=stop"
5. Web2.GotText
if responseCode = 200
call Web1.Get
else
set LabelMot.Text to "Erreur commande"
6. Dans Web1.GotText
Après avoir récupéré etat_pac :
if get global etat_pac = "Marche"
set ButtonStart.Visible to false
set ButtonStop.Visible to true
else
set ButtonStart.Visible to true
set ButtonStop.Visible to false
Étape 15 — Ce qu’il faut vérifier si ça ne marche pas
Web2.Url doit être :
https://proxy-automate.latelier22.fr/control.php
ButtonStart.Click doit envoyer exactement :
action=start
ButtonStop.Click doit envoyer exactement :
action=stop
Web1.GotText doit bien lire :
etat_pac
avec cette clé exacte.
