Sonoff NSPanel by ITead - Smart Scene Wall Switch based on ESP32 and custom Nextion Touch Screen Panel Display (non-Pro variant)

@krizkontrolz This is a massive work !
I’m having the EU version , so I will need to do my own HMI.
For the demo, I’m trying it and I achieved to complete and it’s running.
Only the motion sensor are not updated on the screen. I miss something on how to update the screen…
I still need to work a lot in order to understand how it works but it’s awesome.

A lot of my light are using motion sensor. If the light is On by the motion, the screen is not updated. Then the state is the reverse of what is in reality. For the moment, I don’t know how to do to update the status in NSPanel.

v2loading
v2screensaver
v2home
v2lights
v2music

8 Likes

Hi @zigomatic. It will be great to get some other people using this, so I’m very happy to help you get going. What do you have configured and working so far, or are you mainly testing out HMIs in the Nextion Editor simulator?

I’m working on an updated demo/debug HMI template this weekend. I could start modifying that so that it doesn’t use the cropped portion of the EU screen (although it would still be in portrait orientation). Would most/all people with the EU version mount them in landscape orientation (and therefore need HMI templates that way instead)?

I haven’t had time to look at your project yet.
I have just looked at some of the code not the nextion file.

But yes, they have to be mounted landscape unless you make modifications to the walls since the mounting holes are horizontally placed.

@lovejoy777
Very nice!

1 Like

@krizkontrolz Hello Kriz, After a restart of NSPanel, I get all running. States are populated. From demo point of view, it’s all functionnal and react perfectly.
Python code, HMI code, ESHhome code + automation + markdown for lovelace. Everything is working. Again I found really impressive all the work done.

It may be interesting to have example with 2 pages if possible in order to see where the code need to be implemented. I’m still not fully understand HA_Set1…5 and how it works. [edit: OK I see other HMI files with more than one page, that will help]

Example: int dim_default=20 seems to be able to be managed in HA but I don’t find how to change that dynamicaly for isntance

For EU version, The orientation is different of US Version. Buttons are below the screen. I also see people putting this in the program.s → lcd_dev fffb 0002 0000 0020 to solve a calibration issue apparently. Also I see people using image with 455*287 as definition.

Now, I will try to start with a simple hmi version but my final version would have:

  • More than one page
  • temperature + group of light of a room
  • temperature + light of a room + increase / decrease luminosity
  • one row with some informations from some sensors (lux, humidity, % etc)
  • wifi status
  • wled support
  • domestic hot water + boiler states
  • notifications → visual or/and via a song with config different based daytime / night / sleep
  • same as minimalist design of hacs like mushroom

size needs to be 452x320 for eu
also you are correct to include that offset code in program.s

edit: but still make images 480 wide just dont use that last bit. center is obviously 226, i work my ui’s off that point.

2 Likes

to change page programmatically you simply issue command.
dp=0
this loads page 0

or from esphome yaml

 
 ​        - ​lambda​: ​id(disp1).send_command_printf("page 0");

Thanks @lovejoy777. Are the ‘missing’ column of 28 pixels on the RIGHT of the display in the HMI editor (to match the typical physical mounting of EU versions)?

Yes that is correct

1 Like

That’s great to hear. I take it you have used the demo HMI from the the old v0-4 folder on GitHub to get started (and have now found the current_version (v0.5) folder with the latest multi-page HMI example - the newer Python script and HMI boilerplate adds quite a lot of improvements). I’ve just uploaded my latest working HMI (with a neon-blue theme and more demo/debug pages to demonstrate and test gestures - the circular slider code is working, but I still have to add the sequence of images for it to crop). Swipe down on any non-popup page to get the Setting/CFG page with sliders to control screen dimming and other Program.s variables that control the UPDATE_LOOP behaviour.

Example_CFG

To get to the debug pages tap on the words Rain delay at the bottom of the irrigation page.
(On regular ‘main’ pages, swipe left/right to cycle through them.)

The HA_Set1…5 strings store the sequence of commands to pull all the data you want into each page by specifying what Home Assistant (HA) data is written to which Nextion variables. The Post Init Event boilerplate code on each page writes these strings to ESPHome, which passes them on to HA. The HMI UPDATE_LOOP (a timer, with behaviour controlled by the settings above) then toggles a TRIGGER value to tell HA when to run the Python service to execute the instructions in the HA_Set strings (which writes updated HA data to the specified Nextion variables - then it execute the APPLY_VARS subroutine on the Nextion - you put all the code you use to visualise data updates on the Nextion display in this subroutine so that HA can control the timing of display refreshes to apply the new data immediately after it is sent.) For example, in the screenshot of the settings above, the UPDATE_LOOP is set to fetch HA data every 15 seconds when there is no user activity and then sleep after 5 mins (and the screen will gradually dim from 100% to 80% over that period, as per slider settings). The ‘Fast repeats’ tells it that whenever a UI Event sends an action instruction to HA, it should do 3 fast updates (slowing down by an extra 2 seconds each update) - this allows the Nextion to capture both rapid and laggy responses in state changes in HA. I hope that answers your query.

Thanks - I will add that code & note (commented out) to the HMI template.

Hi Kritz,

Thank you for your answer, very helpfull.
Yes, I was starting with the demo HMI. Now, I’m exploring the content of other HMI which have a lot of new functions :slight_smile:
Thanks for sharing the new version V0.5. It is so great that you continue to improve.
On my side, I’m understanding more Nextion UI but I will need some days to start with my own test based on your solution :slight_smile:

here’s my V2 code.

3 Likes

Little Update on my Project, this should cover the most important changes since the last update in this thread:

  • Added Support for US Versions (Portrait and Landscape)
  • Added Alarm Panel Card
  • Added localization for a ton of languages

Full Feature List:

  • Entities Page with support for cover, switch, input_boolean, binary_sensor, sensor, button, number, scenes, script, input_button and light
  • Grid Page with support for cover, switch, input_boolean, button, scenes, and light
  • Detail Pages for Lights (Brightness, Temperature and Color of the Light) and for Covers (Position)
  • Thermostat Page
  • Media Player Card
  • Alarm Control Panel
  • Screensaver Page with Time, Date and Weather Information
  • Localization possible (currently 38 languages)
  • Everything is dynamically configurable by a yaml config, no need to code or touch Nextion Editor

Example Screens from EU Version:

Some (not all) Screens from Portrait US Version:

12 Likes

Hello friends I need some help with my NSPANEL with the TASMOTA firmware, I managed to perform all the configurations and integrate it with MQTT but I am having difficulties connecting other devices through its widget, in my scenario I have eight more sonoff TX switches all also with tasmota and connected in MQTT

Here is what my panel looks like at the moment.
All actions are carried out in Home Assistant. The ESP is just a messenger between the two.
The panel sets a variable and this is listened for in ESP-Home and passed on to Home Assistant as a sensor and I use a normal automation to do the actions.
I have some areas that can be made better, but I don’t have a full flash memory yet so I can keep it for now.

5 Likes

Your panel looks awesome !
Can you share you code?

I can give it a try.
I have never used GitHub so it can take a while to get it up.

I am sure you’ll manage it. Otherwise, there are a lot of hands on available on line how to use github

I hope this is enough.
I think I have commented enough so that those who read the readme can adopt it to their panel.