ESP32でST7735 TFT LCD液晶ディスプレイを使ってみる

.
├── include
│   └── README
├── lib
│   ├── README
│   └── TFT_ST7735
│       ├── Adafruit_GFX.cpp
│       ├── Adafruit_GFX.h
│       ├── Adafruit_SPITFT.cpp
│       ├── Adafruit_SPITFT.h
│       ├── Adafruit_ST7735.cpp
│       ├── Adafruit_ST7735.h
│       ├── Adafruit_ST77xx.cpp
│       ├── Adafruit_ST77xx.h
│       ├── examples
│       │   └── test_display
│       │       └── test_display.ino
│       ├── gfxfont.h
│       └── glcdfont.c
├── platformio.ini
├── src
│   └── main.cpp
└── test
    └── README

[platformio]
src_dir = lib/TFT_ST7735/examples/test_display

[env:esp32]
platform = https://github.com/platformio/platform-espressif32.git
board = esp32dev
framework = arduino
monitor_speed = 115200
platform_packages = framework-arduinoespressif32 @ https://github.com/espressif/arduino-esp32#2.0.2

[env:uno]
platform = atmelavr
board = uno
framework = arduino
monitor_speed = 115200

/**
 * @date 2022-11-22
 * @author Toshihiko Arai
 * @copyright https://101010.fun
*/
#include <Adafruit_GFX.h>
#include <Adafruit_ST7735.h>
#include <SPI.h>

#if defined(ESP32)
#define TFT_RST 4  // IO4
#define TFT_DC 2   // IO2
//#define TFT_MOSI 23      // VSPID
//#define TFT_SCLK 18      // VSPICLK
//#define TFT_BACKLIGHT 7  // IO7
#define TFT_CS 5  // VSPICS0

#else
  #define TFT_CS        10
  #define TFT_RST        9
  #define TFT_DC         8
#endif

Adafruit_ST7735 tft = Adafruit_ST7735(TFT_CS, TFT_DC, TFT_RST);

int number = 0;

void setup(void) {
    Serial.begin(115200);
    tft.initR(INITR_GREENTAB);
    tft.fillScreen(ST77XX_MAGENTA);
    tft.setRotation(1);
    tft.setTextWrap(false);

    tft.setTextSize(2);
    tft.setCursor(5, 5);
    tft.print("Ready...");
    delay(3000);
}

void loop() {
    char buff[4];
    sprintf(buff, "%2d", number);  // 数字を右寄せで表示させるため
    tft.setTextWrap(false);

    tft.fillScreen(ST77XX_MAGENTA);
    tft.setCursor(20, 30);
    tft.setTextColor(ST77XX_WHITE);
    tft.setTextSize(10);
    tft.println(buff);
    delay(500);

    number++;
}

.
├── include
│   └── README
├── lib
│   ├── README
│   └── TFT_ST7735
│       ├── Adafruit_GFX.cpp
│       ├── Adafruit_GFX.h
│       ├── Adafruit_SPITFT.cpp
│       ├── Adafruit_SPITFT.h
│       ├── Adafruit_ST7735.cpp
│       ├── Adafruit_ST7735.h
│       ├── Adafruit_ST77xx.cpp
│       ├── Adafruit_ST77xx.h
│       ├── Org_01.h
│       ├── RotaryEncoder.cpp
│       ├── RotaryEncoder.h
│       ├── examples
│       │   ├── test_display
│       │   │   └── test_display.ino
│       │   └── with_pot
│       │       └── with_pot.ino
│       ├── gfxfont.h
│       └── glcdfont.c
├── platformio.ini
├── src
│   └── main.cpp
└── test
    └── README

/**
 * @date 2022-11-22
 * @author Toshihiko Arai
 * @copyright https://101010.fun
 */
#include <Adafruit_GFX.h>
#include <Adafruit_ST7735.h>
#include <RotaryEncoder.h>
#include <SPI.h>
#include <Org_01.h>

/**
 * @brief TFT LCD ST7735
 */
#define TFT_RST 4  // IO4
#define TFT_DC 2   // IO2
//#define TFT_MOSI 23      // VSPID
//#define TFT_SCLK 18      // VSPICLK
//#define TFT_BACKLIGHT 7  // IO7
#define TFT_CS 5  // VSPICS0

/**
 * @brief Rotary Encoder用のPIN
 * ESP32のIO34～IO39はプルアップしないので注意
 */
#define RE_A 25
#define RE_B 26

/**
 * @brief LimitedRotator.inoを参考に、ロタリーエンコーダーの上限、下限を設定
 * https://github.com/mathertel/RotaryEncoder/blob/master/examples/LimitedRotator/LimitedRotator.ino
*/
#define ROTARYSTEPS 1
#define ROTARYMIN 10
#define ROTARYMAX 60

/**
 * @brief ST77XX_REDなどの色がおかしいので自分で定義している
 * https://forum.arduino.cc/t/st7735-0-96-160x80-shows-wrong-colors/894996
*/
const uint16_t RED = 0x001f;
const uint16_t BLUE = 0xf800;
const uint16_t GREEN = 0x07e0;
const uint16_t YELLOW = RED | GREEN;
const uint16_t ORANGE = 0x02df;

Adafruit_ST7735 tft = Adafruit_ST7735(TFT_CS, TFT_DC, TFT_RST);

RotaryEncoder encoder(RE_A, RE_B, RotaryEncoder::LatchMode::TWO03);

int lastPos = -1;

void clearDisplay() {
    tft.fillScreen(RED);
}

void setup(void) {
    Serial.begin(115200);
    tft.initR(INITR_GREENTAB);
    
    clearDisplay();
    tft.setRotation(1);
    tft.setTextWrap(false);

    tft.setFont(&Org_01);
    tft.setTextSize(2);
    tft.setCursor(20, 20);
    tft.print("Ready...");

    // pinMode(RE_A, INPUT_PULLUP); RotaryEncoderのコンストラクタでプルアップされているので必要ない
    // pinMode(RE_B, INPUT_PULLUP);

    encoder.setPosition(25 / ROTARYSTEPS);

    delay(2000);
}

void loop() {
    encoder.tick();  // just call tick() to check the state.

    int newPos = encoder.getPosition() * ROTARYSTEPS;
    
    if (newPos < ROTARYMIN) {
        encoder.setPosition(ROTARYMIN / ROTARYSTEPS);
        newPos = ROTARYMIN;

    } else if (newPos > ROTARYMAX) {
        encoder.setPosition(ROTARYMAX / ROTARYSTEPS);
        newPos = ROTARYMAX;
    }  // if

    if (lastPos != newPos) {
        lastPos = newPos;

        char buff[5];
        sprintf(buff, "%2d", newPos);  // 数字を右寄せで表示させるため
        tft.setTextWrap(false);

        clearDisplay();

        tft.setCursor(20, 15);
        tft.setTextColor(ST77XX_WHITE);
        tft.setTextSize(1);        
        tft.println("Target temperature:");

        tft.setCursor(20, 80);
        tft.setTextColor(ST77XX_WHITE);
        tft.setTextSize(10);
        tft.println(buff);

        delay(50);
    }
}

const uint16_t RED = 0x001f;
const uint16_t BLUE = 0xf800;
const uint16_t GREEN = 0x07e0;
const uint16_t YELLOW = RED | GREEN;
const uint16_t ORANGE = 0x02df;