ESP32 с дисплеем Oled - индикатор выполнения: 6 шагов

2024 Автор: John Day | [email protected]. Последнее изменение: 2024-01-30 11:53

ESP32, о котором мы собираемся поговорить сегодня, уже поставляется со встроенным Display Oled. Эта функция делает нашу жизнь намного проще, потому что мы можем иметь представление о значении появляющейся переменной. Вам даже не нужно смотреть в окно отладки. Кроме того, вы можете собирать представления и рисовать графики производительности, среди прочего. Благодаря этим преимуществам я считаю эту модель фантастическим продуктом, и сегодня мы будем программировать ее с помощью Arduino IDE.

Итак, в этом видео мы запрограммируем индикатор выполнения. Важно помнить, что если на вашем ESP32 нет дисплея, его можно купить отдельно. Кроме того, если вы никогда не программировали ESP32, я предлагаю вам посмотреть это видео: ВИДЕО ВВЕДЕНИЕ В ESP32, в котором эта тема рассматривается более подробно.

Шаг 1. Библиотека

Чтобы использовать oled-дисплей, нам нужно настроить библиотеку в Arduino IDE. Для этого скачайте библиотеку по ссылке.

Разархивируйте файл и вставьте его в папку с библиотеками Arduino IDE.

C: / ProgramFiles (x86) / Arduino / библиотеки

Шаг 2: Wemos Lolin ESP32 OLED

Wemos Lolin - это название этого ESP. На изображении черная часть - это дисплей, а рядом с устройством мы отображаем всю распиновку. Как показано, есть несколько вводов-выводов, которые позволяют нам включать и выключать различные элементы. Кроме того, в этой модели есть WiFi и Bluetooth последнего поколения.

Шаг 3: Пример

На видео вы можете увидеть наш готовый проект и то, как использовать OLED-дисплей для отображения индикатора выполнения, управляемого потенциометром.

Шаг 4: Сборка

Для нашей сборки я использовал потенциометр 10k, и я включил GPIO25 курсора. У нас также есть 3v3 и GND, как вы можете видеть на рисунке ниже. Питание будет поступать от самого USB.

Шаг 5: Код

Сначала мы добавляем библиотеку «SSD1306.h». После этого мы получим доступ к OLED-дисплею. После этого мы создаем экранный объект типа SSD1306, который будет отвечать за управление контентом, отображаемым на OLED-дисплее.

#include "SSD1306.h" // псевдоним для #include "SSD1306Wire.h" // объект, управляющий отображением светодиода / * 0x3c: пользовательский идентификатор для связи для отображения pino 5 и 4 são os de comunicação (SDA, SDC) * / Экран SSD1306 (0x3c, 5, 4); // pino que ligamos o Potenciometro #define PINO_POTENCIOMETRO 25 // использовать для fazer или contador de porcentagem int contador;

Настраивать

В функции setup () мы инициализируем наш экранный объект, чтобы мы могли контролировать, что будет отображаться. Через этот объект мы также настроим источник записи для отображаемых текстов. И, наконец, мы устанавливаем вывод (в частности, вывод, на котором мы поворачивали потенциометр) на ВХОД, чтобы прочитать значение.

void setup () {Serial.begin (115200); Serial.println (); Serial.println (); // Инициализация объекта управления объектом на теле screen.init (); // изображение на 180º (deixa de ponta cabeça) // display.flipScreenVertical (); // настраиваем фоновый рисунок "ArialMT_Plain_10" screen.setFont (ArialMT_Plain_10); // configura o pino for fazer a leitura do Potenciômetro. pinMode (PINO_POTENCIOMETRO, ВХОД); }

Петля

В функции loop () мы прочитаем текущее значение потенциометра. Мы можем заметить, что мы используем функцию «map» вскоре после считывания значения, потому что считанное значение слишком велико для отображения индикатора выполнения, поэтому мы сопоставим значение в диапазоне от 0 до 100.

void loop () {// leitura do valor do Potenciometro int valor = analogRead (PINO_POTENCIOMETRO); //Serial.println(valor); // mapeando o valor do Potenciometro para o valor da barra de progresso // Potenciometro faz a leitura do valor no intervalo de 0 a 4095 // a barra de progresso espera um valor entre 0 e 100 contador = map (valor, 0, 4095, 0, 100); // вывод на экран, вывод на экран screen.clear (); // ++ counter; // счетчик> 100? счетчик = 0: счетчик = счетчик; // десенха индикатора выполнения drawProgressBar (); // Exibe na tela o que foi configurado até então. screen.display (); задержка (10); }

В функции «drawProgress ()» мы будем использовать значение, считываемое с потенциометра, которое сохраняется в переменной «percProgress» для установки на индикаторе выполнения. Мы также разместим текст прямо над индикатором выполнения, показывающий текущий процент.

// функция отображения индикатора выполнения no displayvoid drawProgressBar () {Serial.print (">>"); Serial.println (contador); // десенха индикатора выполнения / * * drawProgressBar (x, y, width, height, value); параметры (p): p1: x coordenada X no plano cartesiano p2: y coordenada Y no plano cartesiano p3: width comprimento da barra de progresso p4: height altura da barra de progresso p5: value valor que a barra de progresso deve assumir * / screen.drawProgressBar (10, 32, 100, 10, contador); // Настройка или изменение текстового сообщения // Необязательный текст или центральный экран screen.setTextAlignment (TEXT_ALIGN_CENTER); // перевод текста / * * drawString (x, y, text); параметры (p): p1: x coordenada X no plano cartesiano p2: y coordenada Y no plano cartesiano p3: string texto que será exibido * / screen.drawString (64, 15, String (contador) + "%"); // se o contador está em zero, вывести строку "valor mínimo" if (contador == 0) {screen.drawString (64, 45, "Valor mínimo"); } // se o contador está em 100, вывести строку "valor máximo" else if (contador == 100) {screen.drawString (64, 45, "Valor máximo"); }}

Шаг 6: некоторые другие интересные функции

Отображать

// переворачиваем дисплей

void flipScreenVertical ();

Рисунок

// отрисовывает один пиксель с экрана

void setPixel (int16_t x, int16_t y);

// рисуем линию

void drawLine (int16_t x0, int16_t y0, int16_t x1, int16_t y1);

// рисуем прямоугольник

void drawRect (int16_t x, int16_t y, int16_t width, int16_t height);

// нарисовать круг

void drawCircle (int16_t x, int16_t y, int16_t radius);

// закрашиваем круг

void fillCircle (int16_t x, int16_t y, int16_t radius);

// рисуем горизонтальную линию

void drawHorizontalLine (int16_t x, int16_t y, int16_t length);

// рисуем вертикальную линию

void drawVerticalLine (int16_t x, int16_t y, int16_t length);

Текст

// задает выравнивание текста для записи

// TEXT_ALIGN_LEFT, TEXT_ALIGN_CENTER, TEXT_ALIGN_RIGHT, TEXT_ALIGN_CENTER_BOTH

недействительным setTextAlignment (OLEDDISPLAY_TEXT_ALIGNMENT textAlignment);