Introduction: Run LVGL on MaTouch With SquareLine IDE

Based on ESP32S3, I have a 2.1 inch round display, and I've been struggling with the tedious steps of using LVGL on it, but now that I've found a way to simplify it.

I once made a passcode lock with a ESP32S3 2.1" round screen, but in practice, the steps for this module to use Squareline are just too complicated.

Every time I use the ui.ino file output from Squareline, I have to modify some library settings, define the pins, add the touch file and modify the relevant code according to the touch file. It's a bit inefficient. After speaking with Squareline officials, they offered me a method, this method directly packages all the steps mentioned in the appeal and outputs them, skips most of the pre-configuration of the library and code, and I've implemented it.

Supplies

Step 1: Download and Install Squareline

  • Please download and install Squareline version 1.4.0.
  • And then, download simplified packages.
  • Open document Squareline board, unzip the simplified packages and copy it into the board folder.

Step 2: Create Project

  • Open the Squareline Studio application and click “Create”.
  • You will see an option named “Makerfabs”. Select it, and you will see two different board sizes: 2.1 inch and 4.0 inch.
  • Choose the one you need, modify the address where you want to save the project and click “CREAT”.
  • Now, add your components to the canvas and click Output.

Step 3: Library Setting

  • Open the folder where you saved the output file and copy lv_conf.h from SquareLine_Project >> library to lvgl >> scr.
  • Then, copy all the libraries of SquareLine_Project to document >> Arduino >> library.
  • If these libraries already exist, delete the original ones.

Step 4: Verify Program

  • Open ui.ino.
  • In the past, you needed to write the code related to libraries, pin definition, screen initialization, and touch file usage by yourself. But now, open ui.ino, and you will notice that this code has already been written for you, saving you time and effort.
  • Now, you just need to write the control code for the ui component according to your needs.
  • verify it, and you should see the draft run successfully.
  • Upload it to the screen, and you can interact with the screen.

Step 5: Detailed Operation Video

I made a video that carefully explains how to do this.

Step 6: More Info

This method will help you use LVGL on Matouch screens more easily. Simply open the Makerfabs options page and click on 'info', you will access our product page, which contains a lot of resources.

We currently offer simplified packages for sizes 2.1 and 4.0, you can get the simplified package from GitHub:https://github.com/Makerfabs/MaTouch-simplified-packages-for-squareline

More exciting options are in development and we're working on a 1.9″ simplified package, so stay tuned and get ready to experience it.