HowTo: pxlBlck – Configure and display animations

With the pxlBlck you can be informed about events in different ways. One of these possibilities is to be able to display previously set icons.

Unfortunately, this option only works on LED matrices with a height greater than one, i.e. not on the pxlBlcks which “only” use an LED strip or a 1×60 LED matrix.

Therefore, in addition to the option to display icons, there is also the option to display animations. These animations work on all LED matrices supported by the pxlBlck plugin.


Animation basics

Animations can only be displayed using the correct command. This means that these are only executed on an event-related basis.

For example, you can trigger an animation when a certain message is sent to the pxlBlck via MQTT, a connected sensor has assumed a certain state but also, for example, when the pxlBlck has started or has lost the connection to the WiFi. I will collect a few examples under the pxlBlckUsecase tag. You can find a list of these use cases at https://nerdiy.de/tag/pxlblckusecase/

In the following a few basics for the basic structure of the command for triggering animations on the pxlBlck. How you can send this command to the pxlBlck is also described in the article ESPEasy – Commands and actions via HTTP, MQTT, UDP and directly execute. You can also read basic information on the structure of the pxlBlck commands in this article pxlBlck – Commands for configuring the pxlBlck

Command name

pbani

Command overview

pbani,[animation_type 1-6],[color_on_red 0-255],[color_on_green 0-255],[color_on_blue 0-255],[color_off_red 0-255],[color_off_green 0-255],[color_off_blue 0-255],[animation_delay 0-500],

Parameter description

Parameter namedescriptionPermitted range of values
animation_typeThis parameter defines the type of animation. You can find an overview of the possible animations in the table below.1-6
color_on_redThis parameter determines the brightness of the red color in the entrance animation.0-255
color_on_greenThis parameter determines the brightness of the green color in the entrance animation.0-255
color_on_blueThis parameter determines the brightness of the blue color in the entrance animation.0-255
color_off_redThis parameter determines the brightness of the red color in the initial animation.0-255
color_off_greenThis parameter determines the brightness of the green color in the initial animation.0-255
color_off_blueThis parameter determines the brightness of the blue color in the initial animation.0-255
animation_delayWith this you can set the duration for the animation. It is specified in milliseconds and describes the display time per pixel.0-500

Overview of the animations

IDdescription
1The LED matrix is filled with the input color from the right and then overwritten with the output color to the left.
2The LED matrix is filled with the input color from the left and then overwritten with the output color to the right.
3A vertical line (in input color) moves from left to right (in output color).
4A vertical line (in the initial color) moves from left to right (in the initial color).
5The LED matrix is filled from both sides towards the center and then dissolved again.
6The LED matrix is filled from the center and then dissolved again.

Example

More detailed information including pictures and videos of the various animations and how you can display them on your pxlBlck are contained in the following article

  • pxlBlck – Configure and display animations

Implementation information

The execution of animations is implemented in such a way that no other tasks can be carried out while the animation is displayed. As a result, the loading of the pxlBlck web menu cannot be continued while an animation is being displayed. In addition, no other commands are processed while the animation is running. However, these should be executed after the animation is finished.


“Cooldown-Time”

The execution of animations is limited in time. This means that the pxlBlck ignores further animation display commands for a while after receiving a command to display an animation.

This time is specified in the source code and cannot be changed during operation. If you want to change this: It is defined with the #define PXLBLCK_ANIMATION_COOLDOWN_TIME.


Examples

In the following paragraph a few example commands and their view on the various pxlBlcks are listed.


Infos:

  • Animation type: 1
  • Delay: 50ms
  • Input color (RGB value): 150,0,0
  • Exit color (RGB value): 0,0,150

Command:

pbani,1,150,0,0,0,0,150,50


Infos:

  • Animation type: 2
  • Delay: 50ms
  • Input color (RGB value): 50,50,50
  • Exit color (RGB value): 0,50,0

Command:

pbani,2,50,50,50,0,0,50,50,


Infos:

  • Animation type: 3
  • Delay: 150ms
  • Input color (RGB value): 50,50,50
  • Exit color (RGB value): 0,50,0

Command:

pbani,3,50,50,50,0,50,0,150,


Infos:

  • Animation type: 4
  • Delay: 50ms
  • Input color (RGB value): 50,50,50
  • Exit color (RGB value): 0,50,0

Command:

pbani,4,50,50,50,0,50,0,50,


Infos:

  • Animation type: 5
  • Delay: 50ms
  • Input color (RGB value): 50,50,50
  • Exit color (RGB value): 0,0,50

Command:

pbani,5,50,50,50,0,0,50,50,


Infos:

  • Animation type: 6
  • Delay: 20ms
  • Input color (RGB value): 50,50,50
  • Exit color (RGB value): 0,50,0

Command:

pbani,6,50,50,50,0,50,0,50,


Infos:

  • Animation type: 5
  • Delay: 20ms (20ms ist die genutzte Standardverzögerung, falls dieser Parameter auf Null gesetzt wird)
  • Input color (RGB value): 150,0,0
  • Exit color (RGB value): 0,0,0

Command:

pbani,5,150,0,0,0,0,0,


Infos:

  • Animation type: 1
  • Delay: 20ms (20ms ist die genutzte Standardverzögerung, falls dieser Parameter auf Null gesetzt wird)
  • Input color (RGB value): 100,100,100
  • Exit color (RGB value): 0,0,0

Command:

pbani,1,100,100,100,0,0,0,


Infos:

  • Animation type: 1
  • Delay: 50ms
  • Input color (RGB value): 150,0,0
  • Exit color (RGB value): 0,0,150

Command:

pbani,1,150,0,0,0,0,150,50


Infos:

  • Animation type: 3
  • Delay: 150ms
  • Input color (RGB value): 50,50,50
  • Exit color (RGB value): 0,50,0

Command:

pbani,3,50,50,50,0,50,0,150


Infos:

  • Animation type: 4
  • Delay: 50ms
  • Input color (RGB value): 50,50,50
  • Exit color (RGB value): 0,50,0

Command:

pbani,4,50,50,50,0,50,0,50


Ich hoffe bei euch hat alles wie beschrieben funktioniert. Falls nicht oder ihr Fragen oder Anregungen habt lasst es mich in den Kommentaren bitte wissen. Ich trage dies dann ggf. in den Artikel nach.
Auch Ideen für neue Projekte sind immer gerne willkommen. 🙂

Fab

P.S. Viele dieser Projekte - besonders die Hardwareprojekte - kosten viel Zeit und Geld. Natürlich mache ich das weil ich Spaß daran habe, aber wenn Du es cool findest, dass ich die Infos dazu mit Euch teile, würde ich mich über eine kleine Spende an die Kaffeekasse freuen. 🙂

Buy Me a Coffee at ko-fi.com

Leave a Reply

Your email address will not be published. Required fields are marked *