Интерфейсы на LilyGO T-Embed

Основы работы с дисплеем и сенсором

Для работы с дисплеем и сенсорным экраном вам понадобятся две основные библиотеки:

• TFT_eSPI: мощная библиотека для работы с TFT-дисплеями, позволяющая рисовать фигуры, выводить текст, изображения и даже анимировать элементы.
• XPT2046_Touchscreen: библиотека для взаимодействия с сенсорным контроллером дисплея.

Установка и настройка:

• Установите эти библиотеки через Менеджер библиотек в Arduino IDE.
• Найдите файл User_Setup.h в папке с библиотекой

Закомментируйте все строки include и раскомментируйте строку, подходящую для T-Embed: include User_Setups/Setup12_TTGO_T-Display_and_TTGO_T-Embed.h.

Сохраните файл. Теперь библиотека знает, как взаимодействовать с вашим дисплеем.

Простой код для рисования на экране

#include <TFT_eSPI.h> // Подключаем библиотеку для дисплеяTFT_eSPI tft = TFT_eSPI(); // Создаем объект tftvoid setup() {  tft.init(); // Инициализация дисплея  tft.setRotation(1); // Установка ориентации экрана (ландшафтная)  tft.fillScreen(TFT_BLACK); // Заполняем экран черным цветом}void loop() {  tft.fillRect(50, 50, 100, 80, TFT_BLUE); // Рисуем синий прямоугольник  tft.drawCircle(200, 150, 40, TFT_RED); // Рисуем красный круг  tft.drawString("Hello, T-Embed!", 80, 200, 2); // Выводим текст  delay(2000);  tft.fillScreen(TFT_BLACK); // Очищаем экран  delay(1000);}

Создание интерактивных элементов: кнопки

Для создания интерактивных интерфейсов можно использовать функции для рисования и распознавания нажатий.

Определите координаты и размеры области, которая будет служить кнопкой. Например, кнопка "Включить" может быть прямоугольником в левой части экрана.

Используйте tft.fillRect() для рисования самой кнопки и tft.drawString() для вывода текста на ней.

Используйте библиотеку XPT2046_Touchscreen для получения координат нажатия. Затем, с помощью условного оператора if, проверьте, попадают ли полученные координаты в область вашей кнопки.

Пример кода с кнопкой:

#include <TFT_eSPI.h>#include <XPT2046_Touchscreen.h>TFT_eSPI tft = TFT_eSPI();#define CS_PIN  21  // Пин CS для сенсорного контроллера#define T_CLK   18#define T_MISO  19#define T_MOSI  23XPT2046_Touchscreen ts(CS_PIN, T_CLK, T_MISO, T_MOSI);void drawButton(int x, int y, int w, int h, const char *text, uint16_t color) {  tft.fillRect(x, y, w, h, color);  tft.setCursor(x + 10, y + 10);  tft.setTextColor(TFT_WHITE);  tft.setTextSize(2);  tft.print(text);}void setup() {  tft.init();  tft.setRotation(1);  ts.begin();  ts.setRotation(1);  drawButton(50, 100, 150, 50, "ON", TFT_GREEN);}void loop() {  if (ts.touched()) {    TS_Point p = ts.getPoint();    p.x = map(p.x, 200, 3800, 0, 240);    p.y = map(p.y, 240, 3800, 0, 320);    if (p.x > 50 && p.x < 200 && p.y > 100 && p.y < 150) {      tft.fillScreen(TFT_BLACK);      tft.drawString("Turned ON!", 80, 120, 2);      delay(2000);      drawButton(50, 100, 150, 50, "ON", TFT_GREEN);    }  }}

Поворотный энкодер: альтернатива сенсору

Вместо сенсора или в дополнение к нему можно использовать поворотный энкодер LilyGO T-Embed. Он идеально подходит для точного управления, например, для регулировки яркости или громкости.

Используйте библиотеку Button2 для обработки нажатий на кнопку энкодера и RotaryEncoder для отслеживания вращения.

Пример кода с энкодером:

#include <RotaryEncoder.h>#include <Button2.h>#define ROTARY_CLK 39#define ROTARY_DT  40#define ROTARY_SW  0RotaryEncoder encoder(ROTARY_DT, ROTARY_CLK, RotaryEncoder::LatchMode::TWO03);Button2 button(ROTARY_SW);void setup() {  Serial.begin(115200);}void loop() {  encoder.tick();  button.loop();  static int pos = 0;  int newPos = encoder.getPosition();  if (pos != newPos) {    pos = newPos;    Serial.printf("Encoder position: %d
", pos);  }  button.setClickHandler([](Button2& b) {    Serial.println("Button pressed!");  });}

Сочетание элементов и графические возможности

Чтобы создать полноценный интерфейс, сочетайте разные элементы:

• Организуйте экран: Разделите экран на зоны для разных функций (например, статус, данные, управление).
• Используйте изображения: TFT_eSPI позволяет выводить изображения с MicroSD-карты, что делает интерфейс более привлекательным.
• Создайте меню: Используйте энкодер для навигации по пунктам меню и кнопку для выбора.

LilyGO T-Embed — это мощный инструмент для создания кастомизированных интерфейсов, и с помощью этих шагов вы сможете начать реализовывать свои идеи.