Upload an image to Nextion Intelligent series


Anybody found a way to upload images from ESPHome to Nextion Intelligent display?

I found the command in the instruction set Instruction Set - Nextion
twfile Advanced**. Transfer file over Serial
usage: twfile filepath,filesize
filepath is destination path and filename quote encapsulated text
filesize is the size of the file in bytes.|
twfile “ram/0.jpg”,1120// transfer jpg over serial to ram/0.jpg size 1120 bytes
twfile “sd0/0.jpg”,1120// transfer jpg over serial to sd0/0.jpg size 1120 bytes

Using the ExPicture component in the Nextion Editor allows you to display an image stored in RAM or on the SD card.

Thank you!

Hi alex, have you found a way to implement the twfile command? I would be very interested to see. I am trying myself and will share if I can report success. Weird that Nextion is not sharing any examples. Would be a great feature.

1 Like

Hi, I didnt have time to play with it but i found the documentation.

You first need to create an account on Registration Form ‹ Nextion — WordPress

Then you can read the documentation here:

I will post my conclusions here if i will be able to make it work, but for now im a bit busy doing other things.

Could you maybe explain what you are trying to achieve? My ESP stuff is not cable-connected when in operations so when/why would you want to transfer pictures over cable? At least out of (my) curiosity :slight_smile:

I want to create a wall touch display remote for Yamaha Muscicast devices using Esphome and Nextion display. I also want to display the current song cover art when it is available so i need a way to upload it to RAM or SD Card .

Understood and nice idea… so you want it cabled all the time? I only have a nspanel so not much to play with … but was thinking about loading camera-pictures in case of person-detection. OTA it only works via nextion editor so no chance for me

No sure what you mean by cabled, the eps32 board will be connected to wifi all the time and will control the display.
Yes, the upload will only work for Intelligent displays and the one in the nspanel is the basic one.

From the description I read that it is Serial transfer so was assuming a cabled connection or are you planning to load all files at once ? Meaning…if I would be able to load puctures via wifi on command then I would be very happy as well :slight_smile:

That is actually exactly what I am trying to achieve as well, except it’s for a car radio. A Teensy 4.1 would be sending the data.

I am able to extract the cover art from the mp3 and save it to the sd in the Teensy as a jpg. That actually works fine. I then copied that jpg “physically” to another sd and tried to load that into an ExPicture element. Sadly, the image shows up distorted, as if each pixel rows get shifted over. So maybe there is more going on.

Right, so I am starting on a function to send a jpg to the SD in the Nextion display. I am still not sure I understand what’s going on, but my function so far looks like this:

void nextionFunction::sendPicture(int16_t dataSize)
  // send pkConst.

  // send pkID. not sure what to send. is this linked to the twfile command so it knows where the data needs to go?

  // send vType. CRC not really needed for starters since data is not all that critical. maybe later

  // send dataSize. not quite sure what to send. the file size?

  // send fileData. not sure what to send. do I send the whole file.read() at once?

The “twfile” command is sent before I call the above function. The twfile command does indeed create a new file with the size that I specified (in bytes). Naturally the file remains empty since it does not yet get filled with data. Funny though, I make a call to create a file with the name “cover.jpg” and get a file called “cover.jpg.tm”. Not sure what .tm means.

There are still a few points that are unclear about how to implement this. It would be great to see a full working example from Nextion.

I’ll keep at it and report progress, but help would of course be appreciated.

So, to anyone who is interested: I have not had much success in trying to send the cover art over serial. Even if I got the code to work, the ExPicture object expects the image to be the exact size of what you set it to. I do not know how to do that on the fly. So unless someone finds a solution for both problems, i.e. working code to send the image and making the image the right size, this approach is pretty much dead for me. Oh well, was a fun experiment…

Correction: Nextion is just a bit picky about how JPGs are saved. Not sure yet regarding the cause but some JPGs show up all shifted and distorted in the ExPicture element. Having an oversized image still displays, but gets cropped. And at some file size/image dimension, they don’t get displayed at all. The end result is pretty much the same for me, can’t upload images straight from an mp3 APIC tag to the Nextion display. Just wanted to set things straight.

Does anyone have success on it? Im looking for this topic in 2022

1 Like

Greetings, I come from 2023 - has anyone found out how to get this sorted?

I managed to upload the photo to the SD card with twfile but to show the picture in the ExPicture i can only do it if I convert first to .xi file using PictureBox in the tools.