Skip to main content

Working with ESP-IDF

This chapter includes the following sections, please read as needed:

ESP-IDF Getting Started

New to ESP32 ESP-IDF development and looking to get started quickly? We have prepared a general Getting Started Tutorial for you.

Please Note: This tutorial uses the ESP32-S3-Zero as a teaching example, and all hardware code is based on its pinout. Before you start, it is recommended that you check the pinout of your development board to ensure the pin configuration is correct.

Setting Up the Development Environment

note

The following guide uses Windows as an example, demonstrating development using VS Code + the ESP-IDF extension. macOS and Linux users should refer to the official documentation.

Version Selection

The screenshots in this section use ESP-IDF V5.5.2 as an example. When installing, please select the ESP-IDF version that matches your board's example.

Install the ESP-IDF Development Environment

  1. Download the installation manager from the ESP-IDF Installation Manager page. This is Espressif's latest cross-platform installer. The following steps demonstrate how to use its offline installation feature.

    Click the Offline Installer tab on the page, then select Windows as the operating system and the ESP-IDF version you need (the version shown in the screenshot is for reference only — choose the version that fits your actual needs).

    Download EIM and offline package

    After confirming your selection, click the download button. The browser will automatically download two files: the ESP-IDF Offline Package (.zst) and the ESP-IDF Installer (.exe).

    Download EIM and offline package 2

    Please wait for both files to finish downloading.

  2. Once the download is complete, double-click to run the ESP-IDF Installer (eim-gui-windows-x64.exe).

    The installer will automatically detect if the offline package exists in the same directory. Click Install from archive.

    Auto-detect offline package

    Next, select the installation path. We recommend using the default path. If you need to customize it, ensure the path does not contain Chinese characters or spaces. Click Start installation to proceed.

    Select installation path
  3. When you see the following screen, the ESP-IDF installation is successful.

    Installation successful
  4. We recommend installing the drivers as well. Click Finish installation, then select Install driver.

    Install drivers via ESP-IDF Installation Manager

Install Visual Studio Code and the ESP-IDF Extension

  1. Download and install Visual Studio Code.

  2. During installation, it is recommended to check Add "Open with Code" action to Windows Explorer file context menu to facilitate opening project folders quickly.

  3. In VS Code, click the Extensions icon Extensions Icon in the Activity Bar on the side (or use the shortcut Ctrl + Shift + X) to open the Extensions view.

  4. Enter ESP-IDF in the search box, locate the ESP-IDF extension, and click Install.

    Search and install ESP-IDF extension in VS Code

  5. For ESP-IDF extension versions ≥ 2.0, the extension will automatically detect and recognize the ESP-IDF environment installed in the previous steps, requiring no manual configuration.

Example

The ESP-IDF examples are located in the ESP-IDF directory of the example package.

01_factory

This example is a comprehensive demonstration for the ESP32-Touch-LCD-3.5 and is also the factory-default flashed example.

ESP32-Touch-LCD-3.5 ESP-IDF Example 1 Figure 1
ESP32-Touch-LCD-3.5 ESP-IDF Example 1 Figure 2
ESP32-Touch-LCD-3.5 ESP-IDF Example 1 Figure 3
ESP32-Touch-LCD-3.5 ESP-IDF Example 1 Figure 4
ESP32-Touch-LCD-3.5 ESP-IDF Example 1 Figure 5

Code Analysis

  • Initialize various system peripherals and load the LVGL display demo:

    esp_i2c_port_init(&i2c_bus_handle);
    esp_spi_port_init(LCD_BUFFER_SIZE);
    esp_sdcard_port_init();
    io_expander_init();
    esp_3inch5_display_port_init(&io_handle, &panel_handle, LCD_BUFFER_SIZE);
    esp_3inch5_touch_port_init(&touch_handle, i2c_bus_handle, EXAMPLE_LCD_H_RES, EXAMPLE_LCD_V_RES, EXAMPLE_DISPLAY_ROTATION);
    esp_axp2101_port_init(i2c_bus_handle);
    vTaskDelay(pdMS_TO_TICKS(200));
    esp_es8311_port_init(i2c_bus_handle);
    esp_pcf85063_port_init(i2c_bus_handle);
    esp_wifi_port_init("WSTEST", "waveshare0755");
    esp_3inch5_brightness_port_init();
    esp_3inch5_brightness_port_set(80);
    lv_port_init();

02_axp2101_example

This example demonstrates using the XPowersLib library to drive the AXP2101 on the ESP32-Touch-LCD-3.5 and prints battery information over the serial port.

ESP32-Touch-LCD-3.5 ESP-IDF Example 2 Figure 1

03_button_power_save

This example demonstrates using the espressif/button library to drive the button on the ESP32-Touch-LCD-3.5 and uses the BOOT button to wake the system from sleep mode.

ESP32-Touch-LCD-3.5 ESP-IDF Example 3 Figure 1

04_pcf85063_example

This example demonstrates driving the PCF85063 on the ESP32-Touch-LCD-3.5 using the sensorlib library and prints its data over the serial port.

ESP32-Touch-LCD-3.5 ESP-IDF Example 4 Figure 1

05_tca9554_example

This example demonstrates driving the TCA9554 on the ESP32-Touch-LCD-3.5 using the espressif/esp_io_expander_tca9554 library, allowing input/output operations on the I/O expander.

ESP32-Touch-LCD-3.5 ESP-IDF Example 5 Figure 1

06_sd_card_test

This example demonstrates testing TF card read/write functionality with the ESP32-Touch-LCD-3.5.

Hardware Connection

*Connect the board to the computer *Insert the TF card into the card slot (the TF card must be formatted as FAT32)

ESP32-Touch-LCD-3.5 ESP-IDF Example 6 Figure 1

Code Analysis

  • SPI initialization:

    spi_bus_config_t bus_cfg = {
    .mosi_io_num = PIN_NUM_MOSI,
    .miso_io_num = PIN_NUM_MISO,
    .sclk_io_num = PIN_NUM_CLK,
    .quadwp_io_num = -1,
    .quadhd_io_num = -1,
    .max_transfer_sz = 4000,
    };

    ret = spi_bus_initialize(host.slot, &bus_cfg, SDSPI_DEFAULT_DMA);
    if (ret != ESP_OK) {
    ESP_LOGE(TAG, "Failed to initialize bus.");
    return;
    }
  • Initialize and mount the TF card:

    sdspi_device_config_t slot_config = SDSPI_DEVICE_CONFIG_DEFAULT();
    slot_config.gpio_cs = PIN_NUM_CS;
    slot_config.host_id = host.slot;

    ESP_LOGI(TAG, "Mounting filesystem");
    ret = esp_vfs_fat_sdspi_mount(mount_point, &host, &slot_config, &mount_config, &card);

07_lvgl_example

This example demonstrates running an LVGL example program on the ESP32-Touch-LCD-3.5.

ESP32-Touch-LCD-3.5 ESP-IDF Example 7 Figure 1

Code Analysis

  • Initialize LCD, screen touch, and LVGL:

    app_i2c_init();
    app_io_expander_init();

    /* LCD HW initialization */
    ESP_ERROR_CHECK(app_lcd_init());

    /* Touch initialization */
    ESP_ERROR_CHECK(app_touch_init());

    /* LVGL initialization */
    ESP_ERROR_CHECK(app_lvgl_init());

08_lvgl_audio_play

This example uses LVGL to implement an MP3 player. The example scans MP3 files in the root directory of the memory card for playback.

Hardware Connection

*Insert the TF card into the card slot (the TF card must be formatted as FAT32 and have MP3 files placed in its root directory).

ESP32-Touch-LCD-3.5 ESP-IDF Example 8 Figure 1

Code Analysis

  • Initialize I2C, I2S, and the audio codec:
    app_i2c_init();
    app_io_expander_init();
    ESP_ERROR_CHECK(esp_board_init(16000, 2, 16));
  • Initialize the screen, memory card, and player, then scan MP3 files on the memory card and save them to an array:
    /* LCD HW initialization */
    ESP_ERROR_CHECK(app_lcd_init());
    esp_sdcard_init("/sdcard", 5);
    Audio_Play_Init();
    Search_mp3_Music();
  • Initialize touch and LVGL, and load the player interface:
    /* Touch initialization */
    ESP_ERROR_CHECK(app_touch_init());

    /* LVGL initialization */
    ESP_ERROR_CHECK(app_lvgl_init());

    lvgl_port_lock(0);

    lv_app_music_init();

    lvgl_port_unlock();

09_lvgl_image

This example uses LVGL to display images and supports switching between images by swiping left or right.

ESP32-Touch-LCD-3.5 ESP-IDF Example 9 Figure 1

Code Analysis

  • Load the image and initialize gesture swipe events; switch images in the gesture event:
    lvgl_port_lock(0);
    image_slider_init();
    lvgl_port_unlock();