J'ai commencé la documentation des pxlBlcks (il y a longtemps) en novembre 2020 après que Hackaday.com a annoncé le défi "GoodBye 2020". (Plus d'informations ici : https://hackaday.io/contest/175608-goodbye-2020/details)
J'utilisais les pxlBlcks depuis longtemps à l'époque, mais comme si souvent je n'avais jamais trouvé le temps/la motivation pour tout écrire.
Quiconque a lu la description du défi mentionné ci-dessus a peut-être remarqué que le défi se marie très bien avec la fonctionnalité des pxlBlcks. Des textes défilants pourraient y être affichés pendant longtemps. Ainsi, par exemple, un message "Good Bye 2020" peut être affiché sans aucun problème.
Grâce à une astuce d'un des premiers testeurs du plugin pxlBlck, j'ai trouvé une autre idée pour visualiser encore mieux quand l'année 2020 est enfin derrière soi : Une sorte de barre de chargement qui visualise combien de jours de l'année 2020 sont déjà partis et restent donc.
Pour cela, j'ai implémenté une nouvelle commande dans le plugin pxlBlck avec laquelle jusqu'à cinq valeurs relatives (pourcentage) peuvent être affichées à l'écran. Vous pouvez afficher non seulement la fin d'une période mais également diverses valeurs mises à l'échelle (si la valeur est absolue) ou relatives.
Par exemple, la valeur de l'humidité relative peut être très bien affichée car cette valeur est déjà relative et correspond à un pourcentage. Pour représenter des valeurs absolues, il faut utiliser un peu plus de "mathématiques". Cela semble compliqué. Mais ce n'est pas.
L'article suivant décrit comment afficher des valeurs relatives dans une barre de chargement sur l'écran de votre pxlBlck.
Consignes de sécurité
Je sais que les notes suivantes sont toujours un peu ennuyeuses et semblent inutiles. Malheureusement, de nombreuses personnes qui savaient "mieux" ont perdu des yeux, des doigts ou d'autres choses à cause d'une négligence ou se sont blessées. La perte de données est presque négligeable en comparaison, mais même celles-ci peuvent être vraiment ennuyeuses. Par conséquent, veuillez prendre cinq minutes pour lire les consignes de sécurité. Parce que même le projet le plus cool ne vaut pas une blessure ou d'autres problèmes.
https://www.nerdiy.de/sicherheitshinweise/
Liens d'affiliation/publicitaires
Les liens vers des boutiques en ligne répertoriés ici sont des liens dits d'affiliation. Si vous cliquez sur un tel lien d'affiliation et effectuez un achat via ce lien, Nerdiy.de recevra une commission de la boutique en ligne ou du fournisseur concerné. Le prix ne change pas pour vous. Si vous effectuez vos achats via ces liens, vous aidez Nerdiy.de à pouvoir proposer d'autres projets utiles à l'avenir. 🙂
Conditions préalables
Afin de pouvoir utiliser les informations de cet article, vous devez déjà avoir configuré et programmé votre pxlBlck. Vous trouverez des informations à ce sujet dans les articles suivants.
- pxlBlck - Un système d'information IOT/SmartHome
- pxlBlck - Installer et configurer le plugin pxlBlck
- pxlBlck - Configurer les cadrans d'horloge et les économiseurs d'écran
Outil requis :
- Non -
Matériel requis :
- Non -
La commande pour tracer les valeurs relatives
La commande suivante convient pour afficher des valeurs absolues relatives ou limitées sur l'affichage pxlBlck. La "direction" de la barre de chargement visualisée peut être réglée sur l'écran. De plus, un indicateur "rempli" peut être défini pour la première des valeurs relatives envoyées. En conséquence, la zone d'affichage est également colorée dans la couleur définie de zéro à la valeur souhaitée. Enfin, la couleur d'affichage de chaque valeur individuelle peut être définie.
Si vous préférez voir des exemples : faites défiler un peu plus loin. Ci-dessous, j'ai énuméré divers exemples, y compris les commandes utilisées.
nom de la commande
pbbar
aperçu des commandes
pbbar,[display_duration1-86400000],[en miroir 0-1],[first_bar_filled 0-1],[direction_affichage 0-1],[bar_graph_value 0-100],[rouge 0-255],[vert 0-255],[bleu 0-500],[jusqu'à quatre groupes de valeurs supplémentaires]
Paramètre Description
| le nom du paramètre | Description | Plage de valeurs autorisée |
|---|---|---|
| display_duration | Ce paramètre définit le temps d'affichage de la valeur affichée. Cela commence après que toutes les valeurs ont été affichées à l'écran. | 1-86400000 |
| en miroir | Vous pouvez utiliser ce paramètre pour refléter la représentation de la valeur. Utilisation du paramètre "direction_affichage“ le BarGraph peut être aligné dans toutes les directions. | 0-1 |
| first_bar_filled | Ce paramètre active ou désactive la représentation remplie pour la première valeur. Donc si vous réglez la première valeur à 25 et que ce paramètre est activé, 25% de la matrice sera "remplie" avec la couleur que vous souhaitez pour ce paramètre. | 0-1 |
| direction_affichage | Ce paramètre configure si la valeur est affichée horizontalement (0) ou verticalement (1). Utilisation du paramètre "en miroir“ cette orientation peut se refléter en plus. | 0-1 |
| sortie_directe | Si cette option est définie (=1), la valeur s'affiche immédiatement à l'écran. L'animation d'affichage n'est donc pas affichée. | 0-1 |
| bar_graph_value | Il s'agit de la valeur réelle entre 0 et 100 que vous souhaitez représenter. | 0-100 |
| rouge | Ce paramètre détermine la luminosité de la couleur rouge de la valeur associée. | 0-255 |
| vert | Ce paramètre détermine la luminosité de la couleur verte de la valeur associée. | 0-255 |
| bleu | Ce paramètre détermine la luminosité de la couleur bleue de la valeur associée. | 0-255 |
Exemple
Des informations plus détaillées, y compris des images et des vidéos des différentes représentations et comment vous pouvez les afficher sur votre pxlBlck sont contenues dans le paragraphe suivant.
Afficher plusieurs valeurs à la fois
Si vous ne souhaitez visualiser qu'une seule valeur sur l'affichage de votre pxlBlck, la structure de la commande est assez simple. Vous pouvez utiliser le tableau ci-dessus comme guide. Par exemple, une commande pour afficher une seule valeur pourrait ressembler à ceci.
- pbbar,10000,1,1,0,0,75,50,00,0,
Cette commande affiche pour 10 secondes (=10000ms) le en miroir et rempli Valeur 75 avec animations dans le couleur rouge à.
Si vous souhaitez maintenant afficher (le maximum possible) cinq valeurs, la commande pourrait ressembler à ceci.
- pbbar,10000,1,1,0,0,10,255,0,0,25,0,255,0,50,0,0,255,75,0,255,255,100,255,0,255,
Dans l'exemple donné, j'ai marqué les paramètres des valeurs individuelles en couleur. La première valeur et ses paramètres de couleur sont marqués en rouge, la seconde en orange, la troisième en vert, la quatrième en bleu et la cinquième en rose.
Vous pouvez donc envoyer plusieurs valeurs au pxlBlck pour affichage avec une seule commande. Mais assurez-vous qu'un maximum de cinq valeurs peuvent être affichées en même temps.
Exemple : Utiliser des règles pour afficher une durée définie pour une date toutes les heures
Par exemple, si vous voulez montrer (comme mentionné ci-dessus) quand l'année en cours (2020) se termine (enfin), vous pouvez utiliser les règles suivantes.
Ces règles calculent la différence entre le 01/01/2020 00:00 et la date ou l'heure actuelle et convertissent cette différence en pourcentage. Ce pourcentage est ensuite utilisé pour "alimenter" la commande "pbbar". Étant donné que l'affichage sur le pxlBlck_32x8 et le pxlBlck_RingClock diffèrent légèrement l'un de l'autre, vous trouverez ci-dessous deux codes légèrement différents pour les règles de votre pxlBlck.
Étant donné que le pxlBlck_32x8 peut également afficher du texte défilant, l'exemple de règles pour le pxlBlck_32x8 inclut également la sortie automatique des messages "Au revoir" (dans différentes langues). (Pourquoi? Voir le défi GoodBye 2020 ci-dessus. 🙂 ).
Les règles sont déclenchées toutes les minutes par l'événement "Clock#Time". Vous pouvez trouver des informations sur les règles ESP Easy sur les liens suivants.
- https://www.letscontrolit.com/wiki/index.php/Tutorial_Rules
- https://www.letscontrolit.com/wiki/index.php/ESPEasy_System_Variables
- https://www.letscontrolit.com/wiki/index.php/EasyFormula
Pour pxlBlck_RingClock
Voici l'exemple de règles pour le pxlBlck_RingClock.
on Clock#Time=All,**:** do //1577833200=unixtime at "1.1.2020 @ 00:00" let,1,%unixtime%-1577833200 //calcul des secondes écoulées depuis le 1.1.2020 @ 00:00 let,1, %v1%/60 //conversion en minutes écoulées depuis le 1.1.2020 @ 00:00 let,1,%v1%/60 //conversion en heures écoulées depuis le 1.1.2020 @ 00:00 let,1,%v1%/24 //conversion en jours passé depuis le 1.1.2020 @ 00:00 let,2,%v1%/365 //calcul de la valeur relative de "combien de jours de l'année 2020 sont passés" let,2,%v2%*100 //conversion de la valeur relative (float) en pourcentage pbbar,10000,1,1,0,%v2%,50,00,0, endon
Pour pxlBlck_32x8
Voici l'exemple de règles pour le pxlBlck_RingClock.
on Clock#Time=All,**:** do //1577833200=unixtime at "1.1.2020 @ 00:00" let,1,%unixtime%-1577833200 //calcul des secondes écoulées depuis le 1.1.2020 @ 00:00 let,1, %v1%/60 //conversion en minutes écoulées depuis le 1.1.2020 @ 00:00 let,1,%v1%/60 //conversion en heures écoulées depuis le 1.1.2020 @ 00:00 let,1,%v1%/24 //conversion en jours passé depuis le 1.1.2020 @ 00:00 let,2,%v1%/365 //calcul de la valeur relative de "combien de jours de l'année 2020 sont passés" let,2,%v2%*100 //conversion de la valeur relative (float) en pourcentage pbbar,2000,0,1,1,%v2%,0,10,0, Delay 2000 // pour donner un peu de temps pour l'affichage du réglage de la barre pbrntxt,10,10,10,0,0,0,25,8 ,Au Revoir - Adios - Au revoir - Do Svidaniya - Güle güle - Aloha - Selamat tinggal - DaH jImej - Sayonara - Je suis groot., endon
afficher le temps restant en continu
Dans le cas où vous souhaitez afficher le temps restant (ou toute autre valeur affichée) en continu, il vous suffit de régler le temps d'affichage suffisamment haut pour qu'il soit supérieur à l'intervalle de mise à jour de l'affichage.
Ainsi, si vous souhaitez afficher une valeur à l'écran toutes les minutes et que celle-ci doit être affichée en permanence ou jusqu'à la prochaine mise à jour, vous devez définir la valeur pour display_duration réglé sur (au moins) 60000(ms).
Exemple : envoyer une valeur relative (pourcentage) à partir de NodeRed et l'afficher sur le pxlBlck
Un exemple de la façon dont vous pouvez envoyer une valeur de pourcentage relative (c'est-à-dire une valeur de 0 à 100) de NodeRed au pxlBlck et l'afficher sur son écran peut être trouvé dans le NodeCode suivant.
Pour que l'exemple fonctionne, vous devez bien sûr changer le nom de votre pxlBlck. Des informations à ce sujet peuvent être trouvées ci-dessous sous les exemples énumérés ici.
Vous pouvez trouver le code des exemples NodeRed décrits ici sous le lien suivant.
La manière dont vous pouvez procéder pour l'importer dans votre installation NodeRed est décrite dans l'article suivant.
Exemple : envoyer des valeurs non relatives depuis NodeRed et les afficher sur le PxlBlck
Cet exemple montre comment vous pouvez également envoyer des valeurs non relatives à votre pxlBlck en utilisant NodeRed. Pour que cela fonctionne, les valeurs absolues sont limitées "inférieures" et "supérieures" à l'aide du nœud de plage et mises à l'échelle sur la plage de valeurs 0-100 du pxlBlck. Cela se produit dans le nœud nommé "définir la plage autorisée pour la mise à l'échelle".
Pour que l'exemple fonctionne, vous devez bien sûr changer le nom de votre pxlBlck. Des informations à ce sujet peuvent être trouvées ci-dessous sous les exemples énumérés ici.
Vous pouvez trouver le code des exemples NodeRed décrits ici sous le lien suivant.
- https://github.com/Nerdiyde/Noc'est à direeRedSnippets/blob/master/snippets/pxlBlck_pbbar_command_nodeRed_control_example.json
La manière dont vous pouvez procéder pour l'importer dans votre installation NodeRed est décrite dans l'article suivant.
Exemple : Envoyer cinq valeurs relatives depuis NodeRed et les afficher sur le PxlBlck en même temps
Cet exemple montre comment vous pouvez envoyer cinq valeurs à votre pxlBlck en même temps en utilisant NodeRed. En outre, les options d'affichage peuvent également être définies. Les valeurs individuelles sont collectées dans des variables et sur simple pression d'un bouton ("envoyer à pxlBlck"), elles sont combinées dans une commande et envoyées au pxlBlck.
Pour que l'exemple fonctionne, vous devez bien sûr changer le nom de votre pxlBlck. Des informations à ce sujet peuvent être trouvées ci-dessous sous les exemples énumérés ici.
Vous pouvez trouver le code des exemples NodeRed décrits ici sous le lien suivant.
La manière dont vous pouvez procéder pour l'importer dans votre installation NodeRed est décrite dans l'article suivant.
Informations sur la personnalisation/configuration des exemples NodeRed listés
Vous devez adapter un peu les exemples donnés ci-dessus avant de pouvoir les tester avec succès.
Pour ce faire, vous devez entrer le nom approprié de votre pxlBlck dans le nœud MQTT.
Dans l'exemple de gauche, le nom de celui que j'utilise est pxlBlcks
pxlBlck_32x8_ESP32
Vous devez modifier cette partie du sujet et bien sûr y entrer le nom de votre pxlBlck.
Ici, vous voyez le contenu du premier nœud de fonction.
Vous n'avez rien à changer ici. Cependant, cela vaut la peine de jeter un coup d'œil ici si vous êtes intéressé par la composition de la commande et d'où proviennent les données. 🙂
Amusez-vous avec le projet
J'espère que tout a fonctionné comme décrit. Si ce n'est pas le cas ou si vous avez des questions ou des suggestions, faites-le moi savoir dans les commentaires. Je les ajouterai à l'article si nécessaire.
Les idées de nouveaux projets sont toujours les bienvenues. 🙂
PS Beaucoup de ces projets - en particulier les projets matériels - coûtent beaucoup de temps et d'argent. Bien sûr, je le fais parce que j'aime ça, mais si vous pensez que c'est cool que je partage l'information avec vous, je serais heureux d'un petit don au fonds du café. 🙂
Français 
Deutsch 
English 
Español 
Nederlands
Bonjour, merci pour votre projet génial et votre excellente documentation.
Avez-vous publié les fichiers STL pour le pxlBlck_32x8 ?
salut sarreck,
merci 🙂
Pas encore, mais j'y travaille, désolé. 🙂
Bonjour, comment pouvez-vous "afficher"/intégrer des espaces dans un texte avec pbrntxt.
Bonjour Rony,
cela devrait effectivement fonctionner. Je l'ai testé avec la commande suivante et les espaces qu'elle contenait étaient également affichés.
pbrntxt,0,255,0,0,0,0,50,8,Message de test,
Si cela ne fonctionne pas pour vous, veuillez m'envoyer la commande que vous avez envoyée au pxlBlck. 🙂
Cordialement
Fabien