1

DATE MONDAY, JULY 3, 2023

PROJECT 6 PAGES, ESP32 TOUCH SWITCH WITH SPI LCD

REFERANCE TMQ05P12BSP12R

REVISION V0.0

DELIVERY TIME 5 DAYS

OVERVIEW

SAMPLE PHOTO: THE FOLLOWING PHOTO IS TO MAKE THE FINAL

DELIVERY CLEAR ABOUT HOW IT SHOULD WORK.

1. Draft block Diagram

When Press Touch ESP32:

Buttons 1 on the
Keypad for example.
Note this keypad can
have many pages up to
6 pages and to move to
next page we will press
on button no. 12 long
press and to go to
previous page we will
press on button 11 long
press.
1. Control relay no. 1 if it enables from web interface.
2. Send the status of relay to MQTT broker.
3. Update the status RGB LED as per the web interface selection.
4. To update the ICON status also on the SPI screen (ON/OFF).
5. Red the value of temp. sensor and update the spi and MQTT broker
MQTT broker can do the following:
1. To receive the status of each button when pressed and each a certain
time to avoid missing messages. “Time will be set in web interface”.
2. To send ON/OFF mqtt command of any button to control relay and
update the status and get feedback.
2

2. Project Scope of work and Description

To build 12 buttons touch switch using TTP223, ESP32 ,12 relays and SPI TFT LCD “to show the button name and
ICON” with web interface so we can:

A. Update the icons, logo, names, and the input status, update status of each button every a certain no. of
seconds, define the status color beside each button in case of ON and OFF “RGB LED”

B. Read the value of the connected temp. sensors and update the LCD with these values.

Additionally, this keypad will switch ON/OFF 12 relays, each relay will be connected by default to a button so in
web interface we should enable/disable each RELAY (when enables it meand by default relays will work with
each press when disables it will update the SPi LCD and status LED and send to broker the ON/OFF command)

- Web interface/exe software for configuration: -

1- Create new Project >> add >> page >> add more pages.

2- Rename the project>> save the project also to be able to rename it.

3- Switch Settings: (to select between static IP and DHCP, in case Static we should enter the
network parameters).

4- Output settings: it should be MQTT and UART; MQTT from ESP to MQTT broker and UART
will be used to monitor it with computer if needed.

- To set the UART Parameters.

- Receiving the commands from the server to the microcontroller and accordingly to update
the screen if any button ON/OFF.

5- About us: Email, Website, Logo, Hardware version, firmware version, Serial number, these
should be edit by us.

6- Reset To factory settings so we can remove all configured settings.

7- Reboot the device.

8- Export Settings: the web interface should enable us to save the settings of the Screen so we
can import it to any new screen again instead of repeating same settings and duplicate the
works.

3. Web Interface:
1. Two logos will be inserted in the header and email, website will be in the footer of all pages.
3

2. It should have a fixed left menu as follows

About Us

Network settings

Output settings

Reset User

Reset To Factory Settings

Reboot

Logout

4. SPI LCD Interface examples:

5. Project Delivery date:

To be mutually agreed

6. Project Budget:
Seller has to submit his proposal based on his evaluation and we will select the best offer based on the seller
reviews, offered price and the delivery time.