ESP-IDF

This chapter contains the following sections. Please read as needed:

• ESP-IDF Getting Started
• Setting Up the Development Environment
• Example

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.

• Section 1: Environment Setup
• Section 2: Running Examples
• Section 3: Creating a Project
• Section 4: Using Components
• Section 5: Debugging
• Section 6: FreeRTOS
• Section 7: Peripherals
• Section 8: Wi-Fi Programming
• Section 9: BLE Programming

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

info

For the ESP32-C6-Touch-LCD-1.47 development board, ESP-IDF V5.5.0 or above is required.

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).

   

   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).

   

   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.

   

   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.

   

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

   

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

   

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 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.

   

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

IDF example

Example	Basic Description	Dependency Library
01_factory	Comprehensive example program	-
02_sd_card_test	Test TF card read/write	-
03_lvgl_example	Display LVGL example program	-
04_lvgl_image	Display images using LVGL library	-

01_factory

Example Description

• This example tests the functions of the onboard modules of the ESP32-C6-Touch-LCD-1.47. The screen will display information about each module, and the user can swipe left or right on the touchscreen to switch pages.

Hardware Connection

• Connect the board to the computer.
• Insert the TF card into the card slot.

Code Analysis

• Specify the image to be displayed.

  i2c_bus_handle = bsp_i2c_init();
  bsp_battery_init();
  bsp_wifi_init("WSTEST", "waveshare0755");
  bsp_display_init(&io_handle, &panel_handle, EXAMPLE_LCD_H_RES * EXAMPLE_LCD_DRAW_BUFF_HEIGHT);
  bsp_touch_init(&touch_handle, i2c_bus_handle, EXAMPLE_LCD_H_RES, EXAMPLE_LCD_V_RES, EXAMPLE_DISPLAY_ROTATION);
  bsp_sdcard_init();
  ESP_ERROR_CHECK(app_lvgl_init());
  lv_fs_fatfs_init();
  
  bsp_display_brightness_init();
  bsp_display_set_brightness(100);

• LVGL graphics library configuration

  if (lvgl_port_lock(0))
  {
      lvgl_ui_init();
      lvgl_port_unlock();
  }

Operation Result

02_sd_card_test

Example Description

• This example demonstrates testing TF card read/write functionality on the ESP32-C6-Touch-LCD-1.47.

Hardware Connection

• Connect the board to the computer.
• Insert the TF card into the card slot (the TF card needs to be formatted as FAT32).

Code Analysis

• Initialize SPI.

    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;
   }

• 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);

Operation Result

• Insert the TF card into the computer, and three files test.txt, FOO.TXT and NIHAO.TXT will appear. Among them, the content of the FOO.TXT is Hello SD!, the content of the NIHAO.TXT is Hello SD!, and the content of the test.txt is empty

03_lvgl_example

Example Description

• This example demonstrates running the LVGL example program on the ESP32-C6-Touch-LCD-1.47.

Hardware Connection

• Connect the board to the computer.

Code Analysis

• Select the LVGL example to run.

  // lv_demo_benchmark();
  // lv_demo_music();
  lv_demo_widgets();

Operation Result

• Touch operation is supported.

04_lvgl_image

Example Description

• This example demonstrates the ESP32-C6-Touch-LCD-1.47 running LVGL to display an image.

Hardware Connection

• Connect the board to the computer.

Preparation

• Open LVGL image converter website.
• Import the image images/image_1.jpg and convert it; this will generate an image_1.c file.

• Copy image_1.c to the main folder.
• Add "image_1.c" to the CMakeLists.txt in the main folder.

  idf_component_register(SRCS "main.c" "image_1.c"
                    INCLUDE_DIRS ".")

Code Analysis

• In main.c, add the following code to declare the image.

  LV_IMG_DECLARE(image_1);

• Specify the image to be displayed.

  lv_img_set_src(img, &image_1);

Operation Result