• Step 4: Result

    Makerfabs04/09/2024 at 01:18 0 comments

    The Arc value changed when I move the lever of Mabee_Slide Potentiometer, this is a good sign, I think I will get my thermometer and my weight scale in the near future.

    However, except for thermometer and weight scale, I think the 1.28 inch screen with ADC can be used for more interesting creation. So, do you have any better ideas?

  • Step 3: Firmware

    Makerfabs04/09/2024 at 01:17 0 comments

    • The "TFT_eSPI" library was created created when Squareline exports the project file, we need to modify the "Users_Setup.h" file of it, because every development board has different screen drivers IC, The ESP32-S3 1.28" use the GC9A01 as drivers IC, So define this driver.

    Define GC9A01_DRIVER, and define the pixel width and height in portrait orientation for GC9A01

    #define GC9A01_DRIVER
    #define TFT_WIDTH  240
    #define TFT_HEIGHT 240 // GC9A01 240 x 240

    Then set the drive pin according to the schematic diagram 

    #define TFT_MOSI 13 // In some display driver board, it might be written as "SDA" and so on.
    #define TFT_SCLK 14
    #define TFT_CS   15  // Chip select control pin
    #define TFT_DC   21  // Data Command control pin
    #define TFT_RST  11  // Reset pin (could connect to Arduino RESET pin)
    #define TFT_BL   45  // LED back-light

    In Section 3. Define the fonts that are to be used here. We chose a variety of fonts to prevent them from being used without initializing them 

    #define LOAD_GLCD   // Font 1. Original Adafruit 8 pixel font needs ~1820 bytes in FLASH
    #define LOAD_FONT2  // Font 2. Small 16 pixel high font, needs ~3534 bytes in FLASH, 96 characters
    #define LOAD_FONT4  // Font 4. Medium 26 pixel high font, needs ~5848 bytes in FLASH, 96 characters
    #define LOAD_FONT6  // Font 6. Large 48 pixel font, needs ~2666 bytes in FLASH, only characters 1234567890:-.apm
    #define LOAD_FONT7  // Font 7. 7 segment 48 pixel font, needs ~2438 bytes in FLASH, only characters 1234567890:-.
    #define LOAD_FONT8  // Font 8. Large 75 pixel font needs ~3256 bytes in FLASH, only characters 1234567890:-.
    //#define LOAD_FONT8N // Font 8. Alternative to Font 8 above, slightly narrower, so 3 digits fit a 160 pixel TFT
    #define LOAD_GFXFF  // FreeFonts. Include access to the 48 Adafruit_GFX free fonts FF1 to FF48 and custom fonts
    // Comment out the #define below to stop the SPIFFS filing system and smooth font code being loaded
    // this will save ~20kbytes of FLASH
    #define SMOOTH_FONT

    The touch panel driver is CST816S, so it need to call the touch function of CST816S. 

    void my_touchpad_read(lv_indev_drv_t *indev_driver, lv_indev_data_t *data)
        uint16_t touchX = 0, touchY = 0;
        bool touched = false; // tft.getTouch( &touchX, &touchY, 600 );
        if (!touch.available())
            data->state = LV_INDEV_STATE_REL;
            data->state = LV_INDEV_STATE_PR;
            /*Set the coordinates*/
            touchX = touch.data.x;
            touchY = touch.data.y;
            data->point.x = touchX;
            data->point.y = touchY;
            USBSerial.print("Data x ");
            USBSerial.print("Data y ");

    initial the TFT_BLK, touch and ADC pins 

    pinMode(TFT_BLK, OUTPUT);
       digitalWrite(TFT_BLK, 1);
       pinMode(ADC_INPUT_1, INPUT);

     Modify the landscape orientation. The default value is 3. You need to change it to 0

    tft.begin();        /* TFT init */
    tft.setRotation(0); /* Landscape orientation, flipped */

    Get the value of ADC, let the value of ui-Arc1/2/3 be changed with the output voltage of Mabee_Slide Potentiometer

    int adc = analogRead(ADC_INPUT_1);
       long int adc_percent = adc * 100 / 4096;
       lv_arc_set_value(ui_Arc1, (int)adc_percent);
       lv_arc_set_value(ui_Arc2, (int)adc_percent);
       lv_arc_set_value(ui_Arc3, (int)adc_percent);

    The raw code.

  • Step 2: SquareLine Design

    Makerfabs04/09/2024 at 01:13 0 comments

    • Create a new product

    Choose the Arduino and enter in parameters. According to the features of MaTouch_ESP32-S3 Round SPI TFT with Touch 1.28", the resolution is 240*240, the shape is a circle, and the color depth is 16-bit.

    • Design the screen

    Add the images to assets, and then it allows you to select them and widget components to design the scenes. After, clicking the widget of the list on the Hierarchy panel, you can modify the parameters of the select widget on the Inspector panel, all is determined by your preference.

  • Step 1: Hardware

    Makerfabs04/09/2024 at 01:12 0 comments

    • Connect Potentiometer to J1 of 1.28" screen.

    The VCC to +3.3V

    The GND to GND

    The OUT to IO17

  • Supplies

    Makerfabs04/09/2024 at 01:12 0 comments

    The 1.28" screen have 2 standard GPIO and I2C bus, which colud be used as ADC.

    When the lever moved from one side to the other, its output voltage ranges between 0 V to the VCC you applied.

    • Software support: Arduino, SquareLine