M5stack に変な？漢数字スクロール時計を表示させてみた

こんばんは。

久々の記事アップです。

実は今まで、自作 Arduino – ESP32 ライブラリを見直していて、プログラミング言語 C++ を少しだけ勉強していました。

というのは、自分の作ったライブラリ関数の引数が多くなり過ぎ、何とかできないかといろいろと調べていました。

フォントをただディスプレイに固定表示させるだけならそれほど引数は必要ないのですが、ボタン操作で文字サイズを変えたり、スクロール速度を変えたり、文字色を変えたりする場合、一つの関数に多くの引数が必要になってきたのです。

改めて自分自身で過去のライブラリを見直すと、とても見辛いし使いにくいし、ド素人コードそのもので、ダメダメでした。
（使って下さっている方々には申し訳ないです。
独学なのでご容赦ください。）

さすがに貪欲に新しい方法を学習して吸収できる年齢を遙かに超えてしまっているので、C++ を勉強することはとても辛いものがありました。

でも、挫折しない様に、ライブラリをもうちょっと使いやすくする方法だけに絞って、いろいろとネットで調べてみました。
特に、今回は関数の仮引数を減らして、もっと簡単に構成できないかということに重点的に調べてみました。
仮引数が多くなってくると、プログラムが見にくくなる他に、メインのソースコードでその引数が何の意味を明示することが面倒になってきます。

グローバル変数を増やすという方法がありますが、基本的にそれは害悪以外の何物でもありません。

Arduino – ESP32 スケッチは、loopTask という関数の中のプログラムなので、スケッチ上でグローバル変数を作ったように見えても、真のグローバル変数ではなくて、所詮 loopTask 内のローカル変数です。
だったら、そこで最初に変数宣言すればいいじゃん・・・ってなりますよね。
でも、所詮ローカル変数なので、ライブラリのクラス関数へは渡せません。
何らかの引数として渡さねばなりません。
そんなこんなで、ネットでいろいろと調べていました。

そうしたら、あったではありませんか！

それは、引数だけまとめて一つのクラスにするという方法です。

これ、スゴイ便利なんです！

クラス名とドットに変数名を付ければ、他クラスへ引数の受け渡しができるんです。
例えば、フォントの色を変えたい場合、
font.red = 31;
とか書けばそのクラスの変数にアクセスできます。
そして、それとは別のクラスの引数に font クラスを引数に入れておけば、多数の値を受け渡すことができるんです。
そういえば、これ、Arduino – ESP32 ライブラリや、M5Stack ライブラリにはよく使われていました。

しかも、その変数値の保持寿命は、クラスオブジェクト宣言位置で自由に変えられるんです。
要するにスコープが自由に設定可能なのです。
ここでは詳しく説明できないのですが、いつか、ライブラリのクラス設計については記事にしたいと思っています。

ということで、今回、この M5Stack の LCD( 液晶ディスプレイ ) ILI9341 ライブラリを一新するにあたって、クラス設計を見直しました。
ファイル分割したり、クラスの継承を使ったり、アクセス制限かけたり、vector配列作ったりいろいろ実験してみました。

一番悩んだのは、ライブラリクラスをファイル分割して、クラス継承した時、なぜか Arduino – ESP32 の SPI クラスのデータ連携がうまくいきませんでした。
これにかなり時間を取られたので、ファイル分割は諦めました。
今回はそれだけが心残りですが、いつか再チャレンジしたいと思っています。

では、早速以下の動画をご覧ください。
新たに再構成したライブラリで五色幕調の和式？漢数字デジタルNTP時計なるものを作ってみました。
因みに、東雲フォントに、前回記事で作成したカスタム自作フォントを埋め込んでいます。

いかがでしょうか。

「どうせなら、年月日やメッセージウィンドウも漢字にせぃ！」

と突っ込まれそうですが、プログラムが大きくなるので今回は見送りました。

数値を漢数字にしたり、平仮名にしたり、カスタム自作フォントに切り替えると、単なる NTP 時計でもとても「変」な新鮮な時計ができて、イイ感じです。。

平仮名については「ひぃ、ふぅ、みぃ」数えの頭文字だけにしてみました。
ゼロの読み方が良く分からなかったので、とりあえず「零」の「れ」としてみました。
このように自分だけわかる頭文字に変えれば、いろいろ「変な時計」ができそうです。

このスクロール方法は以前のこちらの記事でもやりましたが、今回は文字サイズを変えられるようになったことと、背景色を変えられるようにしたことが大きな変化です。
それに、スケッチプログラム上で、フォントのセットアップ用引数を順不同で代入できるようにしたことで、プログラムの自由度が増しました。

それにしても、この M5Stack というものは、ディスプレイやボタン、micro SD カードが付いているおかげで、手軽にグラフィック表示プログラミングが試せて重宝します。
それに、外出先に持っていっても怪しまれないですしね。
また、Arduino IDE 上で、手軽に C++ プログラミング勉強ができることがイイです。
すぐにその結果をディスプレイに反映できて、これだけで他の仕事や電子工作を忘れて時間が経ってしまい、気付いたら寝る時間を超えていました。

ということで、前置きが長くなりましたが、これの作り方を説明します。

因みに、何度も申し上げておりますが、私は独学アマチュアなので、プログラミングは素人コードです。
勘違いや誤り、不具合等があればコメント投稿等でご連絡いただけると助かります。

使うもの

M5Stack

Espressif Systems 社の ESP32 を搭載した、技適取得済み 2.4GHz 帯 Wi-Fi & Bluetooth マイコンモジュールです。
LCD (液晶ディスプレイ) ILI9341 、micro SD カードスロット、簡易バッテリー、Groveコネクタ、USB-TypeC 、ボタンスイッチ等を搭載した、全部入りモジュールです。
拡張用オプションも豊富です。
これをレビューした以下の記事も参照してみてください。

M5Stack ( ESP32 搭載 ) を分解したり電源を入れてみて、いろいろ思ったこと

Wi-Fi 環境

2.4GHz 帯の Wi-Fi ルーター（アクセスポイント）が必要です。
M5Stack の ESP32 が Wi-Fi にアクセスできるように、MACアドレスフィルタリングや、ファイアウォール設定を済ませておいてください。
M5Stack ( ESP32 ) の MAC アドレスの調べ方は以下の記事を参照してください。

ESP-WROOM-32 ( ESP32 ) チップ・メモリ・MACアドレス情報取得方法

その他、パソコン、USBケーブル等

Arduino – ESP32 設定を済ませておく

Arduino IDE は ver 1.8.5 で動作確認しています。
Arduino core for the ESP32 ( 以下 Arduino-ESP32 )は最新版をインストールしておいてください。
インストール方法は以下の記事を参照してください。

Arduino core for the ESP32 のインストール方法

自作ライブラリや東雲フォントのインストール

まず、以下の記事を参照して、M5Stack の LCD ディスプレイに日本語漢字東雲フォントを表示できる状態にしておいてください。
そのうち、micro SD カードを使う方法を参照してください。

M5Stack ( ESP32搭載 )の LCD に日本語漢字フォントを表示したりスクロールしたり

更に加えて、以下のライブラリを新たにインストールしておいてください。

ESP32_LCD_ILI9341_SPI_V2

今回、新たにクラス構成を大幅に変えて、一新しました。
最後に「V2」が付きますので、間違えないようにしてください。

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

このライブラリは今後頻繁に更新する予定です。

ESP32_Button_Switch ライブラリ

現在、beta ver 1.0 です。
ボタンスイッチを動作させるライブラリです。
関数の使い方はこちらの記事を参照してください。

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

ESP32_WebGet ライブラリ

現在、beta ver 1.12 です。
Web からデータを GET するライブラリです。
ここでは、主に NTP サーバーから時刻を取得する関数だけ使います。

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

Arduino IDE 標準 Time ライブラリ

Arduino で公式に紹介している Time ライブラリです。

https://github.com/PaulStoffregen/Time

カスタム自作フォントを東雲フォントに埋め込んでおく

東雲フォントのまま使っても良いのですが、先に紹介した動画のようなカスタム自作フォントを表示させたい場合、以下の記事を参照して、東雲フォントに埋め込んでおいてください。

Excel で自作したカスタムフォントを M5Stack に表示してみる

後で紹介するソースコード上では、改変した東雲フォントのファイル名を
MYshnmk16.bdf
としています。

では、次の項ではスケッチプログラムを紹介します。