STEP 1 / 6ESP + IOT

Ultrasonic Range Finder with ESP32 TFT Display & HC-SR04

In this project, we'll make an ultrasonic range finder with an ESP32 TFT display and an HC-SR04 ultrasonic sensor. The project makes use of an integrated board that has a 3.5-inch touchsc…

The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figure
PROJECT#499
TRACKIoT
PARTS11
STAGES06
STEP 1 / 6 · Overview

Know the mission before touching a wire.

Understand what you are making, prepare the right tools, and make the workbench safe.

01

Project details

Ultrasonic Range Finder with ESP32 TFT Display & HC-SR04 is a iot project. In this project, we'll make an ultrasonic range finder with an ESP32 TFT display and an HC-SR04 ultrasonic sensor. The project makes use of an integrated board that has a 3.5-inch touchsc…

Source pages
1454-1462
Named parts
11
Build goal
Working, tested prototype
02

Tools you need

  • Digital multimeter
  • Wire stripper and side cutters
  • Soldering iron with a fine tip
  • Current-limited bench supply
  • Computer with a data-capable USB cable

Use eye protection, good lighting, and a clean insulated surface throughout the build.

03

Safety precautions

  • Disconnect every power source before changing a connection.
  • Check component polarity, pinout, and supply voltage twice.
  • Use a current limit for the first power-up.
  • Keep liquids, loose metal, and uninsulated wires away from the bench.
Ready to continue?
STEP 2 / 6 · Parts library

Gather, identify, and understand every part.

Use the standardized inventory, then open What's this? to learn each part's role, advantages, limitations, handling, and specifications.

NAMED PROJECT INVENTORY11 PART LINES
PARTTYPEQTYREADY
MESP32+TFT Touch Display - ESP32 3.5" TFT Touch (Capacitive)MODULE1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figureMODULE LEARNING VIEW

ESP32+TFT Touch Display - ESP32 3.5" TFT Touch (Capacitive)

A programmable controller that reads inputs, makes decisions, and drives the project's outputs.

What it does here

It is the control centre and must use the documented board, pin map, supply, and logic level.

Buy / compare this part

Advantages

  • Reprogrammable and reusable
  • Large learning ecosystem
  • Complex behaviour remains changeable

Limitations

  • GPIO voltage and current are limited
  • Some pins affect boot or communication
  • Loads normally need a driver

Handling

  • Disconnect power before rewiring
  • Avoid static discharge
  • Never power motors, relays, or pumps directly from GPIO

Specifications to verify

  • Use the exact model, value, package, and rating listed for ESP32+TFT Touch Display - ESP32 3.5" TFT Touch (Capacitive); similar-looking parts are not always interchangeable.
  • Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
Pwith CameraPART1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figurePART LEARNING VIEW

with Camera

A named project component whose exact role is defined by the source circuit and build guide.

What it does here

It performs a documented electrical, control, interface, or construction function in this project.

Buy / compare this part

Advantages

  • Selected for this project
  • Can be checked independently
  • Supports modular troubleshooting

Limitations

  • Substitutes may differ
  • Generic names can hide variants
  • Pinouts and ratings vary

Handling

  • Compare the received part with the source
  • Keep it labelled
  • Do not force connectors or adjusters

Specifications to verify

  • Use the exact model, value, package, and rating listed for with Camera; similar-looking parts are not always interchangeable.
  • Confirm dimensions, ratings, connection method, polarity, and environmental limits.
MUltrasonic Sensor - HC-SR04 Ultrasonic SensorMODULE1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figureMODULE LEARNING VIEW

Ultrasonic Sensor - HC-SR04 Ultrasonic Sensor

A sensor converts a physical condition into an electrical signal the circuit can measure.

What it does here

It provides project input as an analogue, digital, resistive, frequency, or calibrated signal.

Buy / compare this part

Advantages

  • Adds real-world awareness
  • Can usually be tested independently
  • Often supports calibration

Limitations

  • Readings can drift
  • Placement affects results
  • Some sensors need warm-up or calibration

Handling

  • Protect the sensing surface
  • Observe supply voltage and polarity
  • Keep signal leads away from noisy power wiring

Specifications to verify

  • Use the exact model, value, package, and rating listed for Ultrasonic Sensor - HC-SR04 Ultrasonic Sensor; similar-looking parts are not always interchangeable.
  • Confirm supply range, output type, measurement range, accuracy, response time, and pin order.
PUSB Cable - Type-C USB Cable for ProgrammingPART1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figurePART LEARNING VIEW

USB Cable - Type-C USB Cable for Programming

A named project component whose exact role is defined by the source circuit and build guide.

What it does here

It performs a documented electrical, control, interface, or construction function in this project.

Buy / compare this part

Advantages

  • Selected for this project
  • Can be checked independently
  • Supports modular troubleshooting

Limitations

  • Substitutes may differ
  • Generic names can hide variants
  • Pinouts and ratings vary

Handling

  • Compare the received part with the source
  • Keep it labelled
  • Do not force connectors or adjusters

Specifications to verify

  • Use the exact model, value, package, and rating listed for USB Cable - Type-C USB Cable for Programming; similar-looking parts are not always interchangeable.
  • Confirm dimensions, ratings, connection method, polarity, and environmental limits.
BConnecting Wires - Male to Female Jumper WiresBUILD1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figureBUILD LEARNING VIEW

Connecting Wires - Male to Female Jumper Wires

A named project component whose exact role is defined by the source circuit and build guide.

What it does here

It performs a documented electrical, control, interface, or construction function in this project.

Buy / compare this part

Advantages

  • Selected for this project
  • Can be checked independently
  • Supports modular troubleshooting

Limitations

  • Substitutes may differ
  • Generic names can hide variants
  • Pinouts and ratings vary

Handling

  • Compare the received part with the source
  • Keep it labelled
  • Do not force connectors or adjusters

Specifications to verify

  • Use the exact model, value, package, and rating listed for Connecting Wires - Male to Female Jumper Wires; similar-looking parts are not always interchangeable.
  • Confirm dimensions, ratings, connection method, polarity, and environmental limits.
MESP32 3.5″ TFT Touch (Capacitive) with CameraMODULE1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figureMODULE LEARNING VIEW

ESP32 3.5″ TFT Touch (Capacitive) with Camera

A programmable controller that reads inputs, makes decisions, and drives the project's outputs.

What it does here

It is the control centre and must use the documented board, pin map, supply, and logic level.

Buy / compare this part

Advantages

  • Reprogrammable and reusable
  • Large learning ecosystem
  • Complex behaviour remains changeable

Limitations

  • GPIO voltage and current are limited
  • Some pins affect boot or communication
  • Loads normally need a driver

Handling

  • Disconnect power before rewiring
  • Avoid static discharge
  • Never power motors, relays, or pumps directly from GPIO

Specifications to verify

  • Use the exact model, value, package, and rating listed for ESP32 3.5″ TFT Touch (Capacitive) with Camera; similar-looking parts are not always interchangeable.
  • Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
MESP32-WROVER chip, and incorporates an OV2640 camera with 2 millionMODULE1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figureMODULE LEARNING VIEW

ESP32-WROVER chip, and incorporates an OV2640 camera with 2 million

A programmable controller that reads inputs, makes decisions, and drives the project's outputs.

What it does here

It is the control centre and must use the documented board, pin map, supply, and logic level.

Buy / compare this part

Advantages

  • Reprogrammable and reusable
  • Large learning ecosystem
  • Complex behaviour remains changeable

Limitations

  • GPIO voltage and current are limited
  • Some pins affect boot or communication
  • Loads normally need a driver

Handling

  • Disconnect power before rewiring
  • Avoid static discharge
  • Never power motors, relays, or pumps directly from GPIO

Specifications to verify

  • Use the exact model, value, package, and rating listed for ESP32-WROVER chip, and incorporates an OV2640 camera with 2 million; similar-looking parts are not always interchangeable.
  • Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
Mcommunicates with the ESP32 microcontroller via SPI (Serial PeripheralMODULE1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figureMODULE LEARNING VIEW

communicates with the ESP32 microcontroller via SPI (Serial Peripheral

A programmable controller that reads inputs, makes decisions, and drives the project's outputs.

What it does here

It is the control centre and must use the documented board, pin map, supply, and logic level.

Buy / compare this part

Advantages

  • Reprogrammable and reusable
  • Large learning ecosystem
  • Complex behaviour remains changeable

Limitations

  • GPIO voltage and current are limited
  • Some pins affect boot or communication
  • Loads normally need a driver

Handling

  • Disconnect power before rewiring
  • Avoid static discharge
  • Never power motors, relays, or pumps directly from GPIO

Specifications to verify

  • Use the exact model, value, package, and rating listed for communicates with the ESP32 microcontroller via SPI (Serial Peripheral; similar-looking parts are not always interchangeable.
  • Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
Mor modules. Programming in Arduino and MicroPython are both supportedMODULE1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figureMODULE LEARNING VIEW

or modules. Programming in Arduino and MicroPython are both supported

A programmable controller that reads inputs, makes decisions, and drives the project's outputs.

What it does here

It is the control centre and must use the documented board, pin map, supply, and logic level.

Buy / compare this part

Advantages

  • Reprogrammable and reusable
  • Large learning ecosystem
  • Complex behaviour remains changeable

Limitations

  • GPIO voltage and current are limited
  • Some pins affect boot or communication
  • Loads normally need a driver

Handling

  • Disconnect power before rewiring
  • Avoid static discharge
  • Never power motors, relays, or pumps directly from GPIO

Specifications to verify

  • Use the exact model, value, package, and rating listed for or modules. Programming in Arduino and MicroPython are both supported; similar-looking parts are not always interchangeable.
  • Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
MESP8266 - controller board / ICMODULE1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figureMODULE LEARNING VIEW

ESP8266 - controller board / IC

A programmable controller that reads inputs, makes decisions, and drives the project's outputs.

What it does here

It is the control centre and must use the documented board, pin map, supply, and logic level.

Buy / compare this part

Advantages

  • Reprogrammable and reusable
  • Large learning ecosystem
  • Complex behaviour remains changeable

Limitations

  • GPIO voltage and current are limited
  • Some pins affect boot or communication
  • Loads normally need a driver

Handling

  • Disconnect power before rewiring
  • Avoid static discharge
  • Never power motors, relays, or pumps directly from GPIO

Specifications to verify

  • Use the exact model, value, package, and rating listed for ESP8266 - controller board / IC; similar-looking parts are not always interchangeable.
  • Confirm operating voltage, logic level, pinout, memory, USB interface, and maximum GPIO current.
PHCSR04 - specified partPART1
What's this?Image, role, pros, cons, handling & specifications
The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figurePART LEARNING VIEW

HCSR04 - specified part

A named project component whose exact role is defined by the source circuit and build guide.

What it does here

It performs a documented electrical, control, interface, or construction function in this project.

Buy / compare this part

Advantages

  • Selected for this project
  • Can be checked independently
  • Supports modular troubleshooting

Limitations

  • Substitutes may differ
  • Generic names can hide variants
  • Pinouts and ratings vary

Handling

  • Compare the received part with the source
  • Keep it labelled
  • Do not force connectors or adjusters

Specifications to verify

  • Use the exact model, value, package, and rating listed for HCSR04 - specified part; similar-looking parts are not always interchangeable.
  • Confirm dimensions, ratings, connection method, polarity, and environmental limits.
Ready to continue?
STEP 4 / 6 · Source code

Confirm the hardware-only control path.

This project does not include firmware in the source. The circuit itself provides the required behaviour.

01

How to connect

  1. Match every controller label to the circuit view and source pin map.
  2. Join grounds before signal wires when separate low-voltage supplies are used.
  3. Keep motors, relays, pumps, and other loads on a suitable driver and external supply.

Common mistakes

Reversed VCC/GND, board-label versus GPIO-number confusion, missing common ground, and charge-only USB cables.

Troubleshoot

Disconnect loads, continuity-test one path at a time, then test with a current limit.

02

Software preparation

No IDE, board package, library, or firmware upload is required for this project.

If you add a programmable controller as an extension, document its pin map separately.

03

How to upload code

The original design is implemented entirely in hardware, so proceed after verifying the circuit and supply.

Ready to continue?
STEP 5 / 6 · Build

Assemble, deploy, test, and troubleshoot.

Use the complete source notes in build order, then pass the final checks before calling the project finished.

ASSEMBLY

Build in functional stages

  • Power and regulation
  • Controller or processing stage
  • Inputs and sensors
  • Outputs and loads
  • Enclosure and strain relief
TEST

Power up safely

  • Inspect unpowered continuity first
  • Apply the lowest safe current limit
  • Measure supply rails before signals
  • Add one load at a time
  • Record expected and actual results
TROUBLESHOOT

Work from simple to complex

  • Confirm power, ground, polarity, and orientation
  • Compare each pin with the source
  • Test inputs separately from outputs
  • Replace only one variable at a time
  • Power off before every correction
PROJECT-SPECIFIC BUILD NOTES

Follow the documented instructions.

These notes come from this project's source and remain in their original order.

01

Project overview

Project build note

In this project, we'll make an ultrasonic range finder with an ESP32 TFT display and an HC-SR04 ultrasonic sensor. The project makes use of an integrated board that has a 3.5-inch touchscreen display, an ESP32- WROVER Module, and an OV2640 camera that has a built-in resolution of 2 million pixels. We will attach the HC-SR04 Ultrasonic Sensor to the digital pins on the ESP32 board in an external connection. The HC-SR04 ultrasonic sensor uses SONAR, just like bats do, to figure out how far away something is. It provides outstanding non-contact range detection from 2 centimeters to 400 centimeters, with high precision and reliable readings in a compact that is simple to use. The range is equivalent to 1 inch to 13 feet. An ILI9488 TFT LCD Driver is utilized in the construction of the 3.5-inch TFT Touch Screen Display. The resolution of

the screen is 320 by 480. There are a number of external pins on the ESP32 display that can be used to connect it to sensors or actuators. Because of this, they are appropriate for a wide variety of Internet of Things applications. Now, we'll look at how the ESP32 TFT Display and the Ultrasonic Sensor can be used to make a beautiful, dynamic analog-style display. On the TFT Touch Display of the ESP32 Ultrasonic Range Finder, the distance will be displayed in centimeters.

02

Part Required

Project build note

ESP32+TFT Touch Display - ESP32 3.5" TFT Touch (Capacitive) with Camera Ultrasonic Sensor - HC-SR04 Ultrasonic Sensor USB Cable - Type-C USB Cable for Programming Connecting Wires - Male to Female Jumper Wires ESP32 3.5″ TFT Touch (Capacitive) with Camera

This stunning touchscreen display has a 3.5-inch screen, is powered by an ESP32-WROVER chip, and incorporates an OV2640 camera with 2 million pixels. The incorporation of all of these element’s results in the creation of an ideal platform for a variety of ESP32 applications and projects. The TFT LCD driver is essentially an ILI9488, and it measures 3.5 inches in size and has a screen resolution of 320 by 480 pixels. The ILI9488 LCD communicates with the ESP32 microcontroller via SPI (Serial Peripheral Interface). Making the display smooth enough for videos may require the SPI main clock to be increased to between 60M and 80M. You are free to make use of any and all of these pins on the breakout connections while the camera is not being utilized. After that, you may utilize the ESP32 display for any Internet of Things application you want by connecting it to sensors or modules. Programming in Arduino and MicroPython are both supported by the ESP32 microcontroller. A micro-SD Card slot is provided on the board for the purpose of adding an external SD Card. Files and pictures can be saved to the SD Card and accessed whenever necessary. There is a USB Type-C port available, which functions as a USB to UART converter and can be used for ESP32 programming. You can directly upload the code to the board by connecting a Type-C data connection to it and then following the on-screen instructions.

03

Specification

Project build note

1. Display with a resolution of 320x480 and a size of 3.5 inches 2. Touch that can be both capacitive and resistive 3. Controller for the ESP32-WROVER 4. Connection through WIFI and BLE.

5. Programmable ESP32 device with an integrated USB2UART converter 6. 2M pixel OV2640 Camera 7. OV2640 supports produce photos up to 2 million pixels 7. Amorphous-TFT-LCD display with a 3.5-inch diagonal for use in mobile phones and other portable electronic devices 8. LCD Driver: ILI9488 9. LCD Resolution: 320*480 10. A slot for a Micro SD card affixed to the board 11. A control circuit for a resistive touch screen using four wires NS2009 12. The FT6236 is a single-chip capacitive touch panel controller Integrated Circuit. 13. Power supply is a 5V USB Type-C connection.

HC-SR04 Ultrasonic Sensor The HC-SR04 ultrasonic sensor makes use of sonar, similar to the way bats do, to detect the distance to an item. It provides outstanding non-contact

range detection, along with high precision and reliable readings, all in a compact that is simple to operate. The module has the ability to measure distances ranging from 2 centimeters to 400 centimeters (or 1 inch to 13 feet). Its functionality is unaffected by bright light or dark objects, in contrast to sharp rangefinders, which are (although acoustically soft materials like cloth can be difficult to detect). The ultrasonic transmitter and a receiver module are both included in the package as standard equipment.

04

VCC: +5VDC

Project build note

Trig: Trigger (INPUT) Echo: Echo (OUTPUT)

05

Specifications

Project build note

Minimum measurement range - 2 cm Maximum measurement range: 400 cm or 4 meter +5V is the operating voltage, and the accuracy is 3 millimeters. 15 milliamperes is the operating current. 40 kilohertz is the working frequency. Trigger Input signal: 10us pulse 15 degrees is the measured angle. How Does it Work?

Ultrasonic sensors produce brief bursts of sound at extremely high frequencies at predetermined intervals. These waves move through the air at the same rate that sound does. The sensor determines the distance to the target based on the amount of time that passes between when it sends out a signal and when it receives an echo of that signal. If the signals collide with an object, then they are reflected back as echo signals to the sensor. In order to determine the distance traveled, we need to translate this amount of time into centimeters. In order to determine the distance, we are going to utilize the following equation. S = v * t The ultrasonic wave is just a sound wave, but it moves at a speed of 340 meters per second, or 0.034 centimeters per second. We just need the

amount of time it takes for the ultrasonic sensor to register that it has hit the object, but it is measuring the amount of time it takes to hit the thing and then come back. In light of this, we shall split it in half. S = (t * 0.034)/2 Hardware Connections for ESP32 TFT Display with HC-SR04 Ultrasonic Sensor The following connections are required in order to construct an ultrasonic range finder utilizing an ESP32 and an HC-SR04 sensor. Since the TFT Touch Display and ESP32-Wrover Module are already attached on the inside of the PCB, the only connection that we need is for the Ultrasonic Sensor. Follow the instructions in the diagram below to connect the HC- SR04 Sensor. Connect the HC-SR04 Sensor's VCC and GND Pins to the ESP32's 3.3V and GND Pins respectively. In a similar fashion, connect its echo and trig pin to the GPIO26 and GPIO27 correspondingly on the ESP32.

Adding Necessary Libraries to Arduino IDE 1. TFT eSPI Library This is a TFT graphics library for Arduino processors, optimized for performance for STM32, ESP8266, and ESP32. The library is formatted specifically for use with 32-bit processors. The "Four wire" SPI and 8-bit parallel interfaces are both supported by it. Some TFT displays are supported by the library, and drivers are provided for them (ILI9163, ILI9225, ILI9341, ILI9488, ST7735, etc.). You will find a directory for the library on GitHub, from which you can download it. However, in order for our project to work properly, the library will need some modifications. Therefore, I present to you the revised version of the library. It is available for download, and you may put it in the library folder. 2. Simple HCSR04 Library A straightforward library for the Ultrasonic Sensor HC-SR04 can be found here. The method can be used with numerous sensors if multiple Simple HCSR04 Objects are created. Select the ESP32 Wrover Module from the Tools menu. Then, following the instructions for the other options, connect the ESP32 Board to the computer using a Type-C USB cable. Finally, submit the code. Ultrasonic Range Finder with ESP32 TFT Display & HC-SR04 After the code has been uploaded, the TFT Display will begin displaying the data pertaining to the distance using an analog type circular needle display. You are able to manually increase the distance from the sensor, and the TFT LCD Screen will display the resulting change in the distance.

The Ultrasonic Range Finder ESP32 can be created in the manner described here, and its distance value can be seen on the aesthetically pleasing TFT Display widget.

Ready to continue?
PROJECT ACHIEVED

You built Ultrasonic Range Finder with ESP32 TFT Display & HC-SR04.

You followed the full workflow from understanding the mission to testing the finished project. That is a real engineering achievement - well done.

DIY IoT Water pH Meter using pH Sensor & ESP32 project thumbnail featuring ESP32 Board ESP32 ESP-32S Development Board (ESP, WROOM-32), pH Sensor PH SENSOR KIT for Water
NEXT IOT ADVENTURE

DIY IoT Water pH Meter using pH Sensor & ESP32

Ready to reuse what you learned in another project from the same track?

Start this project
Browse all 500 projects