Adjust Screen Brightness with The Nextion Slider

With the Nextion Slider feature, we change the screen brightness. You can adjust the brightness you want directly through Nextion without the need for Arduino or a similar development card.

First of all, start by selecting the screen you want to make the application on the installation screen, add it to your screen by clicking on the "Slider" element from the toolbox when you come to the editor and toolbox screen.

nextion slider

After adding the Slider element to the screen design, we will see such an outcome.

nextion slider

you can place this slider element in any location, change its colors and size, you can do these features from the "Attribute" tab on the right side of the editor

nextion slider

After adjusting its appearance to your liking, we can proceed to place the brightness code in the slider.

When you're in the editor, click the slider that we've positioned on the screen, and then switch to the Touch Move section on the Event tab just below it, and then click on the code written in the Touch Move section; they are codes that were run at the time of the touch operation, so in this project it is important that this section is where we enter the codes.

Program Codes

nextion slider

Here the h0.val variable is the variable that gives the slider its value at the time. The dims variable is a system variable in which we control the brightness value, and changes to the dims variable are recorded on the device by default. If you use the dim variable instead of dims here, the existing save event in the dims variable does not occur when the power of the screen goes back and forth, and the changes made are valid one time.

Description of Program Codes

Here, the reason we use the if loop is to prevent the screen brightness from being 0, when this system variable, which changes to percentage value, becomes completely dark, you can provide a solution by making the slider's minval value 1 instead of the if loop to prevent this event.

nextion slider

Extra: Printing Screen Brightness Value

If you want to see instant screen brightness, you can follow the instant changes in slider from thisNumberelement by adding one " Number " element to the project and these codes where necessary. The n0.val variable is the value of the element "Number".

To the "Preinitialize" section of the screen:


Into the if loop that we added to slider:

nextion slider

The preinitialize part is used for codes to be run as soon as power comes to the screen, where we equalize the value of the slider at n0.val, so that we can see directly what brightness remains in the power outages, including at the beginning.

Project Files

We created this project for a 2.8" screen, so if you have a NX3224T028_011 on your screen, i.e. a 2.8" Nextion HMI screen, you can download and review project files directly

Recent Images