HCScreen une bibliothèque Arduino pour travailler avec un écran TFT

En travaillant sur le projet de contrôle à domicile, j'ai eu l'idée de créer une bibliothèque avec laquelle on pourrait simplement utiliser le module d'affichage TFT et garder le programme Sketch exempt de ces routines.

La bibliothèque gère l'affichage ligne par ligne et la hauteur de la ligne peut être ajustée La première version contient toutes les fonctions pour afficher une liste de lignes de texte et pouvoir les sélectionner à l'aide d'un encodeur rotatif. L'index et le contenu de la ligne sélectionnée peuvent être lus.

La configuration de test a été construite avec un ESP32 et un écran TFT 1,8 pouces. L'utilisation d'un autre contrôleur ou d'un autre écran ne devrait pas poser de problème tant que l'écran est compatible avec la bibliothèque Adafruit-ST7735. Les broches utilisées doivent bien entendu être ajustées.

Voici le câblage utilisé avec la carte ESP32-Dev

Pour le matériel, voir également «Project HOMEControl Part 2 The Head Office» dans ce blog.

La bibliothèque peut être deBibliothèque HCScreenpeut être téléchargé. Dans l'IDE Arduino, importez simplement le fichier ZIP à partir du téléchargement dans le gestionnaire de bibliothèque.

Vous trouverez des exemples sous les exemples d'esquisses HCScreen

Description:

HCScreen (tft)

Pour créer une instance, il suffit de transmettre l'adresse de l'instance ST7735.

init ()

Cette fonction doit être appelée après que l'orientation de l'affichage (format paysage ou portrait) a été modifiée. Cette fonction détermine les marges droite, gauche, supérieure et inférieure afin que l'affichage soit au milieu. La zone d'affichage entière est également remplie de la couleur d'arrière-plan.

setLineHeight (hauteur)

Cette fonction définit la hauteur d'une ligne en pixels. Les caractères mesurent sept pixels de haut. Avec un espace en pixels, la valeur minimale de hauteur = 8. Une hauteur = 10 augmente la lisibilité mais réduit le nombre de lignes pouvant être affichées. Étant donné que la géométrie est modifiée lors de l'appel de cette fonction, la fonction init () est appelée automatiquement et le contenu est affiché de nouveau.

setBaseColor (couleur de police, couleur d'arrière-plan)

Cette fonction permet de définir la couleur de la police et de l'arrière-plan pour l'affichage. Les valeurs de couleur sont transférées au format 3 octets (rouge, vert, bleu) comme d'habitude sur les pages Web. Donc par exemple 0xFF0000 = rouge, 0x00FF00 = vert ou 0x0000FF = bleu. Les couleurs sont ensuite automatiquement converties au format 16 bits pour l'affichage. Lorsque la couleur d'arrière-plan est modifiée, cette fonction remplit automatiquement la zone d'affichage avec la nouvelle couleur d'arrière-plan et affiche à nouveau le contenu.

setSelectionColor (couleur de police, couleur d'arrière-plan)

Cette fonction peut être utilisée pour définir la couleur de la police et l'arrière-plan de la ligne sélectionnée. Le format est le même que pour setBaseColor. Le contenu s'affiche à nouveau.

setTitleColor (couleur de police, couleur d'arrière-plan)

Cette fonction permet de définir la couleur de la police et l'arrière-plan de la ligne de titre. Le format est le même que pour setBaseColor. Le contenu s'affiche à nouveau.

showContent ()

Cette fonction affiche un titre éventuellement défini et autant de lignes de la liste des lignes de texte qu'il y a d'espace sur l'affichage. L'affichage commence à partir d'une ligne de départ variable, de sorte que la fenêtre d'affichage peut être déplacée sur un plus grand nombre de lignes. Si la sélection est activée, la ligne sélectionnée s'affiche selon les couleurs définies pour les lignes sélectionnées.

setTitle (texte)

setTitle (texte, couleur de police, couleur d'arrière-plan)

Le texte spécifié est affiché dans la barre de titre en haut de l'écran. Alternativement, la couleur de la police et de l'arrière-plan peut être transférée. Le contenu de l'annonce est décalé d'une ligne vers le bas.

setMenu (liste des entrées, nombre)

La liste de contenu pour l'affichage est remplie avec les entrées de menu et la sélection est activée. La première entrée est automatiquement sélectionnée et l'affichage commence par la première entrée. Le nombre indique le nombre d'entrées.

selectNext ()

Si la sélection est activée, la ligne suivante est sélectionnée jusqu'à la fin de la liste de contenu. Si la ligne sélectionnée était en dehors de la plage affichable, la ligne de départ est augmentée de sorte que la partie affichée de la liste de contenu est déplacée vers le haut et la ligne sélectionnée reste visible. Si la sélection n'est pas activée, la ligne de départ est augmentée d'une unité de sorte que le bloc de texte affiché est déplacé vers le haut. Cela continue jusqu'à ce que la dernière ligne de la liste de contenu s'affiche dans la dernière ligne de la zone d'affichage.

selectPrevious ()

Si la sélection est activée, la ligne précédente est sélectionnée jusqu'à ce que le début de la liste de contenu soit atteint. Si la ligne sélectionnée était en dehors de la plage affichable, la ligne de départ est réduite de sorte que la partie affichée de la liste de contenu est déplacée vers le bas et la ligne sélectionnée reste visible. Si la sélection n'est pas activée, la ligne de départ est réduite de un pour que le bloc de texte affiché soit déplacé vers le bas. Cela continue jusqu'à ce que la première ligne de la liste de contenu s'affiche dans la première ligne de la zone d'affichage.

getSelection ()

Cette fonction renvoie le contenu textuel de la ligne actuellement sélectionnée ou une chaîne vide si la sélection n'est pas activée.

getSelectionIndex ()

Cette fonction renvoie le numéro de ligne (commençant par 0) de la ligne actuellement sélectionnée ou -1 si la sélection n'est pas activée.

Exemple d'esquisse:

L'esquisse d'exemple ESP32_Control_Center montre comment une commande de menu simple peut être implémentée avec un encodeur rotatif. La bibliothèque RotaryEncoder est utilisée pour contrôler le Rotary Encoder.

Un menu principal avec 15 entrées et un sous-menu avec trois entrées sont définis. Dans le menu principal, vous pouvez tester le mouvement du bloc d'affichage en descendant vers le bas avec la sélection. Si vous cliquez sur l'encodeur rotatif lorsque la ligne "Sous-menu" est sélectionnée, le sous-menu s'affiche. Si vous cliquez sur l'encodeur rotatif lorsque la ligne arrière est sélectionnée dans le sous-menu, le menu principal s'affiche à nouveau.