例の黄色い基板をModdable対応してみた

# はじめに

IoTLT vol.95で紹介があった「例の黄色い基板」を入手しました。(48:24あたり)

https://www.youtube.com/watch?v=OlRVeBUVO_Y&t=2904

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/e138f741-d498-9e66-ba44-ce2e38e189d3.jpeg" width="75%">

### 参考

黄色い基板まとめ

https://lang-ship.com/blog/work/esp32-lcd/

2.8インチタッチパネル

https://lang-ship.com/blog/work/esp32-2432s028r-1/

https://lang-ship.com/blog/work/esp32-2432s028r-2/

https://macsbug.wordpress.com/2022/08/17/esp32-2432s028/

3.5インチタッチパネル

https://lang-ship.com/blog/work/esp32-3248s035/

https://macsbug.wordpress.com/2022/10/02/esp32-3248s035/

1.9インチディスプレイ(タッチパネルなし)

https://lang-ship.com/blog/work/esp32-1732s019/

http://gijin77.blog.jp/archives/cat_409280.html

作った人 (fmzhangpei241氏)

https://www.arduino.cn/thread-109053-1-1.html

# 到着

2.8インチ(感圧)版
2023年2月9日に届きました。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/ab10a5ba-7851-670b-06ec-e27a1ab0639a.jpeg" width="75%">

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/89020977-6094-5b0e-bde1-9751213c6a69.jpeg" width="75%">

3.5インチ(感圧)版
2023年2月17日に届きました。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/b6fb7759-eb09-be8a-fe9f-7c05f1b12b95.jpeg" width="75%">

# Moddable対応

## 2.8インチ(感圧)版

LCDドライバはILI9341Vで、タッチパネルはXPT2046が使用されているので、Moddableでサポートしていることを確認しました。
しかし、SPIが共有されておらず、LCDドライバのみをサポートしています。
(VSPIを使用するとリセット動作をするため、HSPIしか使用できませんでした。)

ILI9341V

|GPIO|PIN|
|--|--|
|14|TFT_SCK|
|12|TFT_SDO|
|13|TFT_SDI|
|15|TFT_CS|
|2|TFT_RS|
|21|TFT_BACKLIGHT|

XPT2046

|GPIO|PIN|
|--|--|
|25|TP_CLK|
|32|TP_DIN|
|39|TP_OUT|
|33|TP_CS|
|36|TP_IRQ|

USB以外に4つの外部端子がありますが、いずれも使いづらいです。

- 電源端子　(VINで入力方向のみ。USBシリアルがあるので利用する用途なし。)
  - VIN
  - TXD2
  - RXD2
  - GND
- 温湿度センサー端子 (GPIO27は10kΩでプルアップされています。)
  - 3.3V
  - GPIO27
  - (N/A)
  - GND
- スピーカー端子
  - VO1
  - VO2
- 外部接続端子 (GPIO21はLCDのバックライト制御で使用されています。GPIO35は入力専用。)
  - GPIO21
  - GPIO22
  - GPIO35
  - GND

### デバイスサポート

LCDはModdable標準のILI9341ドライバを使用できましたので、LCDの初期化コマンドの定義は不要でした。
タッチパネルはSPIを共有していないため使用できませんでした。(HSPIのみ使用し、LCD用に割り当てました。)
外部端子はI2Cには使用できないため、デバイス定義を省略しました。

```bash
├── host
│   └── provider.js
└── manifest.json
```

```javascript:host/provider.js
import Analog from "embedded:io/analog";
import Digital from "embedded:io/digital";
import DigitalBank from "embedded:io/digitalbank";
import I2C from "embedded:io/i2c";
// import PulseCount from "embedded:io/pulsecount";
import PWM from "embedded:io/pwm";
import Serial from "embedded:io/serial";
import SMBus from "embedded:io/smbus";
import SPI from "embedded:io/spi";

const device = {
        Serial: {
                default: {
                        io: Serial,
                        port: 1,
                        receive: 3,
                        transmit: 1
                }
        },
        SPI: {
                default: {
                        io: SPI,
                        clock: 14,
                        in: 12,
                        out: 13,
                        port: 1  // HSPI
                        // port: 2  // VSPI
                }
        },
        io: {Digital, DigitalBank, PWM, Serial, SMBus, SPI},
        pin: {
                button: 0,
                backlight: 21,
                displayDC: 2,
                displaySelect: 15
        }
};
```

```javascript:manifest.js
{
        "include": [
                "$(MODDABLE)/modules/drivers/ili9341/manifest.json"
        ],
        "build": {
                "UPLOAD_SPEED": "1500000"
        },
        "config": {
                "screen": "ili9341"
        },
        "defines": {
                "spi": {
                        "miso_pin": 12,
                        "mosi_pin": 13,
                        "sck_pin": 14
                },
                "ili9341": {
                        "hz": 40000000,
                        "cs_pin": 15,
                        "dc_pin": 2,
                        "spi_port": "HSPI_HOST",
                        "backlight_pin": 21,
                        "backlight_on": 1
                }
        }
}
```

GitHubにもファイルを置きました。

https://github.com/kitazaki/moddable/tree/public/build/devices/esp32/targets/esp32_2432s028r

$MODDABLE/examples/piu/ballsデモ

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/88e39685-430f-a0e9-dda6-2077b21b37eb.jpeg" width="75%">

Node-RED MCUのDashboard表示

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/1995ca87-c53d-c9bc-50ff-b52d4dfff2d0.jpeg" width="50%">

## 3.5インチ(感圧)版

LCDドライバはST7796で、Moddableではサポートされていません。
以前の経験でST7735やST7789の液晶ドライバ(ライブラリ)はILI9341のサブセットとして動作させていることを把握していました。

https://qiita.com/kitazaki/items/0b774e6779defd550c6a

初期化コマンドをST7796用に変更すれば対応できるだろうと見当をつけました。
タッチパネルはXPT2046で、Moddableでサポートしていることを確認しました。
3.5インチ(感圧)版ではSPIが共有されていますので、LCDとタッチパネルの両方を使用できるだろうと見当をつけました。
(VSPIを使用するとリセット動作をするのは2.8インチ版と同様だったため、HSPIを使用しました。)

ST7796

|GPIO|PIN|
|--|--|
|14|TFT_SCK|
|12|TFT_SDO|
|13|TFT_SDI|
|15|TFT_CS|
|2|TFT_RS|
|21|TFT_BACKLIGHT|

XPT2046

|GPIO|PIN|
|--|--|
|14|TP_CLK|
|13|TP_DIN|
|12|TP_OUT|
|33|TP_CS|
|36|TP_IRQ|

USB以外に4つの外部端子がありますが、2.8インチ版と同様で、いずれも使いづらいです。


### デバイスサポート

LCDはModdable標準のドライバがありませんので、ILI9341ドライバを使用し、LCDの初期化コマンドの定義を調査しました。
TFT_eSPIの初期化コマンドを利用し正常に動作しました。

https://github.com/Bodmer/TFT_eSPI/blob/master/TFT_Drivers/ST7796_Init.h

タッチパネルはModdable標準のXPT2046ドライバを使用できました。
外部端子はI2Cには使用できないため、デバイス定義を省略しました。

```bash
├── host
│   └── provider.js
└── manifest.json
```

```javascript:host/provider.js
import Analog from "embedded:io/analog";
import Digital from "embedded:io/digital";
import DigitalBank from "embedded:io/digitalbank";
import I2C from "embedded:io/i2c";
// import PulseCount from "embedded:io/pulsecount";
import PWM from "embedded:io/pwm";
import Serial from "embedded:io/serial";
import SMBus from "embedded:io/smbus";
import SPI from "embedded:io/spi";

const device = {
        Serial: {
                default: {
                        io: Serial,
                        port: 1,
                        receive: 3,
                        transmit: 1
                }
        },
        SPI: {
                default: {
                        io: SPI,
                        clock: 14,
                        in: 12,
                        out: 13,
                        port: 1  // HSPI
                        // port: 2  // VSPI
                }
        },
        io: {Digital, DigitalBank, PWM, Serial, SMBus, SPI},
        pin: {
                button: 0,
                backlight: 27,
                displayDC: 2,
                displaySelect: 15
        }
};
```

```javascript:manifest.js
{
        "include": [
                "$(MODDABLE)/modules/drivers/ili9341/manifest.json",
                "$(MODDABLE)/modules/drivers/xpt2046/manifest.json"
        ],
        "build": {
                "UPLOAD_SPEED": "1500000"
        },
        "config": {
                "screen": "ili9341",
                "touch": "xpt2046"
        },
        "defines": {
                "spi": {
                        "miso_pin": 12,
                        "mosi_pin": 13,
                        "sck_pin": 14
                },
                "ili9341": {
                        "hz": 40000000,
                        "width": 320,
                        "height": 480,
                        "cs_pin": 15,
                        "dc_pin": 2,
                        "column_offset": 0,
                        "row_offset": 0,
                        "spi_port": "HSPI_HOST",
                        "backlight_pin": 27,
                        "backlight_on": 1,
                        "registers": [
                                "kDelayMS, 120,",
                                "0x01, 0,",
                                "kDelayMS, 120,",
                                "0x11, 0,",
                                "kDelayMS, 120,",
                                "0xF0, 1, 0xC3,",
                                "0xF0, 1, 0x96,",
                                "0x36, 1, 0x48,",
                                "0x3A, 1, 0x55,",
                                "0xB4, 1, 0x01,",
                                "0xB6, 3, 0x80, 0x02, 0x3B,",
                                "0xE8, 8, 0x40, 0x8A, 0x00, 0x00, 0x29, 0x19, 0xA5, 0x33,",
                                "0xC1, 1, 0x06,",
                                "0xC2, 1, 0xA7,",
                                "0xC5, 1, 0x18,",
                                "kDelayMS, 120,",
                                "0xE0, 14, 0xF0, 0x09, 0x0B, 0x06, 0x04, 0x15, 0x2F, 0x54, 0x42, 0x3C, 0x17, 0x14, 0x18, 0x1B,",
                                "0xE1, 14, 0xE0, 0x09, 0x0B, 0x06, 0x04, 0x03, 0x2B, 0x43, 0x42, 0x3B, 0x16, 0x14, 0x17, 0x1B,",
                                "kDelayMS, 120,",
                                "0xF0, 1, 0x3C,",
                                "0xF0, 1, 0x69,",
                                "0x13, 0,",
                                "kDelayMS, 120,",
                                "0x29, 0,",
                                "kDelayMS, 120,",
                                "kDelayMS, 0"
                        ]
                },
                "xpt2046": {
                        "cs_pin": 33,
                        "touch_pin": 36,
                        "spi_port": "HSPI_HOST",
                        "raw_left": 360,
                        "raw_right": 4200,
                        "raw_top": 180,
                        "raw_bottom": 3900
                }
        }
}
```

GitHubにもファイルを置きました。

https://github.com/kitazaki/moddable/tree/public/build/devices/esp32/targets/esp32_3248s035r

$MODDABLE/examples/piu/ballsデモ

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/3232899b-47f6-9a3c-0e82-f84f4fee1e77.jpeg" width="75%">

Node-RED MCUのDashboard表示 (タッチパネルの動作も問題ありませんでした。)

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/60482847-c26f-efea-251a-b4a10d4e9da4.jpeg" width="50%">

## 1.9インチ版

タッチパネルはありませんが、ESP32-S3モジュールが搭載されており、GPIOの端子数が多いため、使い勝手が良さそうです。
LCDはST7789で、Moddable標準のST7789ドライバを使用できそうです。

![名称未設定.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/833069cf-f93f-0800-9d0a-b74aa59f9fb6.jpeg)

2023年3月1日に到着しましたが、液晶が割れていました。

![IMG_4011.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/3d8a73d2-2932-2bbb-2ee4-807e2a38cf47.jpeg)

![IMG_4012.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/19e6c83f-bfc5-f588-fb1d-ca27d822a1b3.jpeg)

ST7789

|GPIO|PIN|
|--|--|
|12|TFT_SCK|
|N/A|TFT_SDO|
|13|TFT_SDI|
|10|TFT_CS|
|11|TFT_RS|
|1|TFT_RST|
|14|TFT_BACKLIGHT|

### デバイスサポート

LCDはTFT_eSPIの初期化コマンドを利用し正常に動作しました。

https://github.com/Bodmer/TFT_eSPI/blob/master/TFT_Drivers/ST7789_Init.h

```bash
├── host
│   └── provider.js
└── manifest.json
```

```javascript:host/provider.js
import Analog from "embedded:io/analog";
import Digital from "embedded:io/digital";
import DigitalBank from "embedded:io/digitalbank";
import I2C from "embedded:io/i2c";
import PulseCount from "embedded:io/pulsecount";
import PulseWidth from "embedded:io/pulsewidth";
import PWM from "embedded:io/pwm";
import Serial from "embedded:io/serial";
import SMBus from "embedded:io/smbus";
import SPI from "embedded:io/spi";

const device = {
        SPI: {
                default: {
                        io: SPI,
                        port: 3,
                        clock: 12,
                        out:13 
                }
        },
        io: {Analog, Digital, DigitalBank, PulseCount, PulseWidth, PWM, Serial, SMBus, SPI},
        pin: {
                button: 41,
        }
};

export default device;
```

```javascript:manifest.js
{
        "build":{
                "ESP32_SUBCLASS": "esp32s3",
                "UPLOAD_SPEED": "1500000"
        },
        "include": [
                "$(MODDABLE)/modules/drivers/ili9341/manifest.json"
        ],
        "config": {
                "screen": "ili9341",
                "touch": ""
        },
        "defines": {
                "spi": {
                        "mosi_pin": 13,
                        "sck_pin": 12
                },
                "ili9341": {
                        "hz": 40000000,
                        "width": 170,
                        "height": 320,
                        "cs_pin": 10,
                        "dc_pin": 11,
                        "column_offset": 35,
                        "row_offset": 0,
                        "spi_port": "SPI3_HOST",
                        "backlight_pin": 14,
                        "backlight_on": 1,
                        "registers": [
                 "0x01, 0,",
                 "kDelayMS, 150,",
                 "0x11, 0,",
                 "kDelayMS, 120,",
                 "0x13, 0,",
                 "0x36, 1, 0x08,",
                 "0xB6, 2, 0x0A, 0x82,",
                 "0xB0, 2, 0x00, 0xE0,",
                 "0x3A, 1, 0x55,",
                 "kDelayMS, 10,",
                 "0xB2, 5, 0x0C, 0x0C, 0x00, 0x33, 0x33,",
                 "0xB7, 1, 0x35,",
                 "0xBB, 1, 0x28,",
                 "0xC0, 1, 0x0C,",
                 "0xC2, 2, 0x01, 0xFF,",
                 "0xC3, 1, 0x10,",
                 "0xC4, 1, 0x20,",
                 "0xC6, 1, 0x0F,",
                 "0xD0, 2, 0xA4, 0xA1,",
                 "0xE0, 14, 0xD0, 0x00, 0x02, 0x07, 0x0A, 0x28, 0x32, 0x44, 0x42, 0x06, 0x0E, 0x12, 0x14, 0x17,",
                 "0xE1, 14, 0xD0, 0x00, 0x02, 0x07, 0x0A, 0x28, 0x31, 0x54, 0x47, 0x0E, 0x1C, 0x17, 0x1B, 0x1E,",
                 "0x21, 0,",
                 "0x2A, 4, 0x00, 0x00, 0x01, 0xEF,",
                 "0x2B, 4, 0x00, 0x00, 0x00, 0x3F,",
                 "kDelayMS, 10,",
                 "0x29, 0,",
                 "kDelayMS, 100,",
                 "kDelayMS, 0"
                 ]
                }
        }
}
```

GitHubにもファイルを置きました。

https://github.com/kitazaki/moddable/tree/public/build/devices/esp32/targets/esp32_1732s019

$MODDABLE/examples/piu/ballsデモ

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/72479/b6cf6c9d-4137-0662-d41a-f1e2315f080d.jpeg" width="75%">

# 次回は..

闇(液晶割れ)を引いてしまったので、次回は無いかもしれません..！