Siège de Smarthome avec ArduiTouch Partie 5 - Nouvelle interface graphique et Variation pour ESP8266 au lieu de ESP32

Maintenant, il est enfin temps. Notre série au siège social de Smarthome peut continuer. Après la première version avait une interface graphique très simple, j’ai décidé de reprogrammer la partie d’affichage entier et l’externaliser à ma propre bibliothèque (AT_Display.h) pour une utilisation plus facile. Cela maintient le code de l’application clair.

La nouvelle interface utilisateur permet désormais une configurabilité complète de l’affichage de valeur mesurée. Il existe des formulaires d’entrée pour définir le nom, la couleur et la taille des widgets. Depuis qu’il a été démontré que le double clic sur l’écran tactile ne fonctionne pas toujours et puisque chaque événement en double clic déclenche également un simple clic, j’ai utilisé le long clic (gt;3s) au lieu pour les fonctions spéciales. La conception des formulaires ainsi que les styles d’affichage peuvent être clairement ajustés via un fichier d’en-tête AT_Layout.h. Deux autres fichiers d’en-tête AT_LanguageGE.h et AT_LanguageEN.h contiennent la définition de tous les textes de message et permettent ainsi un ajustement de la langue. La déclaration correspondante #include peut être trouvée au début du fichier d’en-tête AT_Display.h .

L’esquisse par exemple pour la nouvelle version est maintenant SmartHomeV2 ou asl innovation supplémentaire pour ceux qui veulent utiliser l’ESP8266 l’exemple croquis SmartHomeV2_8266. Cependant, je préfère toujours utiliser l’ESP32, comme l’ESP8266 est à court de mémoire pour les variables locales. Des tests ont montré que l’application se bloque dans certaines circonstances en raison de problèmes d’empilage, ce qui entraîne un redémarrage par le chien de garde.

Les bibliothèques ainsi que les croquis d’échantillon peuvent être trouvés à nouveau sur mon Dépôt GitHub. Vous avez besoin des bibliothèques TouchEvent (TouchEvent), ATMessageBuffer Et ATSmartHome (en).

Manuelle:

Après l’allumage, la page 1 de l’affichage de valeur mesurée avec widgets apparaît en fonction de la configuration. En cliquant sur le commutateur widget (vert dans l’image) changera sa valeur et passera la modification à l’appareil distant. Si vous cliquez sur un widget pendant plus de 3 secondes, la page de configuration de ce widget s’ouvrira.

Sous cette forme, nous pouvons définir l’étiquette, l’apparence et la position du widget. L’étiquette est le texte au-dessus ou à gauche de la mesure. Lorsque vous cliquez sur la zone d’entrée, un clavier à l’écran apparaît et vous pouvez modifier le texte. La clé d’entrée en bas à droite met fin à l’entrée et hérite du texte.

La taille du widget peut avoir quatre valeurs différentes.

• petit : ligne unique avec désignation à gauche de la valeur
• gauche : deux lignes et demie de largeur avec désignation ci-dessus
• droite : comme à gauche mais sur la moitié droite
• grand : deux lignes avec désignation ci-dessus et police plus grande.

Si vous cliquez sur la zone d’entrée, une liste des quatre options apparaîtra. Il suffit de cliquer sur l’une des options pour le sélectionner.

La couleur de fond peut également être définie. Si vous cliquez sur l’échantillon de couleur sur la droite, un dialogue de sélection de couleurs sera affiché. Vous sélectionnez la couleur désirée en cliquant et complétez l’entrée avec le bouton Fini.

De la même manière, vous pouvez définir la couleur de fond d’un interrupteur actif et la couleur de la police. Les décimales indiquent le nombre de nombres après la virgule. En cliquant sur la zone d’entrée ouvre l’entrée du numéro.

Cela fonctionne de la même façon que le clavier de texte.

Avec l’entrée du numéro, vous pouvez également composer la page sur laquelle le widget doit être affiché. Lors de l’utilisation de l’ESP32, 32 pages sont disponibles sur l’ESP8266 pour des raisons de stockage seulement 8. Entre les pages est toswitched par glisser.

Le dernier champ d’entrée est pour la position du widget sur la page. Pour les petits widgets d’une ligne, il ne fait que commencer le numéro de ligne à 0. Pour les widgets de demi-largeur qui occupent deux lignes, le numéro de ligne inférieure s’applique au widget gauche et au numéro de ligne inférieur vers la droite.  Les grands widgets occupent deux lignes, de sorte que dans ce cas, la deuxième rangée ne peut pas être utilisée. Le nombre maximum de ligne est de 7.

Avec les boutons en bas, vous pouvez enregistrer les modifications, ou annuler sans enregistrer. Le widget peut également être supprimé. Le Button Extra n’a pas encore de fonction. Il sera ensuite utilisé pour ajuster les couleurs de police en fonction de la valeur mesurée.

Si vous cliquez sur la barre bleue inférieure sur la page principale, la liste de tous les appareils apparaîtra.

Pour l’ESP32 il y en a 32 pour l’ESP8266 16. Les autres pages peuvent être atteintes en glissant. Si vous cliquez sur un appareil, vous pouvez changer son nom.

Encore une fois, la modification peut être enregistrée via le bouton Enregistrer. En cliquant sur le bouton Détails, vous indiquez la liste de tous les canaux de cet appareil. Avec l’ESP32, il y a un maximum de 8 pour l’ESP8266 un maximum de 4. Les canaux actifs sont stockés en jaune.

Si vous cliquez sur un canal, la fenêtre de configuration du widget correspondant sera ouverte.

L’enregistrement d’un nouvel appareil est le même qu’avec l’ancienne version. Si un nouvel appareil est détecté, son adresse ID ou MAC s’affiche dans la barre bleue inférieure. Si vous cliquez longtemps sur la barre bleue inférieure, l’appareil est enregistré et le dialogue nom pour le nouvel appareil s’affiche afin que vous puissiez lui attribuer un nom

Amusez-vous avec la nouvelle version. Les appareils externes, bien sûr, continuent à fonctionner sans modifications nécessaires.