AWTRIX 3 - Blueprint for creating simple apps for dummies

dwadwa3g · September 11, 2025, 6:51pm

Blueprint
AWTRIX 3
via native MPPT on Home Assisant set on Ubuntu

10der · September 12, 2025, 5:42am

native MPPT
your solar device integrated into AWTRIX

ok. got it. no ideas tbh.

      selector:
        device:
          integration: mqtt
          manufacturer: Blueforcer
          model: AWTRIX 3
          multiple: true

blueprint trying to grab all device manufacturer by Blueforcer with model AWTRIX 3
so, if you what help me and yourself you can comment
in bprint
selector:
device:
integration: mqtt
manufacturer: Blueforcer
# model: AWTRIX 3
multiple: true
reload in HASS automation and see what right now

matt12 · October 3, 2025, 8:07pm

@10der Do you know if it is possible to have a static clock app that shows the clock and a sensor value? ie something like [10c 10:46]
I can see a way to push the updates from home assistant every 60 secs but I’d prefer to not rely on the wifi connection etc to update the clock. So is it possible to use the clock in the device as a value and push the value from the temp sensor in HA?

10der · October 4, 2025, 5:09am

Interesting… let me check

10der · October 4, 2025, 12:04pm

alias: AWTRIX - TEST - DEL ME
description: ""
use_blueprint:
  path: 10der/awtrix-simple.yaml
  input:
    awtrix_device:
      - eb5a6a7b7cdea5bb00cf794599e8fc17
    user_options:
      duration: 1
      text: ""
      draw:
        - dt:
            - 0
            - 1
            - "{{value_temperature}}°"
            - "{{color}}"
        - dt:
            - 12
            - 1
            - "{{time}}"
            - "#FFFFFF"
    app_name: awtrix_app_del_me
    entity: sensor.home_temperature
    additional_options:
      colors:
        "0": "#00ff7f"
        "5": "#00ff2a"
        "10": "#2aff00"
        "15": "#7fff00"
        "20": "#d4ff00"
        "25": "#ffd400"
        "30": "#ff7f00"
        "35": "#ff5f00"
        "-15": "#007fff"
        "-10": "#00d4ff"
        "-5": "#00ffd4"
      value_temperature: "{{states(entity_id) | round(0, 'floor', 0) }}"
      color: |-
        {{colors[(colors.items() | 
            map(attribute='0') |  
            map('int') |  
            sort | select('>=', value_temperature ) | 
            first) | string]}} 
      time: "{{ now().strftime('%H:%M') }}"
    extra_triggers:
      - trigger: time_pattern
        minutes: /1

awtrix (6)

do not try to pass “every second” and implement blinker
{{ now().strftime('%H') }}{{ ':' if now().second % 2 == 0 else ' ' }}{{ now().strftime('%M') }}
it will be overhead.

10der · October 4, 2025, 12:08pm

btw: you can’t mix default clock app with own data.

Chykan · October 4, 2025, 12:21pm

Here is a node red flow that replicates the default clock with customisations.

Just import into node red to use, temperature could be added

[{"id":"aa0f712d4983c11b","type":"group","z":"c29e36f478fc3db8","name":"Clock and Calendar","style":{"label":true},"nodes":["18a56279.3119a6","b04e8bae.ac1f","593cd673.a975a"],"x":114,"y":2379,"w":1172,"h":82},{"id":"18a56279.3119a6","type":"function","z":"c29e36f478fc3db8","g":"aa0f712d4983c11b","name":"Format LCD","func":"const hoje = new Date()\n\nvar dia = hoje.getDate()       \nvar diaDaSemana = hoje.getDay()\nvar hora = hoje.getHours()\nvar minutos = hoje.getMinutes()\nvar corDiaSemana = \"#09d602\" // color for current day of the week\n\nif (diaDaSemana == 0) {\n    diaDaSemana = 0   // conversion to monday starting week\n    corDiaSemana = \"#d60202\"  // red mark for sunday\n}\n\n// add leading 0 to days, hours and minutes <10\nif (dia<10) {\n    dia = \"0\" + dia\n}\nif (hora<10) {\n    hora = \"0\" + hora\n}\nif (minutos<10) {\n    minutos = \"0\" + minutos\n}\n\nmsg.payload = \n\n{\"draw\":[  \n {\"df\": [1,2,9,7, \"#FFFFFF\"]},  // draws day of month box  \n {\"df\": [1,0,9,2, \"#FF0000\"]},\n \n {\"dt\": [2, 2, dia, \"#000000\"]}, // draws day of month\n {\"dt\": [13, 1, hora + \":\" +  minutos, \"#FFFFFF\"]}, // draws the clock\n \n {\"dl\": [11,7,12,7, \"#666666\"]}, // draws days of week markers\n {\"dl\": [14,7,15,7, \"#666666\"]},\n {\"dl\": [17,7,18,7, \"#666666\"]},\n {\"dl\": [20,7,21,7, \"#666666\"]},\n {\"dl\": [23,7,24,7, \"#666666\"]},\n {\"dl\": [26,7,27,7, \"#666666\"]},\n {\"dl\": [29,7,30,7, \"#666666\"]},\n {\"dl\": [11+(diaDaSemana)*3,7,12+(diaDaSemana)*3,7, corDiaSemana] // draws current day of week mark\n }  \n],\n \"pos\": 1,\n}  \n\nreturn msg;","outputs":1,"timeout":"","noerr":0,"initialize":"","finalize":"","libs":[],"x":870,"y":2420,"wires":[["b04e8bae.ac1f"]]},{"id":"b04e8bae.ac1f","type":"mqtt out","z":"c29e36f478fc3db8","g":"aa0f712d4983c11b","name":"App Data Clock","topic":"awtrix_lounge/custom/clockCalendar","qos":"2","retain":"false","respTopic":"","contentType":"","userProps":"","correl":"","expiry":"","broker":"34f7583aa6e3efb2","x":1180,"y":2420,"wires":[]},{"id":"593cd673.a975a","type":"inject","z":"c29e36f478fc3db8","g":"aa0f712d4983c11b","name":"1x/min","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"*/1 0-23 * * *","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":220,"y":2420,"wires":[["18a56279.3119a6"]]},{"id":"34f7583aa6e3efb2","type":"mqtt-broker","name":"core-mosquitto: 1883 192.168.2.40","broker":"core-mosquitto","port":"1883","clientid":"","autoConnect":true,"usetls":false,"protocolVersion":"4","keepalive":"60","cleansession":true,"autoUnsubscribe":true,"birthTopic":"","birthQos":"0","birthPayload":"","birthMsg":{},"closeTopic":"","closeQos":"0","closePayload":"","closeMsg":{},"willTopic":"","willQos":"0","willPayload":"","willMsg":{},"userProps":"","sessionExpiry":""}]

The key Javascript code in the flow, can be modified to add temp.

const today = new Date();
let day = today.getDate();
let dayOfWeek = today.getDay();
let hour = today.getHours();
let minutes = today.getMinutes();

let weekDayColor = "#09d602";  // default color for current weekday

if (dayOfWeek === 0) {
  // If Sunday, treat specially (if your week starts Monday)
  dayOfWeek = 0;  // keeps Sunday as index 0
  weekDayColor = "#d60202";  // red highlight for Sunday
}

// Add leading zeros for single-digit day, hour or minutes
if (day < 10) {
  day = "0" + day;
}
if (hour < 10) {
  hour = "0" + hour;
}
if (minutes < 10) {
  minutes = "0" + minutes;
}

msg.payload = {
  draw: [
    { df: [1, 2, 9, 7, "#FFFFFF"] },        // draw box for day of month
    { df: [1, 0, 9, 2, "#FF0000"] },
    { dt: [2, 2, day, "#000000"] },         // draw day-of-month text
    { dt: [13, 1, hour + ":" + minutes, "#FFFFFF"] },  // draw clock text
    { dl: [11, 7, 12, 7, "#666666"] },      // draw day-of-week markers
    { dl: [14, 7, 15, 7, "#666666"] },
    { dl: [17, 7, 18, 7, "#666666"] },
    { dl: [20, 7, 21, 7, "#666666"] },
    { dl: [23, 7, 24, 7, "#666666"] },
    { dl: [26, 7, 27, 7, "#666666"] },
    { dl: [29, 7, 30, 7, "#666666"] },
    {
      dl: [
        11 + (dayOfWeek) * 3,
        7,
        12 + (dayOfWeek) * 3,
        7,
        weekDayColor
      ]
    }  // draw current weekday marker
  ],
  pos: 1
};

return msg;

10der · October 4, 2025, 8:16pm

The key from topic starter - assistant every 60 secs but I’d prefer to not rely on the wifi connection etc to update the clock.

So, if Wi-Fi is dead your node red task for clock is dead as well

matt12 · October 9, 2025, 4:31pm

Thanks. The app above works brilliantly, but it still relies on Home Assistant sending it every 60 secs I have gone through the code on github and I can’t see the system time value being surfaced anywhere (I may be missing something though).

10der · October 9, 2025, 7:25pm

github.com/Blueforcer/awtrix3

src/Apps.cpp

b777dfa70

#include "Apps.h"

#include <map>
#include "icons.h"
#include "MatrixDisplayUi.h"
#include "Functions.h"
#include "MenuManager.h"
#include "PeripheryManager.h"
#include <WiFi.h>
#include "effects.h"
#include "MQTTManager.h"
#include "Overlays.h"
#include "timer.h"

const uint8_t bigdigits_mask[12][7] = {
    {132, 48, 48, 48, 48, 48, 132},      // 0
    {204, 140, 204, 204, 204, 204, 0},   // 1
    {132, 48, 240, 196, 156, 48, 0},     // 2
    {132, 48, 240, 196, 240, 48, 132},   // 3
    {228, 196, 132, 36, 0, 228, 192},    // 4

This file has been truncated. show original

10der · October 9, 2025, 7:32pm

but again: native apps doesn’t have any dynamic api options. you can’t mix own data and clock time.
so, you can simple disable calendar in time app via TMODE but (again) you can’t draw own data in place of calendar.

alas

cediqqu · October 26, 2025, 1:46pm

Can you share the Blueprints for the http Brigde? Thanks!

10der · November 4, 2025, 3:28pm

github.com/10der/new-awtrix3-hass-integration

awtrix3-simple.yaml

0f1ce26ce

blueprint:
  name: AWTRIX show entity
  description: Show entity
  domain: automation
  input:
    app_name:
      name: (Required) Application name
      description: "Application name"
      default: "awtrix_app"
      selector:
        text:
          multiline: false
          multiple: false

    app_icon:
      name: Application Icon
      description: "Application icon"
      default: ""
      selector:
        text:

This file has been truncated. show original

Massimo_Pagani · January 30, 2026, 11:04am

Hi, I’m experimenting with your new integration.
Can you please show how to use the new awtrix3-simple.yaml blueprint to show different colors for an outdoor temperature sensor like the first example given in this thread for the old integration?

Thanks

Tgx

10der · January 30, 2026, 12:51pm

maybe I am not catching your question.
but all user code is compatible with old (mqtt) and new (http) blueprint.
so you can simple use code from example

Massimo_Pagani · January 30, 2026, 4:33pm

I made it work. Thanks

10der · January 30, 2026, 5:29pm

hint:

alias: AWTRIX - HOME_TEMPERATURE
description: ""
use_blueprint:
  path: 10der/awtrix-simple.yaml
  input:
    app_name: awtrix_app_home
    entity: sensor.home_temperature
    suffix_text: °
    awtrix_device:
      - cba036557ec6a93c46e1772448fac471
      - eb5a6a7b7cdea5bb00cf794599e8fc17
    app_icon: "96"
    user_options:
      color: "{{color}}"
    additional_options:
      value_template: "{{states(entity_id) | round(0, 'floor', 0) }}"
      color: |-
        {% set temp = value_template | float %}
        {% set t_min, t_max = -15, 35 %}
        {% set h_min, h_max = 240, 0 %}
        {% set t_clamped = [ [t_min, temp] | max, t_max ] | min %}
        {% set ratio = (t_clamped - t_min) / (t_max - t_min) %}
        {% set hue = (h_min + ratio * (h_max - h_min)) | int %}
        {% set h = hue / 360 %}
        {% set s = 1.0 %}
        {% set v = 1.0 %}
        {% set i = (h * 6) | int %}
        {% set f = h * 6 - i %}
        {% set p = v * (1 - s) %}
        {% set q = v * (1 - f * s) %}
        {% set t = v * (1 - (1 - f) * s) %}
        {% if i % 6 == 0 %} {% set r, g, b = v, t, p %}
        {% elif i == 1 %} {% set r, g, b = q, v, p %}
        {% elif i == 2 %} {% set r, g, b = p, v, t %}
        {% elif i == 3 %} {% set r, g, b = p, q, v %}
        {% elif i == 4 %} {% set r, g, b = t, p, v %}
        {% else %} {% set r, g, b = v, p, q %}
        {% endif %}
        #{{ "%02x%02x%02x" | format((r*255)|int, (g*255)|int, (b*255)|int) }}
    prefix_text: "{{ '+' if value_template > 0 }}"
    extra_triggers:
      - trigger: time_pattern
        minutes: /15