Just doing another room and checked again. Yep, it changes. I know what I did. I pushed the wake button to the bottom, got the IDs for the other buttons, added them to my YAML. Moved the wake button to the top, wrote my TFT file. Buttons all gone wrong. Went back to Nextion, moved the wake button to the bottom, checked the IDs. All looks right. Moved the wake button to the top again.
Tonight, I left the wake button at the top and selected the other buttons from the dropdown. Ta da!
I hadnāt really thought it was good enough to share, to be honest, so thank you. Itās not finished yetā¦ I still have a few rooms to do. Iād be happy to share what I have so far if youāre interested. I have Photoshop PSD files, a nice collection of icons from MDI and. of course, the HMI file.
I also like your design and wondered what application you were using to create the UI. I do wish that photoshop could take advantage of the MDI Font rather than downloading each icon as a png. But even better would be if the icon fonts could be imported directly into the Nextion Editor. That would solve for transparency.
Yes, these panels wonāt support transparency. Itās not too bad. I just downloaded a whole bunch from the MDI site and then added a colour overlay in PS. Itās a labour of love
Has anyone ran into a problem with Nextion editor where if you are adding a button, clicks on that button do not register in ESPHome? Any control that I add does no register clicks/action in ESPHome. However, when I upload @masto example, everything works correctly, and I can see touch events in the logs. More then that, if I open @masto HMI file, modify existing buttons and create new TFT, everything is also working fine. Iāve already tried Nextion editor on multiple computers with exactly the same result.
Though it relies a lot of flows outside of Nexion, I am happy to share feedback on pain-points/leads I went through. Most of my advanced HA logic is supported by Node-red thru HA and only a little by automations.
Music screen reflects the common favorites playlists on top, as well as random spotify mixes.
The various icons (couch, home, rabbit) allow to redirect the sound to matching home speakers. It relies on HA spotcast addon and supports the music interactions (vol/play/pause etc) regardless of the current output.
Only three light are showed (first row), the second row are scenes. Each light button supports one-click or double click to turn the time-corresponding expected brightness, or the one ahead in time.
The schematic of a ālampā at the very right of the screen allow to change scenes (clicking right/left on the lamp header). Sliding up/down on the light pole will perform increasing/decreasing the luminosity.
I do not use the relays in the nspanel device, I desactived them from the config - this avoid a clunky noise on click. The buttons remains active so I can catch event in HA.
Upon screen button interactions, HA returns a buzzer instruction back to the nspanel. This is not as good as haptic feedback, but helps a better feeling of interacting with it. Volume canāt be set, so the minimalistic sound has been considered. {āsong_strā:ātwobits:d=32,o=4,b=900:32g#ā}
Screen is dimmed if no usage after some time. Normal and dimmed brightness are adjusted whether this is full day/evening time/deep night. This helps not having another bright screen in the house, the screen is pretty discreet while showing day and temperature readable.
Getting slider value from screen to HA was painful to decrypt in the docs, see below the required code āonreleaseā
printh 91
prints "lightslider",0
printh 00
prints lightslider.val,0
printh FF FF FF
Very well done! I especially like your thoughts behind the light page. I am not fully satisfied with the one I made. I mean it works very well to turn lights on and off, but thanks to HA magic, we very seldom have to do so as the lights are controlled according to what part of day it is (time and darkness) and event in the home. Your setup with a dimmer slider that I assume controls the all lights in the room makes alot more sense as that is an adjustment one actually would like to control!
Hi
I am having the same issue and was wondering what you did to fixed it, I have added the PR inside of the external components but sadly the screen does not boot.
# Set some variables for convenience
substitutions:
node_name: nspanel-demo
device_name: Demo NSPanel
# Note: this may not be needed if the pull request has been merged.
# Check https://github.com/esphome/esphome/pull/2956 for current status.
external_components:
- source: github://pr#2956
components: [nextion]
refresh: 0s
esphome:
name: $node_name
comment: $device_name
esp32:
board: esp32dev
# Enable logging
logger:
# Enable wireless updates
ota:
# Enable Home Assistant API
api:
services:
# Service to play a song
- service: play_rtttl
variables:
song_str: string
then:
- rtttl.play:
rtttl: !lambda 'return song_str;'
- service: upload_tft
then:
- lambda: 'id(disp1)->upload_tft();'
# A reboot button is always useful
button:
- platform: restart
name: Restart $device_name
# Define some inputs
binary_sensor:
- platform: gpio
name: $device_name Left Button
pin:
number: 14
inverted: true
on_click:
- switch.toggle: relay_1
- platform: gpio
name: $device_name Right Button
pin:
number: 27
inverted: true
on_click:
- switch.toggle: relay_2
- platform: nextion
name: $device_name Play Button
page_id: 0
component_id: 2
- platform: nextion
name: $device_name On Button
page_id: 0
component_id: 3
- platform: nextion
name: $device_name Off Button
page_id: 0
component_id: 4
- platform: nextion
name: $device_name Red Button
page_id: 0
component_id: 6
sensor:
- platform: wifi_signal
name: $device_name WiFi Signal
update_interval: 60s
- platform: ntc
id: temperature
sensor: resistance_sensor
calibration:
b_constant: 3950
reference_temperature: 25Ā°C
reference_resistance: 10kOhm
name: $device_name Temperature
- platform: resistance
id: resistance_sensor
sensor: ntc_source
configuration: DOWNSTREAM
resistor: 11.2kOhm
- platform: adc
id: ntc_source
pin: 38
update_interval: 10s
attenuation: 11db
# Grab current temperature from Home Assistant
- platform: homeassistant
id: current_temperature
entity_id: weather.home
attribute: temperature
on_value:
# Push it to the display
then:
- lambda: 'id(disp1).set_component_text_printf("temp", "%.1f ""\xb0""F", x);'
# Define some outputs
switch:
# The two relays
- platform: gpio
name: $device_name Relay 1
id: relay_1
pin:
number: 22
- platform: gpio
name: $device_name Relay 2
id: relay_2
pin:
number: 19
# Pin 4 always needs to be on to power up the display
- platform: gpio
id: screen_power
entity_category: config
pin:
number: 4
inverted: true
restore_mode: ALWAYS_ON
number:
platform: template
name: $device_name Brightness
id: brightness
entity_category: config
unit_of_measurement: '%'
min_value: 0
max_value: 100
step: 1
initial_value: 30
set_action:
then:
- lambda: 'id(disp1).set_backlight_brightness(x/100);'
# Configure the internal bleeper
output:
- platform: ledc
id: buzzer_out
pin:
number: 21
# Enable ringtone music support
rtttl:
id: buzzer
output: buzzer_out
# Configure UART for communicating with the screen
uart:
id: tf_uart
tx_pin: 16
rx_pin: 17
baud_rate: 115200
# Configure the screen itself
display:
- platform: nextion
id: disp1
uart_id: tf_uart
tft_url: http://192.168.1.182:8123/local/nspanel_demo.tft
# A little fun...
on_setup:
then:
- number.set:
id: brightness
value: 30
- lambda: |-
id(disp1).set_component_text_printf(
"temp", "%.1f ""\xb0""F", id(current_temperature).state
);
- rtttl.play: "twobits:d=4,o=5,b=220:c6,8g,8g,a,g,p,b,c6"
I have removed the wifi config just for showing my file.
Hi Edward, the error is tha the url file must be between double quotes. Then it works very easily. A stupid mistake that cost me a long time to find out.
All the best, Felix
