Unofficial Nextion/TJC User Forum

I wanted to have the screen swap between two background pictures pic0 and pic 1

Hi , I am just starting with Nextion and following a tutorial I have a screen with 2 buttons and a text box

When I press the on button the text window says on and the off button changes the text to off.
They also turn an LED on the Arduino off and on , so far so good

I wanted to have the screen swap between two background pictures pic0 and pic 1 depending on if I had pressed off or on button

by putting this in the arduino code at the place where it acted on the buttons I achieved my aims ,
the screen swapped between pic 0 and pic 1

Serial.print("p0.pic=0");
Serial.write(0xff);
Serial.write(0xff);
Serial.write(0xff);

or

Serial.print("p0.pic=1");
Serial.write(0xff);
Serial.write(0xff);
Serial.write(0xff);

The problem is , when it changes the screen it over writes the buttons so you cant see where to press to swap back

How do I make the buttons stay on top and visible or is there a way to make holes in the pics for the buttons to show through . I assume its something to do with crop but I cant understand how to do it

Can any one help please

BTW I am a total Nextion noob so dont be suprised if I ask a lot more questions in the next weeks

Stay Safe

Don

Instead of using a pic object as a background image, delete it and change the background image attribute of the page object itself.
This will keep all other objects on top.

1 Like

hello guys, I’m doing the same as you, but without success, I would like to press a button and figure 1 appears, so when I press on figure 1 it disappears, but I can’t even get the basics, take a look at my program below

#include <SoftwareSerial.h>
#include <Nextion.h>

SoftwareSerial nextion(3,1);// Nextion TX to pin 2 and RX to pin 3 of Arduino

Nextion myNextion(nextion, 9600); //create a Nextion object named myNextion using the nextion serial port @ 9600bps

void setup() {
//Serial.begin(9600);
myNextion.init(); // send the initialization commands for Page 0

}

void loop() {
nextion.write(“p2.pic=0”);
nextion.write(0xff);
nextion.write(0xff);
nextion.write(0xff);
delay(3000);
Serial.print(“p0.pic=1”);
Serial.write(0xff);
Serial.write(0xff);
Serial.write(0xff);
delay(3000);
Serial.print(“p2.pic=0”);
Serial.write(0xff);
Serial.write(0xff);
Serial.write(0xff);
delay(3000);
Serial.print(“p0.pic=1”);
Serial.write(0xff);
Serial.write(0xff);
Serial.write(0xff);
}

Look at the PIN numbers when you declare SoftwareSerial. (3,1) would mean Nextion Tx on 3 and Nextion Rx on 1. The latter interferes with the hardware UART.

I’m using esp32, so for this serial port

Okay, I don’t know the Nextion Arduino Library and it’s been a few years since I used Arduino the last time. So maybe I shouldn’t try to evaluate your code. On the other side these days knowledge is no more required for having an opinion on anything so here we go…

You’re mixing the software serial nextion with the hardware serial Serial and they probably don’t operate on the same pins. So the first part of the data goes to your nextion serial, and all the rest, after the first delay, goes to your (USB?) serial.
Additionally you use nextion.write to send the string “p2.pic=0” - AFAIK if you want to send a string you have to use the print method, not the write method.

Hope this helps,
Max


This forum is in no way affiliated with NEXTION®, ITEAD STUDIO®, TJC®, or anyone else really. All product names, logos, and brands are property of their respective owners. All company, product, and service names used in this website are for identification purposes only. Use of these names, logos, and brands does not imply endorsement from the respective rights holder(s).