Introduction: Visuino: Moving Servo Via Nextion Slider

visuino page link


HMI solution are always good option to interact with machines. which also makes projects interesting so here is an tutorial for controlling servo motor with the help of nextion slider.There are many Display options for adding graphical user interface to Arduino boards. Most of them however require considerable amount of memory, and processing time, and are not suitable for Arduino boards with limited memory, and processing power such as Arduino UNO or Arduino Nano. When the memory is limited, and an advanced user interface is needed, the Smart Programmable Serial Nextion Displays are a popular choice. The Itead offers a free Graphical Nextion Editor for designing the user interface of the display.

I would like to thanks again to Boian mitov for making things happen through his efforts to turn technologies simple.

Step 1: Components Required

Hardware needed:

  • Arduino uno ( or any other arduino microcontroller board)
  • Micro servo motor 9g
  • Nextion Serial Interface Smart Display(In my case nx3224t028_011)
  • Jumper wire
  • usb type A to B cable
  • breadboard
  • To program the display you will also need a 5V USB to TTL Serial Converter Module

Softwares needed( All latest versions)

  • Arduino IDE 1.6.8 or higher release
  • Nextion editor v0.43
  • Visuino

Step 2: Circuit Connections

Connections of servo are shown in the image attached , make sure connections are right and here control pin of servo is labed as orange.

circuit connections:

  • between servo and arduino uno
  1. control pin of servo to digital pin 2
  2. vcc-----vcc
  3. Gnd-----Gnd
  • Between arduino and nextion
  1. vcc----vcc
  2. Gnd---Gnd
  3. Tx of arduino------Rx of nextion
  4. Rx of arduino------Tx of nextion

To program the Nextion Display with the Nextion Editor you need to connect it with a USB to TTL Serial Converter to your computer or transfer tft file to sdcard .

  • Connect the Nextion Wires Connector to the Display .
  • If your USB to Serial Module is configurable, make sure it is set to provide 5V power .
  • In my case I needed to configure it with a power selection jumper)Connect the Ground Wire (Black wire) from the Nextion Display to the Ground pin of the USB to TTL Serial Converter Module .
  • Connect the Power (+5V) Wire (Red wire) from the Nextion Display to the Power(VCC/+5V) pin of the USB to TTL Serial Converter Module .
  • Connect the RX Wire (Yellow wire) from the Nextion Display to the TX pin of the USB to TTL Serial Converter Module .
  • Connect the TX Wire (Blue wire) from the Nextion Display to the RX pin of the USB to TTL Serial Converter Module .
  • Connect the USB to TTL Serial Converter Module to the computer with a USB cable .

you can make use of breadboard to make multiple vcc and gnd connections.

Step 3: Designing Nextion Slider Component

please follow the video tutorial.

  • remember to add and generate font otherwise project will not compile.
  1. you have to add only one slider component and one text components(only if you think) and arrange its attributes as shown in images.
  2. After compiling open build folder and copy the tft file generated to fat32 formatted sdcard and transfer it to nextion display.power it on and wait for update to complete then power it off and remove sdcard.

To program the Nextion Display, you will need to Download and Install the Nextion Editor.

  • Start the Nextion Editor
  • From the Menu select |File|New| .In the "Save As" dialog, type project file name, and select a location to save the project .
  • Click on the "Save" button In the "Settings" dialog, select the Display type (In my case nx3224t028_011)
  • Click on the "DISPLAY" tab on the left to show the Display settings (Picture 4)Select Horizontal orientation for the display
  • Click on the "OK" button to close the dialog .

open the attached file in nextion editor and compile it , then open build folder and copy the servo tft file and transfer it to sdcard .

Step 4: Visuino : Programming

please watch the video tutorial of this part:

  • Make sure you have installed latest arduino ide.
  • at last generate the code and upload it to arduino uno board.
  • make sure to connect nextion only after transferring this code to arduino.

Step 5: Play

upload the code and reset the board to see the live action.

please let me know if you are facing any troubles in comments section.