Category: ARDUINO

The MLX90614 from Melexis is an infrared thermometer for non-contact temperature measurements. Both the IR sensitive thermopile detector chip and the signal conditioning ASIC are integrated in the same TO-39 can.

Integrated into the MLX90614 are a low noise amplifier, 17-bit ADC and powerful DSP unit thus achieving high accuracy and resolution of the thermometer.

Factory calibrated in wide temperature range: -40 to 125°C for sensor temperature and -70 to 380°C for object temperature

SMBus ( I2C based) compatible digital interface for fast temperature readings and building sensor networks.

In this project we shall use the MLX90614 with OLED & ULTRASONIC sensor.Arduino NANO is used as controller.Calibration procedure for correct object temperature reading is also explained.


Before coding , we need to install the required libraries for Arduino.

Open Arduino IDE

Sketch –>  Include Library –>  Manage Libraries

Image 2

Search for MLX and select ADAFRUIT MLX90614 Library to install.

Image 3

Next search for GFX and install ADAFRUIT GFX Library , which is graphic support library for displays.

Image 1

Finally search for SSD1306 and select ADAFRUIT SSD1306 to install.

Image 4

Connection details are as shown in image below.


         TRIG –> D12

         ECHO –> D11


        SDA –> A4

        SCL –> A5


        SDA –> A4

        SCL – A5

A mini buzzer is connected to D3.

Vcc of OLED,MLX & Ultrasonic are connected to 5v of NANO

All GND pins are made common.

If you want you can use an external power source 5V 1 AMP at Vin of NANO.

As power consumption of OLED,MLX is very low , we can source power from NANO itself.

OLED & MLX are I2C devices , so they are connected to I2C pins of NANO ( SCL & SDA).

According to I2C address , respective device can be communicated.



CODE Explanation :

Starting with we include the libraries we installed for  MLX & OLED.

Image 1

An object named mlx is created from class Adafruit_MLX90614 from MLX library.

An object display is created from class Adafruit_SSD1306 from OLED library.Here we pass argument –1 , as there is no Reset pin in OLED.

Image 5

Variables like roomTemp, objectTemp , stemp , threshold are created as Float

Ultrasonic echoPin is defined at D11 , trigPin at D12.

The Maximum & Minimum range of Ultrasonic are initiated as Integer variables.

Ultrasonic will sense the object distance and the Temperature reading from MLX will be initiated only when the Object is in between 15 and 25 cm.

Image 8

Inside void setup()

Trigger pin of Ultrasonic is declared as OUTPUT pin , Echo as INPUT pin.

OLED display is initiated using begin() function and the I2C address of OLED is passed as argument (0x3C).

setTextColor() function is used to pass argument WHITE which enables black background for OLED.

Image 7

Inside loop() we generate a trigger pulse for Ultrasonic to generate a 40kHz burst.

The pulse reflected from object is calculated as width using pulseIn() function of Arduino.

Distance of the object is then calculated.

The object temperature in Celcius is read using MLX library function readObjectTempC()

& room temperature using function readAmbientTempC()

Initially the threshold value is set as 0.

After calibration we shall fix the correct threshold value.

Image 10

Display settings for OLED by using functions setCursor() , display()

At the bottom of OLED we display the distance of target object in cm & then the Room temperature in celcius.

If distance of object is above maximum range  ( we’ve set it as 25cm) , GET CLOSER is printed on display.

If distance of object is below minimum (15 cm) , TOO CLOSE is printed.

Image 11

If the object is between 15 and 25 cm then HOLD ON is printed.

Till readcount is 5 (5 times we take reading and Average it) disptemp() is called.

Finally the object temperature is displayed.

Image 12

If object temperature is above 37.5 celcius  , play_alert() function is called.Here we use the tone()

Image 13

Finally the compiled code is uploaded to NANO.

Image 15

OLED display shows GET CLOSER initially and the object distance is displayed at the bottom along with room temperature.


If the object is near to sensor ( below 15 cm) , TOO CLOSE is displayed.


If the object is between 15cm and 25 cm , HOLD ON is displayed and blinks 5 times.

Reading is taken 5 times and averaged.


Forehead or Wrist is shown in front of sensor for taking reading of temperature.

The display shows 31.2 degree celcius.

Image 3

We use an oral thermometer for calibration purpose.Using this meter under tongue , it shows 98.2 Fahrenheit.

Image 4

Converting F to Celcius , it is 36.8 C

Image 5

36.8 LESS 31.2 (shown by OLED initially) = 5.6

So we need to use this value as THRESHOLD.

Image 14

Update the threshold value and then upload the code.

Now the display shows the correct temperature 36.9 C

Image 7

Video tutorial :


CAN – Controller Area Network bus is widely used in Automobile industry and in other industrial applications.

CAN  is like Nervous system in Human body facilitating communication between all parts of body.

In CARs , NODEs or ECUs – Electronic Control Units are connected via CAN bus which acts as a control nervous system.

ECUs can be Engine control unit, Airbag control, Audi System , Door position,Brake system, Sensors & others.Each and every function can be assigned a NODE or ECU.

A modern CAR has upto 100 ECUs.



CAN allows ECUs to communicate with each other without complex dedicated wiring in between.

Any ECU can communicate with entire system without causing overload to the controller computer.


Image 2


CAN is MULTI MASTER setup.Any Node can be a MASTER.

CAN works on a MESSAGING TYPE SYSTEM & no slave address is used to communicate with a node.

Every Node receives the message and the related data will be conceived by the receiver node.

It is like public announcement system in  an Airport.Only concerned passengers will take the message.

To balance the CAN BUS and for noise reduction a 120E RESISTOR is used as Terminator.This is must for END NODES. Nodes added in between need not use this Resistor.

In this project we make use of a CAN Board CAN2515.

This board has 2 ICs.  One is the CAN Controller MCP2515 , which communicates with Arduino or any MCU by SPI Protocol.

MCP2515 gives SINGLE ENDED DIGITAL signal (High ,Low).



TX-CAN & RX-CAN are at digital levels and are connected to another IC , a TRANSCEIVER.

Here the Transceiver used is TJ1050 . Microchip MCP 2551 is also a transceiver , generally used with Microcontrollers which have inbuilt CAN Controllers.For e.g ESP32 module has in built controller , but it needs TRANSCEIVER like MCP2551 or TJ1050 .Do not confuse with the numbers


TJ1050 receives Digital signal from CAN2515 and converts tp DIFFERENTIAL SIGNAL acceptable on CAN BUS.

Note the connection between TJA1050 and CAN 2515 .

TX-CAN to TXD ,  RX-CAN to RXD ( not reversed).

The module we use has both ICs on board and we need not care about this connection.


Image 4

The CAN Message format is as below :

Image 1

The CAN-ID may be 11 bit or 29 bit.

11 BIT can addresses 2048 nodes ( 2 power 11) hex 0x000 to 0x7FF

29 bit Extended can up to 536 million.

DAT length allowed is max 8 BYTES or 64 bits.

To learn more about CAN Message visit here

Following picture shows the Differential signal level of CAN.



When no information is on BUS , both CAN-H & CAN-L are at half the supply volt  (here 2.5 volt on a 5v system).

This is RECESSIVE State or BIT 1.

When CAN-H goes to 5v and CAN-L to 0 v , it is DOMINANT State or BIT 0.


To start with the project , connect a potentiometer ( center pin) to A0 of Arduino.

One end of pot is connected to 5v and other end to Gnd.

The CAN board connections are as shown SPI connections between Arduino and CAN board.




Before starting we need a good Library for CAN to work with.

SEEED Studio has a Library which works fine with their Shield.

Also a modified version on it is available from Cryjfowler.

I prefer to use one from AUTOWP


which uses STRUCT  for message sending.This is very simple and easy to use.




Please note , the Seed studio library and that of coryjfowler both have the same header file name mcp_can.h. If you install both these libraries , then there is clash on object declarations arising errors.Use any one only.

In this demo we use arduino-mcp2515 library.Download it as ZIP file.

CAN library

From Arduino IDE   Sketch –> Include Library –> Add ZIP Library

and browse to the location of the downloaded library.Select it to install.

It will be copied to Documents/Arduino/Libraries

On the Receiver side we use an I2C LCD.

The library for the same can be downloaded and installed from :

i2c library :


ARDUINO CODE used in this project can be downloaded from :


Following picture shows the Transmitter side connections.

Potentiometer to A0 of Arduino , CAN board to SPI connections.



The code for the Transmitter side is :



Here we include the mcp2515.h header file.

We create an un initialized struct can_frame variable called canMsg.

can_frame is the STRUCT Type name

canMsg is the Variable name.

Data members of struct is assigned using dot operator.

As seen from the library documentation , there are 3 members , can_id , can_dlc & data[].


Image 3

mcp2515 object is initiated from class MCP2515 by passing the CS pin chip select pin 10 , as argument.

MCP2515 mcp2515(10);

Under set up we call the functions of object mcp2515

First reset() function is called.

Then setBitrate()  to set the CAN spped at 500KBPS & frequency 8 MHZ.

setNormalMode() to set the module function in Normal mode.





Using dot operator the members to STRUCT are added.

can_id is HEX ID which is user given.You can provide your own id in HEX.

can_dlc is the length of data.Maximum 8 BYTES allowed.Here we give data length as only one BYTE.

Under loop() , the analog pot value is mapped to value between 0 – 255

and the data sent over CAN bus using sendMessage() function of mcp2515.


Following is the Receiver side connection picture.

I2C LCD has 2 pins apart from Vcc & Gnd

SDA is connected to A4 ,  SCL is connected to A5.




The CAN board of Tx is connected to CAN board of Rx



Generally a twisted pair wire with shield is used.The shield is connected to GND.

Max length of 40 mtrs can be used.


Following is the Receiver side code :



Here we include the I2C LCD header.

While creating lcd object we pass on the I2C address and the size of LCD ( 16 X 2)

To know the I2C address you can use  i2c scanner from here

Under void loop

we use the readMessage() function of mcp2515 to verify the incoming message

& then we compare the id , then extract the message to display on LCD.




More sensors can be added to the project.

A LM35 temperature sensor at A3 and a Door ON/OFF switch can be added at D6.



ARDUINO CODE used in this project can be downloaded from :



video  :




For HOME AUTOMATION project we use a 4 channel Relay board of 5v Relays.

This is LOW enabled , a LOW at input makes the RELAY ON.

So on start up these input pins must be pulled HIGH.

NodeMCU is loaded with ESPEASY FIRMWARE . You can check this post on how to load.

The Relay board requires a separate power source of 5 volt.

The GND of 5v supply to be made common with the GND of Nodemcu.


IN1     ——- GPIO 16

IN2     ——- GPIO 14

IN3    ——- GPIO 12

IN4    ——- GPIO 13





DOMOTICZ Service is running on Raspberry PI which is on the same LAN as my PC.

The Domoticz server is accessed by typing in the RPI’s IP address followed by port no. 8080

Click on Setup – > Hardware and create Type DUMMY for Relay 1 , name it as RL1.Click ADD

Same way create 3 more Type Dummy for other 3 Relays RL2, RL3 & RL4.

Image 10



Image 12

On top a list of Types created is displayed.


Image 8

Click on Create Virtual Sensor for RL1.

Image 15

Select Sensor type as SWITCH and name it as RL1.

Image 13

Similarly create Sensor type Switches for other 3 ,  RL2,RL3 & RL4

Image 14

Under setup –> Devices all the 4 switches are listed out with INDEX (IDX) numbers.

Note these IDX numbers , as we have to set the same IDX number in ESPEASY Setup.

Image 9

Under SWITCHES tab you can see the VIRTUAL SWITCHES created.

Image 3

Click on EDIT button on RL1

Switch ICON is a bulb by default.You can select any one from the drop down list.

Under ON Action feed in the IP address of ESPEASY with HTTP command


Note the usage of 0 for ON , as the relay board is LOW enabled.

Against OFF action,16,1

Click SAVE

Image 4

Same way click on other Relay switches EDIT button and feed in the HTTP command including the correct GPIO number.


Image 5


Image 6



Image 7

Once the HTTP commands are saved , you can go to ESPEASY Dashboard by typing in the IP address on browser.

Here mine is


Under CONTROLLERS select the protocol as DOMOTICZ HTTP

Provide the IP address of DOMOTICZ and its port no. 8080


Image 7


Under HARDWARE make the GPIO pins used to OUTPUT HIGH on Boot.

As the RELAY Board is LOW enabled , this is necessary.

GPIO16 by default is HIGH on Boot , so there is no settings for GPIO 16.

Image 8



Provide a name RL1


RL1 is connected to GPIO 16 , select it.

Provide the IDX number as 1.

Internal pull up is similar to OUTPUT HIGH , not needed for GPIO 16.

Image 2


As done for RL1 repeat for other relays


Image 3


Image 4


Image 5


Image 6


Now all the settings are done.

Image 1

Go to DOMOTICZ Dashboard and click on SWITCHES tab.

From here you can Switch ON OFF the relays and the load connected to it.


Image 11




DHT11 module can sense both Temperature and Humidity data.

As a module it has 3 pins .Vcc can be connected to 3.3v , as it can work with 3.3v.

Gnd to Gnd.

Data pin is connected to GPIO 13.


DOMOTICZ service is running on Raspberry PI which is on the same WIFI network as my PC.




Domoticz Dashboard can be accessed from a browser by typing in the address followed by port number


Image 3

Click on Setup –> Hardware

Select Type as DUMMY and provide a name

Image 4


Image 5

When you click ADD it appears on the list.

Image 6

Click on Create Virtual Sensors

Select Sensor Type as Temp+Hum

ans provide a name.

Image 7


Image 8


Click on OK .

The Virtual Sensor is visible under TEMPERATURE tab.


Image 11

If you want a description to be added , click on Edit and add description.


Image 12


Now go to ESP EASY by typing in the IP address

Under Controllers select protocol DOMOTICZ HTTP.

Image 13

Provide the IP address of DOMOTICZ Service and the port number.

Click Enabled.

Image 15


Under Devies click ADD.

Image 16

Select a device Environment DHT11

Image 17


Click Enabled and select the GPIO pin as GPIO 13.


Image 18

Interval is the REFRESH rate of DHT11.

DHT11 has a refresh rate of 1 sec , meaning every second it can send out data.

On DOMOTICZ Virtual Sensor you can see the display of Temperature and Humidity.

Image 20

video :



In the previous post we installed ESPEASY over NODEMCU.

This post is on controlling an LED connected to GPIO 12 of NODEMCU from DOMOTICZ Service.




My Raspberry PI and PC both are on same Local Area Network , i.e connected to same WIFI Router .

Domoticz is installed on RPI





Image 21

The IP address of RPI connected to the Router over WIfI is & the DOMOTICZ dashboard is accessed by URL




On Domoticz dashboard click on Setup –> Hardware


Image 28


Create a Type  “Dummy “ (select from the drop down list) and provide a name as LED.

Image 29


Click on ADD


Image 30

Now click on  “ Create Virtual Sensors “

Image 31

Select a Sensor type as SWITCH and provide a name.


Image 32


The Virtual Switch is visible under SWITCHES tab.

Image 33

Click on EDIT

Against On Action , type in this HTTP command

http ://,12,1  is the IP address of ESPEASY NODEMCU.

LED is at gpio12 & 1 for switching ON , 0  for Switching Off.

Image 34

Now go to the dashboard of ESPEASY by typing in in the browser.

Under Controllers select a Protocol Domoticz HTTP

Provide the IP address of DOMOTICZ and the port no. as 8080

Click on Enabled & Submit.

Image 35

Under Devices select from the drop down Switch Input –Switch

Provide a Name and click Enabled.

Select the GPIO as GPIO 12.

Image 36

Click on SUBMIT.

Now you can switch On / Off the LED by clicking bulb icon on Domoticz.


Image 3






DHT11 humidity and temperature sensor is available as a sensor and as a module. The difference between this sensor and module is the pull-up resistor and a power-on LED.

DHT11 is a relative humidity sensor.  To measure the surrounding air this sensor uses a thermistor and a capacitive humidity sensor.For measuring temperature this sensor uses a Negative Temperature coefficient thermistor, which causes a decrease in its resistance value with increase in temperature.

The temperature range of DHT11 is from 0 to 50 degree Celsius with a 2-degree accuracy. Humidity range of this sensor is from 20 to 80% with 5% accuracy. The sampling rate of this sensor is 1Hz .i.e. it gives one reading for every second.  DHT11 is small in size with operating voltage from 3 to 5 volts. The maximum current used while measuring is 2.5mA.

DHT11 sensor has four pins- VCC, GND, Data Pin and a not connected pin. A pull-up resistor of 5k to 10k ohms is provided for communication between sensor and micro-controller.As amodule it has only 3 pins , pull up resistor provided on board.

Connect DATA pin of DHT11 to D2 of Arduino , Vcc to 5v & Gnd to Gnd.

Open NEXTION EDITOR and start a new project with .HMI file name.

Generate a FONT file and add to the project.

Click on Picture tab at bottom left corner and then + symbol to import a back ground picture.This picture resolution must match that of your NEXTION model

In this demo I’m using 4024T032 ( 400 X 240 pixel 3.2 inch size)

Use IRFANVIEW or INKSCAPE to match the resolution 400 x 240 of the image.

Click on PICTURE tool .It appears p0 on canvas.

At the right side window you can set the attributes for this object.Leave the object name as p0.

Click browse against pic attribute and select the image to be loaded as back ground.

Now the image appears on canvas.

Image 12

Add 2 TEXT objects  .One for Temperature and the other for Humidity.

As Nextion editor cannot handle fraction numbers , we use Text instead of Number object.

Following are the attribute settings for these 2 Text objects.

t0 objname can be changed to Temperature

vscope to global.All objects that is controlled through SERIAL to be set to global.

sta attribute by default is solid color.Change this to crop image.

Also select the browse against picc attribute and select the back ground image.

This creates a Transparent effect to the object.

Text color can be changed by the pco attribute. 65535 means White & 0 means Black.

You can click on Select against pco to select a color.

Same way repeat for the t1 object Humidity.

Image 13              Image 15


Next add on 4 more Text objects for display purpose.You need to change the txt attribute to change the display name .

txt – to change display name

pco – to change color of text.

sta -crop image  to give transparent effect so that background image is visible through this object.

Image 16

Click on DEBUG to start the Simulator.

You can test the display by sending STRING Commands.


changes the Temperature display to 32.0.

Note the usage of double quotes for data to be displayed.While typing the code the interpreter of Nextion editor gives options to select (intellisense).

The commands can be sent as STRING from Arduino and to be followed by 3 bytes of 0xFF.


Image 17

Upload the following sketch on to Arduino.

Here we use the library for DHT Sensor by including the header file DHT.h

We define the DHT data pin connection as 2 (D2 of Arduino) and type as DHT11.

The variables temperature and humidity are initialized with float literal constants.

Reading of sensor is by calling functions readHumidity()  & readTemperature() from the Class dht.

The assigned data is sent to Nextion as a STRING command.

Image 1


Sending data.
Data to Nextion should be sent in the following format:

    • String command


  • name of the receiving element     humidity
  • sign “.”
  • field name of the receiving element    txt
  • sign “=”
  • data, and if it is String, then in quotation marks, and if it is digital information, then four bytes of data
  • three bytes 0xff
    Notice the use of ESCAPE character backslash \ before double quote “.
    This is how to send double quotes from Arduino Serially.

Nextion does not work with float. So all to be sent as – String


To upload the .tft file on to Nextion we use USB-TTL device.Connect Nextion to USB-TTL

Tx to Rx

Rx to Tx

Gnd – Gnd

5v to 5v

Click on UPLOAD button and select the COM port of USB device and a faster baudrate.

Once uploaded , remove USB device and connect Arduino with Nextion with same configuration as above.

The result is displayed on NEXTION DISPLAY.

The DHT sensor requires 1 second refresh rate for each reading.This is provided by 1 sec delay in Arduino code.





This post is on displaying potentiometer reading from Arduino to Nextion display.




Open Nextion Editor and File –> New  to create a project file with extension .hmi

Always keep your project files in a separate folder.

In the next screen select your Nextion model display , mine is 4024T032 which is 400 x 240 pixel & 3.2 inch size Basic model.Also select the direction of display as Horizontal.


Image 1

Using Fonts Generator create a font file by selecting font size and font type.It is saved as .zi file.Click Yes to add font file to project.

The font file appears under font tab.

Image 3

Next to Fonts tab you see a Picture tab.

Click on that and then click on the + symbol seen on top f this window.

Browse to the location of the background image you want to import.

Remember the image must match the resolution of the display model.Here mine is 400 x 240 , so I’ve converted the image to 400 x 240 pixels using IRFANVIEW Software.


Image 4

Drag PICTURE tool from toolbox on to canvas or just click on Picture under tool box.

Picture component appears on canvas as p0 object name.

Click on that p0 , to modify attributes for object p0.

Against pic attribute click on browse and select the background picture from the list.

The back ground image appears on workspace canvas.

Image 6


Click on  SLIDER tool and then a NUMBER.

Slider appears as object h0   & number appears as object n0.

You may rename it from attribute section.But we shall leave it to default names.


Image 1

Following is the attribute window for the object h0.

The mode by default is Horizontal , if required can be changed to Vertical.

Color of the slider by default is Green , by clicking against bc0 attribute and select color , you can change it. pc0 is the color of slider knob, Red by default & can be changed.

Set the maxvalue to 1023 , as Analog read of Arduino ranges from 0-1023.

Image 2 - Copy

n0 Number attributes

bc0 , pc0 to change color of number.

vscope can be changed from local to global. If global it is available for all pages and if you control it from Arduino through Serial , make it GLOBAL.


Image 26


Click on DEBUG to start the Simulator.

Under simulator you can feed in the code to change value of n0 object.

n0.val=524 will change the n0 value to 524.


Image 3

Close the Simulator.

Now to upload the .tft file (after Compile you get this file)  on to Nextion , we use a USB-TTL device.

Connect Tx of Usb device to Rx of Nextion , Rx to Tx , Gnd to Gnd and Vcc to 5v.



Plug in usb device to pc and note the COM port allotted to it.

Click on UPLOAD,

Select COM port and baud rate & click GO.

Image 21

To Arduino we have to upload the following sketch.

Image 6


analogRead of A0 pin where pot pin is connected is assigned to a integer variable value.

A string  n0.val is sent to serial along with this value .

The string is followed by 3 times 0xff hex value.This is the standard format Nextion will accept on its Serial.

Do not use any other Serial commands here.For e.g if you use Serial.println() , then Nextion will not display the value.

Once sketch is uploaded on to Arduino , connect Arduino to Nextion

Tx to Rx, Rx to Tx , 5v to 5v , Gnd to Gnd

Potentiometer Center pin to A0, one end of pot to +5v and other end to Gnd.

Now turning the potentiometer will vary the number on Display from 0 to 1023.



Now let us modify the Arduino code so that Slider moves according to number value.

Serial.print(“click n0,1);

click n0,1 means  activate Press Event of object n0

upload this code on to Arduino.

Image 10

Now on Nextion Editor  click on n0 number object.

Under Touch Press Event feed in


The touch press event is activated by Arduin code , as if we were physically touching n0.

Now the event code is triggered where we assign value of slider to be same as value of number.



compile and upload the file to Nextion using USB-TTL.


Connect Nextion with Arduino nd see the result.

On varying the potentiometer the number value changes from 0 to 1023 .Accordingly the slider changes position.

Image 5






Nextion HMI Touch Displays are very popular in Industrial panel control boards.

This post is on usage of DUAL STATE BUTTON tool of the new NEXTION EDITOR to make an LED ON or OFF with switch images.

I’m using the model  NX 4024T032 display

which means  Resolution of 400 x 240 pixels & display size 3.2 inch




Nextion Editor is used to create .tft file from .hmi file.

Download the latest version from :

NO LIBRARY is used in this project.


Open the Nextion Editor.

Always create a new folder for your project and save all files in that folder.

From Tools click on Fonts generator to generate font file for your project.


Image 4

Select the size of font and the type of font.

Provide a name and store this file.

The Nextion editor will store it as .zi file and add it to your project.

Image 5

At the bottom left corner you can see the Fonts tab under which your font file is added.

Image 6

Now click on the Picture tab to import some pictures for your project.

Remember to resize the background image to match the resolution of your Nextion display model.

Here mine is 400 x 240 pixels. I use IRFAN VIEW software to resize the image pixels to 400 x 240.

Other application like  INKSCAPE  is also powerful image tool like photoshop.

You can even use the Windows PAINT to edit.

Here are the images used in this project.


switch_off_1      switch_on2                img_ok

Click on the Picture tab and then the + symbol to import these pictures in to the Picture tab.


Image 3

From tool box double click on Picture tool.

A picture element appears on canvas with default name p0.

If you want you can rename the object name.


Image 7

At the right side attribute section there is an attribute called pic

Double click against the empty space near pic.

The images you imported appears .Select the back ground image and click ok.

Image 8


The background image appears on canvas if the resolution matches with that of your Nextion display model.

Image 9

Now from tool box double click on DOUBLE STSTE BUTTON.

An object with name bt0 appears on canvas.


Image 10


The main attribute of bt0 to change is the

sta attribute.   (status attribute)

Change the sta attribute from solid to image.

Image 11

Now you will get 2 more attributes pic0 & pic1


Image 12

Click against empty space of pic0 and select the OFF SWITCH image.

Click against empty space of pic0 and select ON SWITCH image.

Change the txt attribute to empty space.

Image 13

Now click on the DEBUG button on top.

Image 14

The SIMULATOR opens.

Without a physical NEXTION Display in hand , you can develop your project with NEXTION EDITOR.


Image 15

On Simulator you can test the ON / OFF condition which changes the image accordingly.


Image 16

Close the Simulator.

Click on bt0 dual state switch object.

Below the canvas you can see 2 Events.


Type in the following code :

print bt0.val

When the bt0 button is touched and on release this code is executed.

The value of bt0 button will be printed or sent out to serial as 4 bytes of HEX data..


Image 17

Click on DEBUG to test the code.

Image 18

On  simulator , if you touch and release the button once , the switch image changes and accordingly 4 bytes of HEX data sent

01 00 00 00  for ON

00 00 00 00 for OFF

Image 19

Close the simulator and add a TEXT object on the canvas.

You can change the attributes :

bc0 – back ground color

pc0 – text color

txt – name of text to display.

Image 21

Now under TOUCH RELEASE EVENT modify the code as :


print bt0.val
t0.txt=”LED ON”
}else if(bt0.val==0)
t0.txt=”LED OFF”


We add an if condition to change the text value according to switch ON or OFF.uiuiui


Image 22

Click on DEBUG to see the result on simulator.

Image 24


Image 25

Once the testing is fine you can click on COMPILE to generate the .tft file.

Once the compilation is successful you can find the file under bianyi folder or tft output folder.

Image 26

To upload the .tft file on to Nextion display we use USB-TTL method.

Connect USB-TTL Nextion

Vcc—5v,  Gnd-Gnd , Tx—Rx ,, Rx –TX



Plug in the USB-TTL to PC and note the COM port allotted under Device Manager.

Click on UPLOAD button.

Select the COM port and Baud rate as 115200.

Image 27

Now the file is uploaded and the screen we developed appears on Nextion screen.

Let us connect the Arduino with Nextion

Vcc—5v , Gnd – Gnd , Tx-Rx ,Rx-Tx

Upload the following code.While uploading remove the Tx,Rx wires and then connect back.



Once Done uploading you can test the project result.

In built LED on Arduino switched ON or OFF as per touch switch on the display.


Download code and images HERE :







NEX31     NEX21


VIDEO Support  :



Nextion is a  Human Machine Interface (HMI) programmable Touch Display.

Nextion includes a hardware part (a series of TFT boards) and a software part , NEXTION EDITOR.

The Nextion TFT board uses only one serial port to communicate. It lets users avoid the hassle of wiring. On board a 32 bit ARM processor is used STM32F030.

Nextion editor has mass components such as button, text, progress bar, slider, instrument panel etc. to enrich the interface design. Furthermore, the drag-and-drop function ensures that users spend less time in programming. With the help of this WYSIWYG editor, designing a GUI is a piece of cake.

BASIC & ENHANCED Models are available.

Basic models :

NX3224T028            NX4024T032      NX4832T035

Notes: NEXTION product numbering rules , eg. NX4024T032

40 -Horizontal resolution: 40=400
24 -Vertical resolution: 24=240

T  -Series model: T=Basic Model     K=Enhanced Model
032 -Display size:”032″ means 3.2 inch
R   -Touch screen type:N=non touch; R=resistive touch; C=capacitive touch

All basic models  are resistive touch screen display, 4M Flash, 3.5KByte RAM, 65k colors., except 3.5 inch model which has 16M Flash.

Before starting the project ,let us collect the essentials.






Image 6


Inkscape editor is required , if you need an image in your project. Using INKSCAPPE we can convert the image resolution to match that of Nextion display.

First , download theITEAD LIBRARY file  & unzip it. Copy the folder & paste it to C:/Program files/Arduino/Libraries

Rename the folder to Nextion.

Image 7

Open the Nextion folder & locate NexConfig file.

Right click and select Edit with Notepad++


Image 8

As the library is designed for ARDUINO MEGA , we need to do the following modifications in Configuration file , so that ARDUINO UNO can be used.

Image 9

Comment lines 27 & 32.

Change Serial2 to Serial at line 37.

Save the file,

Next , we download an image background for the project and use INKSCAPE to convert image to match our Nextion display which is 400 x 240 resolution.

You can download wanted imaged from

Huge collection of Both free and paid images are available for download.


Go to File –> Document Properties

Set the UNITS to PX (Pixel) ,Width as 400 & Height as 240 ( which matches our NEXTION Display Resolution),

Image 23

Close the Document properties. A new Canvas of size 400 x 240 is created .

Now click File –> Import and browse to the location of the downloaded image file & select it.


Image 24

The image is loaded on to Inkscape.You can see drag Handles on all sides of the image.

Use the handles to pull so that the image size fits inside the Canvas created,

Image 25

Click View –>  Zoom –> Selection

to Zoom the  picture.


Image 26


Now drag the handles so that the image fits exactly inside the 400 x 240 Canvas


Image 27

Click on File –> Save as and select the CAIRO PNG type to save the image.


Next proceed with the NEXTION EDITOR Installation.

Open NEXTION Editor.


Image 10

Click on File –> NEW & within a folder create  a new file , say ledonoff.

This will be stored as .HMI File.

On the next window select the model of NEXTION Display you have.

In my case it is 400 X 240 2.3 Inch.

Select the model & then click on DISPLAY

Image 11

Here select the orientation of display as 90 – HORIZONTAL

You can also select vertical if you have created vertical  image and  like to have vertical


Image 12

A canvas of size width 400 x  height 240 is created inside Display area of Nextion Editor.

Image 13

Now we have to generate a FONT file.


Select Height of Font & type of Font.

Provide a name for the file.

Image 14

Click Generate Font to see a .ZI font file created.Save that in the project foldet.

Finally click the “Add the Generated Font” message.

You can see the font file added to the FONTS Area.


Image 15

Next click on PICTURE tab . Then click the + symbol.

Image 16

Browse to the location of the image file ( 400 x 240) we created earlier using inkscape.

Select the image file , so that it is loaded inside the PICTURES area.

Image 17

Click on PICTURE under TOOLS area.

Then at the right side ATTRIBUTE Area you can see the id of the image as 1, object name as p0

Below that against pic , empty space iseen

Double click on the empty space against pic to see on a new window the picture selected .

Image 18

Select the picture seen on new window & click ok.

Image 19

Now the image fits inside the canvas created.

You can click on DEBUG to see if any error is generated.If any error seen then you have to create again the image exactly of size 400 x 240 using inkscape.

Image 20]


Next add 2 Buttons & a Text over the image by clicking on the elements under Tools area.


Image 22


Click on the first button and go to Attributes area.

Here you can see the id of the component as 2, object name objname as  bo.

Write down these attributes , which will be used in coding.

Scroll down to txt and change the name to LED ON.

You can also change the name of objname , but we leave it as b0 as generated.


Image 28

Same way click on second button and note the attributes  id 3 , objname  b1

Scroll down and select txt , change name to LED OFF.


Image 30

For the third element , just change the txt to STATUS.

You can drag the text element to make the text area bigger.

Image 31

Now click on first button LED ON.

In the EVENT Area click the TOUCH RELEASE EVENT & then put a tick mark

against Send Component ID

Image 32

Do this for the second button LED OFF , also.

Click the DEBUG button to start the simulator.

Now you can see the display created with buttons and Status text bar.

Click on the LED ON button.While you release the click, a HEX code is generated

inside the simulator return area.

65 00 02 00 FF FF FF

65 is the Touch Detection code

00 is page ID which is page 0 for our project.

02 Component ID which is 2  (LED ON button)

00 Button Release event

FF FF FF  End of Message

Image 34


Similarly click on LED OFF button.

While  released you see the following code

65 00 03 00 FF FF FF

Here you can see the 3rd hex code as 03 which is component id of LED OFF button.

This hex code is available at the serial port of display when the event occurs.

So we can easily read this code and decide on which button is operated.



Check out the full instruction  set wiki here :


Click on COMPILE button to generate the .TFT file.

This is the file to be uploaded on to the Nextion display.

To see the file generated go to File –> Open Build Folder

which opens a folder named BIANYI inside which you find the generated file.

Copy this file and paste inside your project folder.


Image 35


The .TFT file can be uploaded on to NEXTION display by 2 methods .

One is the USB – TTL method where we connect USB-TTL device to serial port of display.

5v to 5v , GND to Gnd , Tx to Rx , Rx to Tx

Connect the usb-ttl to PC and note the serial COM port allotted.

Click on UPLOAD button on the NEXTION Editor.

On the upload window select the COM port & set the Baud Rate to maximum , 115200.

As this method is slower , it is better to set high baud rate,

Click GO.

Image 39


Now you can see the file uploading info on screen and finally you can see your design on Nextion display.

Image 38


Image 40


The second method is SD card method.

Use a card reader to hold SD card and plug it to PC.

Select the SD card drive , right click to FORMAT.

Ensure that the SD card drive is selected, set the format to FAT 32,and click ok.

Once formatted , copy the .TFT file we compiled earlier,from BIANYI Folder to this SD card drive.

No other file should be in card.

Remove SD card and plug it on to Nextion Display.

Provide power to display.You can use the USB-TTL and connect only the 6v and GND.

The file gets loaded faster compared to other method.

Once completed , remove power and connect back power.

You can see the result on screen.


Now , let us connect Arduino with NEXTION display.

First connect 5v of Arduino to 5v of display.Then GND to GND.

The display goes on showing the designed screen.


Image 36

Upload the following code .

As we do not use Software serial in code , we have to upload code first and then connect

Tx of Arduino to Rx of Display, Rx of Arduino to Tx of Display.




#include <Nextion.h>

const int led = 13;

//Declare your Nextion objects , pageid, component id., component name

NexButton b0 = NexButton(0,2,”b0″);
NexButton b1 = NexButton(0,3,”b1″);
NexText t0 = NexText(0,4,”t0″);

//Register a button object to the touch event list

NexTouch *nex_listen_list[] = {

//Button b0 component popcallback function
// When ON button is Released the LED turns ON and the state text changes

void b0PopCallback(void *ptr){
t0.setText (“State:ON”);

//Button b1 component popcallback function
// When OFF button is released the LED turns OFF and the state text changes

void b1PopCallback(void *ptr){
t0.setText (“State:OFF”);
void setup(void) {
//Register the pop event callback function of the components




void loop() {


CODE walk through :

First we include the header file

#include <Nextion.h>
Then each component used is declared using NexButton function
We have 3 components bo,b1 & t0

bo component is defined as

NexButton b0 = NexButton(0,2,”b0″);

0 is the pageid , 2 is the component id & bo is the object name
Similarly other 2 components b1 & t0 are defined

Next we create a list array using NexTouch function for the Touchable components.
We have only 2 touchable components b0 & b1
The array list is created b0,b1 & NULL isadded finally.

Button b0 component popcallback function
When ON button is Released the LED turns ON and the state text changes

void b0PopCallback(void *ptr)

same way button b1 component popcallback function is declared.

Inside SET UP we attach the function created to corresponding Events.
When you click bo button boPopCallback function is called.
This is done by
Same way for b1 button.
Inside loop we repeatedly watch for the event trigger list.

The code and project files can be downloaded from here :–hmi-tft-lcd-nx4024t032.html

Connect an LED at pin 13 of Arduino through a resistor to GND.

Image 37

When you touch and release LED ON button , the LED is ON

When you touch and release LED OFF button , the LED goes OFF.

The STATUS is updated accordingly.



Arduino ProMini , as the name indicates , is a miniature version of UNO .It runs on 16 MHz crystal ,ATMEGA328 ,but lacks USB connectivity. There are 5V  (16MHz) & 3.3V (8MHz) versions. In this demo I use the 5v version.




There is a voltage regulator on board so it can accept voltage up to 12VDC. If you’re supplying unregulated power to the board, be sure to connect to the RAW pin and not VCC.

Vcc accepts only 5v.

The latest version of this board breaks out the ADC6 and ADC7 pins ,also adds footprints for optional I2C pull-up resistors.

To upload code on to pro mini , a USB-TTL adapter is required.There are many types of  USB adapters available.The most reliable one that works up to Windows 10  is the one built on CP2102 IC .

CP2102 adapters are available in 2 variants .One with 6 pins that include the DTR  , Data Terminal Ready , which handles the RESET required by the promini board.

The other board is commonly available one with 5 pins.Here RESET must be done manually on promini while code is uploaded.






First let us upload code using the 6 pin version .

The connections are

PROMINI                USB-TTL

DTR   —–>   DTR

TxO   —–>  Rx

RxI    ——> Tx

Vcc   ——> 5v

GND  ——> GND

In some Promini boards the DTR pin is printed as GRN.


Plug in the USB board to PC & open the Device Manager . If the driver is installed previously , a COM port will be allotted.Otherwise , download the silicon labs cp2102 driver from here & install.


Image 1

Open the Arduino IDE , feed in the COM port allotted.

Select Board as Arduino Pro or Pro Mini , Programmer as USBasp.

In newer versions of IDE there is option to select type of ProMini board.Under Processor select ATmega328 5v,16MHz

Image 2

From Examples open the BL;INK sketch

Image 3

Click on UPLOAD button.

The DTR pin of USB board takes care of the RESET  & your code will be uploaded to PROMINI without any manual reset.


Image 4

Uploading code using a 5 pin version , needs a manual RESET on PROMINI.

The connections are

PROMINI                USB-TTL

TxO   —–>  RxD

RxI    ——> TxD

Vcc   ——> 5v

GND  ——> GND



Plug in the USB to PC & note the COM Port allotted.

Open Arduino IDE .Feed in the COM port , select board as Arduino Pro or Promini & Programmer as USBASP

From Examples , open the BLINK Sketch

Image 2.1

Click on UPLOAD button.

Image 2.6

Watch out for the message at the bottom of IDE.

“ Compiling Sketch “ message appears first.

Then it changes to “Uploading”

Image 2.2

As  soon as you see “Uploading” message , gently press the RESET Key on Promini.

This should be done instantly , as soon as you see “UPLOADING” message.

Image 2.3



If the KEY Press is at the right time , your code will be uploaded successfully.



You can also use your UNO board to upload code on Promini.

To use the UNO board , you need to by pass the bootloader .For this  upload an empty code to UNO or connect the RST pin to GND

Connecting RST pin to GND bypasses the bootloader & only the serial converter IC located near the USB socket is used as USB-TTL.

The connection here is STRAIGHT & not reverse

Tx of Arduino UNO goes to Tx of Promini

Rx of UNO goes to Rx of Promini

Gnd to Gnd



Connect the USB cable to PC & open the IDE.

Select the port where UNO is connected.

Image 2.5


Select the board as Arduino Pro or ProMini

Image 3.1

Open the BLINK sketch & UPLOAD.

Watch out the message at the bottom of IDE.

Initially “Compiling Sketch “ appears.

Then the message changes to UPLOADING…


Image 6

Once you see UPLOADING… message  , press the RESET key on PROMINI.




The code is now Uploaded successfully.

Image 7

Support VIDEO :

cooltext753793315   cooltext753790696