Some time ago, I built a simple yet beautiful UI using Squareline Studio, and I then deployed that GUI on an Arduino Nano RP2040 Connect that displayed it on a small touchscreen. You can learn more about that process here. While those two videos discussed the process of building and exporting the UI in great detail, they never explained how to control the UI using the touch screen. Therefore, this third part in the mini-series goes over enabling the touchscreen and making it work with the UI.
As with the other two parts before, the whole process is easier to explain in a video than in written text. Therefore, I recommend you watch the video and treat this article as an extension:
https://youtu.be/9THz0j579Tw
The main steps for enabling touch inputs and linking them to the Squareline UI elements differ, depending on the display you use. Unfortunately, at the time of making this guide, TFT_eSPI, the library Squareline uses for displaying the UI, only supports a single touchscreen controller.
If you happen to have an XPT2046-based SPI-capable touchscreen, then all you need to do is enable the touch inputs in the user_settings.h configuration file (discussed extensively in the second video). Then, you only have to re-enable the commented-out section in the my_touchpad_read function to enable setting the touched variable based on the display state.
In any other case, you’ll have to find out which touchscreen controller your display uses, then install the appropriate libraries for that controller, and read the display values in the my_touchpad_read function. Make sure to pass the values into the data object. This process depends on the display you have, and you can always refer to the screen’s documentation if you’re not sure how to use it or how you can get the X and Y coordinates.
Finally, it’s worth mentioning that display calibration is typically required. Here, you have to make sure that the top-left corner of the screen maps to the coordinate system’s origin and the bottom-right corner returns the screen’s dimensions to the program when pressed.
After enabling touch inputs, you might also want to watch the following video to learn how to make LVGL events trigger actions on the Arduino and vice versa:
https://www.youtube.com/watch?v=PTKjjDPNIdM