Adafruit 16bit color OLED ( SSD1351 )のライブラリを自作し、日本語漢字フォントを表示させてみました

こんばんは。

以前の記事から発展させて、Adafruit OLED Breakout Board – 16-bit Color 1.5″ w/microSD holder を ESPr Developer ( ESP-WROOM-02 ( ESP8266 )) で動かすためのArduino IDE用ライブラリを作ってみました。
Adafruit社標準のライブラリでは日本語漢字フォントを表示させることが難しいため、作ってみた次第です。

とりあえず、こんな感じのスケッチを動かしてみました。
動画をご覧ください。

いかがでしょうか。
スイッチサイエンスさんの ESPr Developer ( ESP-WROOM-02 ) にSPIFFSアップローダーで保存した東雲フォント（フリーフォント）と 文字コード変換テーブルファイルを読み込んで、日本語漢字フォントを表示させてます。
半角、全角混在ＯＫです。標準的なJIS記号もＯＫです。16×16ピクセルです。
さらに倍角の32×32ドット表示もさせてます。
それを8bit毎に色を変え、RGBのコントラストを自動で変化させて、さらにSSD1351のRAMスクロールも実行させてます。

この有機EL ( OLED )は自由にピクセル毎に色設定ができるので、いろいろなことができます。
ピクセルを描くときには必ずR(赤)、G(緑)、B(青)を設定しなければならないので、色変えがとても自由です。
また、OLED SSD1306のようにページという概念のハード的制約が無いので、さらに自由にピクセルを指定できます。
さすが、値段が高いだけあって、優れた有機EL ( OLED )です。

また、別件ですが、UTF8 to Shift_JISライブラリと東雲フォントライブラリもバージョンアップしました。両方ともBeta 1.3 です。
SPIFFSファイルのオープンクローズを一文字ずつ実行するのではなく、一括して文字列を抽出した後、ファイルをクローズするようにしました。
これは、ツイッターでVisyeii さんから教わった方式を使わせていただきました。
また、関数の引数で、Fileハンドルをそのまま使うことができるということは目から鱗でしたので、使わせていただきました。Visyeiiさんに感謝です。m_ _m
これにより、処理速度が少々早くなったので、以下の動画をご覧ください。
一瞬で終わってしまいますが、左が古いバージョンで、右がver1.3です。
表示速度を比較してみてください。

いかがでしょうか？
劇的に速くすることはできませんでしたが、私的にはこれでも結構な進歩です。

また、東雲フォントライブラリでは、JIS第２水準のアドレスが誤っていたので修正しました。

※新しいバージョンのライブラリをインストールする前に、必ず古いライブラリはフォルダごと事前に削除しておいてください。

以上です。

話は戻りまして、では、OLED_SSD1351ライブラリの使い方を説明していきます。

１．準備するもの

以前の記事で紹介しておりますが、念のため紹介しておきます。

●Adafruit OLED Breakout Board – 16-bit Color 1.5″ w/microSD holder

スイッチサイエンスさんウェブショップにあります。
https://www.switch-science.com/catalog/1754/

1.5インチの128×128ピクセルのものですので、1.27インチのものと間違えないようにしてください。
microSDカードスロット付きですので、いろいろな用途に使えそうです。
グラフィックも16bitカラー設定で、とても高機能な有機EL ( OLED )ですので、やはり高価になるのは仕方のないところです。
こちらの組み立て方はこちらの記事をご覧ください。

●ESPr Developer (ESP-WROOM-02(ESP8266)開発ボード)

Amazon.co.jp

ESP-WROOM-02開発ボード

スイッチサイエンス(Switch Science)

ESPr Developer(ピンソケット実装済)

スイッチサイエンス(Switch Science)

当ブログで何度も紹介しておりますが、Arduino IDEで開発ができる優れものWi-Fiボードです。これを使ってしまうと、もうArduino UNOには戻れません。
この使い方の詳細はこちらの記事をご覧ください。

●その他
ブレッドボード、ジャンパーワイヤー、ピンヘッダ等・・・。

２．接続する

接続方法は以前の記事とまったく同じです。

GPIO #15  —- OC ( OLED CS )
GPIO #14  —- CL ( SCLK )
GPIO #13  —- SI ( MOSI )
GPIO #12  —- SO ( MISO )
GPIO #  4  —- DC ( Data/Command )
GPIO #  5  —- R ( Reset )

３．Arduino IDE、ESP8266ボード、SPIFFSファイルシステムアップローダーをインストールしておく

Arduino IDE は1.6.9 が推奨です。
Arduino IDE は1.8.5以上で動作します。
それにボードマネージャーで ESP8266ボードをインストールする必要があります。
そのインストール方法はこちらのページをご覧ください。
Arduino core for the ESP8266 は ver 2.4.1 で動作します。

SPIFFSファイルシステムはESP-WROOM-02にSPIフラッシュが入っており、それにフォントファイルなどを保存しておけるシステムです。そのArduino IDEプラグインがSPIFFSファイルシステムアップローダーです。
そのインストール方法はこちらのページをご覧ください。

４．自作ライブラリをインストール

UTF to Shift_JISライブラリと東雲フォントライブラリのインストール方法はこちらのページをご覧ください。
※古いバージョンのライブラリがある場合は、必ず古いライブラリのインストールしてあるフォルダごと事前に削除しておいてください。その後に新しいバージョンのライブラリをインストールしてください。

OLED_SSD1351ライブラリはAdafruit社の標準ライブラリを、shiitakeoさんが改変されたものを参考にしました。　ある程度Adafruit社のライブラリも参考にしましたので、そのBSDライセンス文も表記しています。
BSD ライセンスは無保証であること、著作者を表示すること、ライセンス文を掲載することを守れば、改変や再配布ＯＫというものです。ですから、これを改変してMITライセンスとしました。
これも同じく無保証、著作者表示を守れば改変、再配布ＯＫです。

では、この自作ライブラリはGitHubのこちらのページにあります。

以下、Windowsの場合で説明します。
ページを開いたら、以下の図のようなところをクリックします。

そうすると小さいウィンドウが出てきますので下図の様にDownlodad ZIPをクリック

すると、下図の様にWindows10ならばダウンロードフォルダにダウンロードされます。

次に、Arduino IDEを開き、下図の様に「ZIP形式のライブラリをインストール」をクリックして、ZIPファイルのままライブラリをインストールする機能を使います。

そうしたら、先ほどダウンロードしたフォルダを選択します。

次に先ほどダウンロードしたZIPファイルを選択して開きます。

すると、ライブラリインストール完了です。
確かめるために下図のようにメニューを開いていって、OLED_SSD1351 とあればインストール完了です。

※ここまでで、一旦 Arduino IDE を閉じて再起動してください！
これをしないとインストールされませんのでご注意ください。

５．サンプルスケッチを開き、SPIFFSアップローダーでフラッシュにファイルを書き込んでおく

Arduino IDE を開き、下図の様にサンプルスケッチのSSD1351_font_display_sampleを開きます。

開いたら、一旦、名前を付けて保存しておきます。

次に、下図の様にこのスケッチのフォルダを開きます。

その中のdataフォルダを開いて下さい。

そこには以下の３つのファイルがあるはずです。

shnmk16.bdf　　（全角東雲フォントファイル）
Shnm8x16r.bdf　　（半角東雲フォントファイル）
Utf8Sjis.tbl　　（ UTF-8 → Shift_JIS 文字コード変換テーブル ）

これを SPIFFS ファイルシステムアップローダーを使って ESP-WROOM-02 ( ESP8266 )のフラッシュへアップロードします。
合計で1Mbを超えてますので、4M ( 3M SPIFFS )モードでアップロードする必要があります。
これは、シリアル USB ポートではアップロードできない場合がありますので、その場合は OTA機能を使って、外部ルーター経由でWi-Fiアップロードする必要があります。
その方法はこちらのページを参照してください。汎用プログラミング言語pythonをインストールする必要があります。いろいろハマリどころがありますので注意してください。

６．サンプルスケッチについて

では、サンプルスケッチ
SSD1351_font_display_sample.ino
を解説します。

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

/*  Adafruit OLED Breakout Board – 16-bit Color 1.5″ w/microSD holder を使用するためのサンプルスケッチ
 *  日本語専用です。
 *  UTF8toSJISライブラリ、ShinonomeFONTreadライブラリを事前にインストールする必要があります。
 *　事前にSPIFFSファイルシステムアップローダーでフォントファイルをフラッシュにアップロードする必要があります。
 *  詳しくは https://wwww.mgo-tec.com
 */
#include <UTF8toSJIS.h>
#include <ShinonomeFONTread.h>
#include <OLED_SSD1351.h>

UTF8toSJIS u8ts;
ShinonomeFONTread SFR;
OLED_SSD1351 ssd1351;

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

char* cc[8] = {"フリー日本語漢字","東雲(ｼﾉﾉﾒ)ﾌｫﾝﾄ★","16x16ﾄﾞｯﾄ です。","全角-半角混在OK!","半角ｶﾀｶﾅもOK！！","16bit カラー★♪","倍角表示"};

uint8_t sj_txt[32]; //Shift_JISコード
uint16_t sj_length; //Shift_JISコードの長さ
uint8_t font_buf[32][16]; //東雲フォントデータ

const uint8_t sclk=14;
const uint8_t  mosi = 13;
const uint8_t  cs = 15;
const uint8_t DCpin =  4;
const uint8_t RSTpin =  5;

uint8_t R_ctr = 255, G_ctr = 170, B_ctr = 85;
uint8_t R_ud = 0, G_ud = 0, B_ud = 0;
uint8_t scl = 0;
uint32_t sclTime = 0;
uint32_t contrastTime = 0;

void setup() {
  Serial.begin(115200);
  ssd1351.SSD1351_Init(sclk, mosi, cs, DCpin, RSTpin); //SSD1351を初期化
  delay(300);
  ssd1351.SSD1351_BlackOut(); //黒画面出力

  uint8_t Red, Green, Blue; //Max Red = 31, Max Green = 63, MaxBlue = 31
  int8_t i,j;
  int8_t ci=0;

  for(j=0; j<7; j++){
    u8ts.UTF8_to_SJIS_str_cnv(UTF8SJIS_file, cc[j], sj_txt, &sj_length); //UTF8コードをShift_JISコードに変換
    SFR.SjisToShinonome16FontRead_ALL(ZenkakuFontFile, HalfFontFile, 0, 0, sj_txt, sj_length, font_buf); //S_JISコードから東雲フォント抽出

    switch(j){
      case 0:
        Red = 31, Green = 0, Blue = 0;
        break;
      case 1:
        Red = 0, Green = 63, Blue = 0;
        break;
      case 2:
        Red = 0, Green = 0, Blue = 31;
        break;
      case 3:
        Red = 31, Green = 63, Blue = 31;
        break;
    }
    if(j < 4){
      //文字列を１列一気に表示させる
      ssd1351.SSD1351_8x16_DisplayOut_1col_LtoR(0, j*16, Red, Green, Blue, sj_length, font_buf);
    }else{
      for(i=0; i<16; i++){
        if(ci<2){
          Red = 31; Green = 0; Blue = 0;
          ci++;
        }else if(ci<4){
          Red = 0; Green = 63; Blue = 0;
          ci++;
        }else if(ci<6){
          Red = 0; Green = 0; Blue = 31;
          ci++;
        }else if(ci<8){
          Red = 31; Green = 63; Blue = 0;
          ci++;
        }else if(ci<10){
          Red = 0; Green = 63; Blue = 31;
          ci++;
        }else if(ci<12){
          Red = 31; Green = 0; Blue = 31;
          ci = 0;
        }
        if(j < 6 ){
          //半角一文字ずつ表示させる
          ssd1351.SSD1351_8x16_DisplayOut(i*8, j*16, Red, Green, Blue, font_buf[i]);
        }else{
          if(i > 7) break;
          //２倍角フォント表示
          ssd1351.SSD1351_8x16_2x2_DisplayOut(i*16, 96, Red, Green, Blue, font_buf[i]);
        }
      }
    }
  }
  delay(2000);
  //RAM_Hscrolleはメインloop外でもRAM側で勝手にスクロールする
  ssd1351.SSD1351_RAM_Hscrolle(0, 128, 0, 1); //(uint8_t StartY, uint8_t EndY, uint8_t Interval, uint8_t direction)
  sclTime = millis();
  contrastTime = millis();
}

void loop() {
  if(millis()-contrastTime > 5){
    switch(R_ctr){
      case 254:
        R_ud = 1;
        break;
      case 1:
        R_ud =0;
        break;
    }
    switch(G_ctr){
      case 254:
        G_ud = 1;
        break;
      case 1:
        G_ud =0;
        break;
    }
    switch(B_ctr){
      case 254:
        B_ud = 1;
        break;
      case 1:
        B_ud =0;
        break;
    }
    if(R_ud == 1){
      R_ctr--;
    }else{
      R_ctr++;
    }
    if(G_ud == 1){
      G_ctr--;
    }else{
      G_ctr++;
    }
    if(B_ud == 1){
      B_ctr--;
    }else{
      B_ctr++;
    }
    ssd1351.SSD1351_RGBcontrast(R_ctr, G_ctr, B_ctr);//OLEDのコントラスト調整関数
    contrastTime = millis();
  }
  
  if(millis()-sclTime > 100){
    if(scl==127) scl=0;
    //RAM_VscrolleはHscrolleと異なり、自動ではスクロールしないので動作プログラムを組む必要がある。
    ssd1351.SSD1351_RAM_Vscrolle(scl++, 1); //(uint8_t StartY, uint8_t OffsetY)
    sclTime = millis();
  }
}

●9行：
このライブラリのインクルードです。

●11-13行：
ライブラリのクラス名定義です。ここでは好きな名前で定義できます。

●15-17行：
SPIFFSファイルシステム中のフォントファイルを指定します。
ここでは必ずスラッシュ “/” をつけてください。

●19行：
ここで、文字列を初期化します。
このOLEDは一行に８文字、２倍角ならば４文字入ります。
全角半角混在ＯＫです。
ただ、JIS１３区の丸囲み文字などの特殊文字は表示できません。そもそも東雲フォントに13区文字はありません。

●25-29行：
ここでESP-WROOM-02 ( ESP8266 )のSPI通信のためのGPIOピンを設定します。

●31-35行：
ここは、RGBのコントラスト自動色変えの変数定義です。

●39行：
自作ライブラリのクラスで、SSD1351の初期化をしています。

●41行：
自作ライブラリのクラスで、黒画面を出力します。

●48行：
Windowsの場合のArduino IDEスケッチの文字コードはUTF-8 ですので、文字列をShift_JISコードへ一括変換します。ここで変換テーブルファイルが必要になります。
このライブラリの詳細はこちらのページを参照してください。

●49行：
Shift_JISコードから8×16ドットずつ東雲フォントファイルを抽出する関数です。
これは、東雲フォントファイルライブラリ beta ver 1.3 から新たに加わった関数です。
文字列を一括してビット列に変換しますので、処理速度は早くなったのですが、メモリーを食います。

●51-64行：
お遊びで、文字列１行毎に色を変えてます。
Red(赤)とBlue(青)の最大値は10進数で31です。
Green(緑)だけはなぜか最大値が63ですので、ちょっと面倒です。

●67行：
ここで、今回の自作ライブラリSSD1351へビット列を１列分だけ一括出力します。文字列の左から右方向へ出力します。
座標は最初のピクセル書き込み位置を指定します。
Y座標(row)位置を j*16 というように、１列表示したら、16ピクセルずつずらしています。

●69-88行：
ここもお遊びで、半角１文字ずつ色変えしてます。
半角ごとだと、全角の場合半分別の色になってしまいますが、今回はお遊びですので、ご容赦ください。

●91行：
これは半角１文字ずつSSD1351へ出力する関数です。
X座標位置(column)を i*8
Y座標位置(row)をj*16
というようにピクセル位置を指定してます。

●95行：
16×16ピクセルの東雲フォントを２倍角で表示させる関数です。このOLEDでは４文字しか出力できませんが、視認性抜群です。
半角１文字分ずつ２倍角で表示しますので、半角１文字について16×32ピクセルの領域が必要です。それにより描画の最初の位置を計算してください。

●102行：
SSD1351のRAM側で自動水平スクロールする関数です。これは一度指定してしまうと解除できません。メインloop関数が止まっても延々とスクロールし続けます。
垂直位置しか指定できませんので、0～128ピクセル分、つまり全画面スクロールします。
インターバルの数値を増やすとスクロールが遅くなります。ゼロでもあまり早くありません。
４番目の引数はスクロール方向を指定します。
direction 0  R—>L
1   L—>R

●109-147行：
ここもお遊びで、一定間隔でRGBのコントラストを変化させてます。

●148行：
SSD1351のRGBのコントラストを指定する関数です。

●152-157行：
縦方向のスクロールはその都度画面をオフセット設定することによって、スクロールしているように見せます。
155行でその縦方向オフセット値を指定してます。
これは、横方向RAM自動スクロールのようにはできません。
プログラムを組んでスクロールさせます。

以上です。
いかがでしょうか？　ちゃんと動作しましたでしょうか。
もし、不明な点がありましたら、コメント等でご連絡ください。

次はWebから取得した文字を表示させてみたいと思います。
ではまた・・・。

Amazon.co.jp 当ブログのおすすめ

スイッチサイエンス ESPr Developer 32 Type-C SSCI-063647

スイッチサイエンス

￥2,420（2024/11/21 16:13時点）

ZEROPLUS ロジックアナライザ LAP-C(16032)

ZEROPLUS

￥19,358（2024/11/20 21:45時点）

Excelでわかるディープラーニング超入門

技術評論社

￥2,068（2024/11/21 12:24時点）