Easy Basics: Project 081b Arduino Uno DHT 11 12 22 sensor and Nextion HMI display

of Acoptex.com in UNO

Basics: Project 081b

Project name: Arduino Uno, DHT 11 12 22 and Nextion HMI display

Tags: Arduino, Arduino Uno, How to use the Nextion Editor, Nextion, Nextion HMI display, Smart LCD Display Module, NX4832T035_011, Nextion editor, IM150918001, DHT 11 12 22 sensor, tepmerature and humidity module

Attachments: library1library2library3projectfiles, sketch

In this project, you needed these parts (Dear visitors. You can support our project buy clicking on the links of parts and buying them or donate us to keep this website alive. Thank you):

1. NEXTION HMI Display NX4832T035_011 1 pc

Package normally includes: Nextion Display, connecting wire, a power supply test board.

2. Nextion editor v 0.53 ( you can download it from here  )

3. Micro USB cable 1 pc

4. Phone charger 5V DC 0.5A 1pc (it can be different - depends on your display model)

5. Micro SD card with adapter 1 pc (optional)

6. USB to TTL/Serial adaptor/converter 1 pc

7. DHT11 or DHT21 or DHT22 sensor - 1 pc

8. Resistor (1 KOm 1 pc, 220 Ohm 2 pcs)

9. LED 2 pcs (red and green, can be different colors)

10. Jumper cables M-M

11. Breadboard 1 pc

12. Arduino IDE ( you can download it from here  )

13. Arduino Uno R3 (you can also use the other version of Arduino)


We will learn how to display the temperature and humidity from DHT 11 12 22 sensor on Nextion HMI display module.

Understanding the USB to TTL/Serial adaptor/converter

You can read more about USB to TTL/Serial adaptor/converter  here.

Understanding the Nextion HMI display

You can read more about it here.

Commands used with Nextion explained here.

Understanding DHT humidity and temperature sensor

You can read more about it here.

Datasheet can be found here.

Signals and connections of LED

The operating voltage of the LED is 1.8V and the operating current is 10mA-20mA. The Arduino Uno board can supply 5V or 3.3V power. We will use 5V for this project, so the minimum resistance of the current limiting resistor should be (5 V to 1.8 V)/20 = 160 Om. The 220 Om offered in the kit is suitable and you can also choose other resistors that meet the condition. The larger the resistance is, the dimmer the LED will get.

Signals and connections of DHT11 module

There are 3 : VCC (+5V), Data, GND (-)

Signals and connections of the Nextion HMI display module

Nextion HMI display module has four pins: power supply +5V DC, ground GND,  transmit TX,  receive RX.


1. Powering the Nextion HMI display module

Note: the small power supply test board and connecting wire inside the package allow you to test if the electrical supply is enough or not. See the image below on how to use it.

2. Uploading .TFT file to the Nextion HMI display module

3. Using the Nextion HMI display module with Arduino UNO

Step by Step instruction

Steps from 1 to 10 described in project Basics: Project 081a How to use the Nextion Editor with Nextion HMI display

  1. Download and install the Nexion Editor.
  2. Create a new project in the Nextion Editor.
  3. Add a background image.
  4. Add fonts.
  5. Adding text labels, sliders and buttons.
  6. Add touchable components.
  7. Create a new page and make navigation between pages.
  8. Test the interface in the simulator.
  9. Compile and upload code to the Nextion HMI display
  10. Install required libraries. Modify the NexConfig.h file as described below in Code section for use of Arduino Uno.
  11. Do wiring.
  12. Plug your Adruino Uno board into your PC and select the correct board and com port.
  13. Verify and upload the the sketch to your Adruino Uno. Note: make sure that you remove the TX and RX connections when uploading code.
  14. With the Nextion GUI and the code on the Arduino, you should be able to control the Arduino pins from the Nextion HMI display. Tap the ON and OFF buttons to turn on/off red led and move the slider to control green led brightness. On the second screen, tap the Refresh button to get with the latest DHT sensor readings.


Once the Nextion GUI is ready, you need to write the Arduino code so that the Nextion can interact with the Arduino and Arduino with Nextion. 

Take a note of your components in the Nextion GUI that will interact with the Arduino (their ID, names and page). See the example below:

Objname Type  Page ID

tState text 0 7

bON     button 0 3

bOFF     button 0 4

h0       slider 0 2

tSlider text 0 6

tTempC text 1 6

tTempF text 1 7

jHumidity Progress bar 1 3

tHumidity text           1 11

bRefresh button        1 8

Let's descuss the code. First, you include the Nextion and the DHT libraries. The DHT sensor will be attached to the Arduino digital pin 4. Then you should select the DHT type you will use and initialize the DHT sensor: DHT dht(DHTPIN, DHTTYPE);

After that, you define led1 and led2. These variables refer to the Arduino digital pins 8 and 9 respectively (led 1 will be controlled with the ON and OFF buttons of the user interface, and led2 brightness will be controlled using the slider).

You need to declare all your Nextion objects, you need the page, the component ID and name – just check the table above with all the components. To define a text you use NexText, to define a button you use NexButton, for a slider you use NexSlider and for the progress bar you use NexProgressBar.

Next, you should add in the following snippet all the touchable components that should trigger events on the Arduino.

NexTouch *nex_listen_list[] = {







You should create callback functions that will be triggered when you touch the corresponding components.

The following function will be triggered when you release the touch from the bOn button:

void bONPopCallback(void *ptr) {

    tState.setText("State: on");

    digitalWrite(led1, HIGH);


This function will set the green led to HIGH, as well as update the tState label with the text “State: ON”. Updating text labels is as simple as using setText().

The bOFF button works in a similar way:

void bOFFPopCallback(void *ptr) {

    tState.setText("State: off");

    digitalWrite(led1, LOW);


For the slider (h0), you have the following function that writes the current slider position on the tSlider label and sets red led brightness accordingly:

void h0PopCallback(void *ptr) {

    uint32_t number = 0;

    char temp[10] = {0};


    utoa(number, temp, 10);


    analogWrite(led2, number); 


Finally, you need a function for the bRefresh (the Refresh button). When you click on this button the DHT temperature and humidity sensor reads temperature and humidity and displays them on the corresponding labels, as well as the humidity on the progress bar. That is the bRefreshPopCallback() function.

Inside that function, the following snipet reads temperature and humidity:

float h = dht.readHumidity();

 // Read temperature as Celsius (the default)

 float t = dht.readTemperature();

 // Read temperature as Fahrenheit (isFahrenheit = true)

 float f = dht.readTemperature(true);

// Check if any reads failed and exit early (to try again).

 if (isnan(h) || isnan(t) || isnan(f)) {

 //Serial.println("Failed to read from DHT sensor!");



This code writes the temperature in celcius on the tTempC label:

static char temperatureCTemp[6];

dtostrf(t, 6, 2, temperatureCTemp);


To update the temperature in Fahrenheit:

static char temperatureFTemp[6];

dtostrf(f, 6, 2, temperatureFTemp);


To update the humidity label and the progress bar:

char hTemp[10] = {0};

utoa(int(h), hTemp, 10);



To set the value of the progress bar you simply use setValue().

In the setup(), you need to attach the functions created to the corresponding events. For example, when you click on the bON button, the bONPopCallback function will be triggered.

    bON.attachPop(bONPopCallback, &bON);

    bOFF.attachPop(bOFFPopCallback, &bOFF);


    bRefresh.attachPop(bRefreshPopCallback, &bRefresh;

In the loop() when an event occurs, the corresponding function will be triggered.

We have attached the ITEADLIB_Arduino_Nextion library on the begining of this project description. This library is configured for Arduino MEGA2560 by default. To make it work for Arduino Uno, you need to do the following:

  1. Open the ITEADLIB_Arduino_Nextion folder.
  2. There should be a NexConfig.h file – open it with Notepad integrated in Windows OS or additionally installed Notepad Plus.
  3. Comment line 27, so that it stays as follows: //#define DEBUG_SERIAL_ENABLE
  4. Comment line 32: //#define dbSerial Serial
  5. Change line 37, so that you have the following: #define nexSerial Serial
  6. Save the NexConfig.h file.


We learnt how to display the temperature and humidity from DHT 11 12 22 sensor on Nextion HMI display module.


  • See attachments on the begining of this project description
  • ITEADLIB_Arduino_Nextion library included. Download, unzip and add to libraries in your PC, for example C:\Users\toshiba\Documents\Arduino\libraries or in C:\Program Files (x86)\Arduino\libraries. This link you can find in Preferences of Adruino IDE program which installed in your PC. You can find more about it here.
  • Adafruit_Sensor library included.Download, unzip  and add to libraries in our PC, for example C:\Users\toshiba\Documents\Arduino\libraries. This link you can find in Preferences of Adruino IDE program which installed in your PC. 
  • DHT-sensor library included. You will need to unzip and add the DHT-sensor-library-master library to libraries in your PC, for example C:\Users\toshiba\Documents\Arduino\libraries OR You can install it in Arduino IDE too: select Sketch-> Include library->Manage your libraries->type DHT in Filter your search line and you will see DHT sensor library by Adafruit->More info->select version->install . If it will be problem with compilation - remove 2 files from the library - DHT_U.cpp and DHT_U.h.

Project resources:

  • See attachments on the begining of this project description

Other projects of Acoptex.com
Easy Basics: Project 101a Ai Thinker A9G GPRS GPS development board of Acoptex.com, Not selected 23-11-2019
Easy Basics: Project 100a Ai Thinker A9 GSM GPRS development board of Acoptex.com, Not selected 22-11-2019

Published at 22-03-2019
Viewed: 5801 times