ESP32 で 日本語漢字フォント をカラー OLED に表示させ、4行同時スクロール ( SSD1331 使用)

自作ライブラリのダウンロード

Arduino core for ESP32 が大幅アップデートされました。
それに伴い、自作ライブラリもアップデートしましたので、最新版をダウンロードしてください。

Arduino core for the ESP32 用に私が自作したライブラリは GitHub の以下のページにあります。
ZIP ファイルをダウンロードしてインストールしてください。
ZIPファイルからそのまま Arduino IDE にインストールする方法は以下のページを参照してください。

GitHubにある ZIP形式ライブラリ のインストール方法

ESP32_SD_UTF8toSJIS Beta ver 1.21

GitHub の以下のページにあります。

https://github.com/mgo-tec/ESP32_SD_UTF8toSJIS

ESP8266 のライブラリを基に、ESP32 用に改良しました。
これは、UTF-8 文字コードから Shift_JIS へ変換するテーブルファイルが必要です。
それは以下のものです。

Utf8Sjis.tbl

これは後で述べるリンクからダウンロードできます。

Arduino IDE のスケッチ（ソースコード）に入力した日本語漢字は UTF-8 コードの文字列になるので、それを Shift_JIS  文字コードに変換するライブラリです。
String クラスなどの文字列は全て UTF-8 になるので、2バイト～3 バイトで構成された文字コードです。
Shift_JIS コードに変換することで、全て2バイト以下になります。
半角のASCII コードはそのまま出力します。

ESP32_SD_ShinonomeFNT Beta ver 1.21

GitHub の以下のページにあります。

https://github.com/mgo-tec/ESP32_SD_ShinonomeFNT

これもまた、ESP8266 のライブラリを基に改変しました。
UTF-8コードのString 文字列から直接東雲フォントをSDカードから読み込めるようにしました。
よって、上記の ESP32_SD_UTF8toSJIS ライブラリをインクルードしています。

以前の ESP8266 のライブラリよりもフォント読み込みは格段に簡単になったと思います。

ESP32_SSD1331 Beta ver1.3

前々回の記事でアップしたライブラリですが、今回 Beta ver 1.3 にバージョンアップしました。
GitHub の以下のページにあります。

https://github.com/mgo-tec/ESP32_SSD1331

文字フォントを右から左へスクロールする関数をできるだけ簡素化してみました。

必要なフォントおよびテーブルファイル

GitHub の以下のページにあります。

https://github.com/mgo-tec/SDcard_sample_filses

ZIPファイルをダウンロードして、解凍してください。
font フォルダの中の以下の３つのファイルが必要です。

これらを micro SDHC カードのルートに /font というフォルダを作成し、そこにコピーしておいてください。

Utf8Sjis.tbl

UTF-8 から Shift_JIS へ変換するためのテーブルファイルです。
私の自作のバイナリファイルです。
ライセンスは MIT です。
著作権表記してあれば、自由に使うことができます。

shnmk16.bdf

16×16 東雲フォント（全角）

shnm8x16.bdf

8×16 東雲フォント（半角）
上記でも述べましたが、ファイル名の ”r” を削除して、8文字に収めたものです。

文字列表示サンプルスケッチの入力

では、まず、ただ単に文字列を OLED ディスプレイに表示するだけのスケッチを紹介します。
SSD1331 は 96 x 64 pixel なので、全角16×16ドットフォントは横に６文字しか表示できません。
半角 8×16 ならば12文字表示できます。

ブラウザからスケッチをコピーしたら、必ず一旦保存してください。そうしないと正しく表示されませんので要注意！！

【ソースコード】 (※無保証　※PCの場合、ダブルクリックすればコード全体を選択できます)

#include "ESP32_SD_ShinonomeFNT.h"
#include "ESP32_SD_UTF8toSJIS.h"
#include "ESP32_SSD1331.h"

const char* UTF8SJIS_file = "/font/Utf8Sjis.tbl"; //UTF8 Shift_JIS 変換テーブルファイル名を記載しておく
const char* Shino_Zen_Font_file = "/font/shnmk16.bdf"; //全角フォントファイル名を定義
const char* Shino_Half_Font_file = "/font/shnm8x16.bdf"; //半角フォントファイル名を定義

const uint8_t CS_SD = 5; //SD card CS ( Chip Select )

const uint8_t SCLK_OLED =  14; //SCLK
const uint8_t MOSI_OLED =  13; //MOSI (Master Output Slave Input)
const uint8_t MISO_OLED =  12; //これは実際は使っていない。MISO (Master Input Slave Output)
const uint8_t CS_OLED = 15;
const uint8_t DC_OLED =  16; //OLED DC(Data/Command)
const uint8_t RST_OLED =  4; //OLED Reset

ESP32_SSD1331 ssd1331(SCLK_OLED, MISO_OLED, MOSI_OLED, CS_OLED, DC_OLED, RST_OLED);

ESP32_SD_ShinonomeFNT SFR(CS_SD, 24000000);

void setup() {
  Serial.begin(115200);
  ssd1331.SSD1331_Init(); //OLED SSD1331 初期化

  //※この関数を使う場合はStrDirect_ShinoFNT_readALL関数を使う場合限定。
  //３つのファイルを同時に開くため、後でクローズすることが必要。
  SFR.SD_Shinonome_Init3F(UTF8SJIS_file, Shino_Half_Font_file, Shino_Zen_Font_file);

  uint8_t font_buf[12][16];
  uint16_t sj_length;
  String str = "日本語漢字！";
  
  sj_length = SFR.StrDirect_ShinoFNT_readALL(str, font_buf); //String 文字列から一気にフォント変換
  ssd1331.SSD1331_8x16_Font_DisplayOut(sj_length, 0, 0, 7, 7, 3, font_buf); //OLED SSD1331 へ出力
  
  str = "ESP-WROOM-32";
  sj_length = SFR.StrDirect_ShinoFNT_readALL(str, font_buf); //String 文字列から一気にフォント変換
  ssd1331.SSD1331_8x16_Font_DisplayOut(sj_length, 0, 16, 7, 0, 0, font_buf); //OLED SSD1331 へ出力

  str = "半角もイケる";
  sj_length = SFR.StrDirect_ShinoFNT_readALL(str, font_buf); //String 文字列から一気にフォント変換
  ssd1331.SSD1331_8x16_Font_DisplayOut(sj_length, 0, 32, 0, 7, 0, font_buf); //OLED SSD1331 へ出力

  str = "ｱｶｻﾀﾅﾊﾏﾔﾗﾜﾝ";
  sj_length = SFR.StrDirect_ShinoFNT_readALL(str, font_buf); //String 文字列から一気にフォント変換
  ssd1331.SSD1331_8x16_Font_DisplayOut(sj_length, 0, 48, 0, 0, 3, font_buf); //OLED SSD1331 へ出力

  SFR.SD_Shinonome_Close3F(); //StrDirect_ShinoFNT_readALL関数を使う場合、必ず閉じておく
}

void loop() {

}

ただ単にディスプレイに東雲フォントを表示するだけならば、ESP8266 でやっていた時よりも格段に簡単にしました。

【解説】

●1-3行目：
自作ライブラリのインクルードです。
ESP32_SD_ShinonomeFNT.h 内で ESP32_SDUTF8toSJIS.h をインクルードしていますが、このライブラリが必要ということで、あえてここでもインクルードしています。
２重インクルードしないように設定していますので、ご安心を。

●5-7行目：
テーブルファイルやフォントファイルをここで定義します。

●9-16行目：
ESP32-DevKitC の GPIO ピン設定です。
OLED SSD1331 は HSPI ピンアサインです。

●18行目：
自作ライブラリ ESP32_SSD1331 のクラス宣言です。
このライブラリの使い方は以前の記事を参照してください。

●20行目：
自作の ESP32 用 東雲フォントライブラリのクラス宣言です。
micro SDHC カードのCS ( Chip Select )ピンと SPI クロック周波数を設定できます。
ここでは、SPIモードの理論上最大値と思われる24MHz としています。

●24行：
SSD1331 の初期化です。
初期化の内容は過去の記事を参照してください。

●28行目：
この関数は、ESP32_SD_ShinonomeFNTライブラリの初期化なのですが、３つのファイルを同時に開いているので注意です。
Arduino core for the ESP32 では、2017/5/31 時点で同時に４つまでしかファイルを開けません。
（以下記事参照）
ESP32 ( ESP-WROOM-32 ) で micro SDHC メモリカードを使う場合の注意点

この３つ同時に開く必要があるライブラリ関数は、
StrDirect_ShinoFNT_readALL
だけです。
この関数を使い終わった後には、49行目にあるように３つのファイルをクローズしておかないと、新しいファイルを開く時に開けないことがありますので要注意です。

●34行目：
この関数が今回初登場した関数で、String 文字列をいちいち Shift_JIS コード変換しなくても、そのまま東雲フォントを読み込んで、font_buf に格納できるようになりました。
Shift_JIS コードのバイト数を返します。
そのバイト数が全て半角に換算した文字数です。

●35行目：
8×16ドットフォントを OLED SSD1331 ディスプレイに表示する関数です。

SSD1331_8x16_Font_DisplayOut(半角換算文字数, 始点X0, 始点Y0, 赤, 緑, 青, フォントbuf);

色は256色カラーで、
赤：0-7
緑：0-7
青：0-3
で指定して混ぜます。
半角換算文字数は12を超えないようにしてください。

●49行目：
開いた３つのファイルをまとめてクローズします。
これを忘れないようにしてください。

以上、これをコンパイル実行してみてください。
下図の様に表示されればＯＫです。

ブラウザからスケッチをコピーしたら、必ず一旦保存してください。そうしないと正しく表示されませんので要注意！！

どうでしょうか。
ESP8266 のときよりも格段に表示しやすくなったと思います。