前回の記事で行えたが、日本語は表示できないのか？
eFontライブラリをM5Stackで実行できるように
修正して提供してくれているものを使うのだ。
efont Font Data for Arduino. Contribute to tanakamasayuki/ef…
- 基礎的な日本語表示プログラム
- 時計の日付、曜日を日本語表示するプログラム
M5Stackに時計を表示する方法については、以下の記事で紹介しています！
すけろく 前回は、Wi-Fiアクセスポイントに 接続することができた。 次は時刻同期かな。 げんろく うむ。 時刻同期は、全ての基本だからな。 実装してみるか。 この記事では、M5[…]
これからはじめる方にお勧めの参考図書はこちら！
基本的な日本語表示プログラムを作る
まずは、efontライブラリになれるところからやっていきましょう。
M5Stackにはディスプレイ装置が実装されていて、英語表記であれば、Arduino IDE用のライブラリ「M5.Lcd」で表示が可能でした。
では「日本語」などのUnicodeで表現される文字はどうすればよいでしょうか。
efont Unicode BDF Font Dataとは？
/efont/ (電子書体オープンラボ)という、電子書体に関する情報交換を行なうための オープンラボがあります。
ここでは、電子書体および関連プログラムの共同開発や配布もされています。
この中の「efont-unicode-bdf」をもとにArduino用のフォントライブラリとして公開されているのが「efont Unicode BDF Font Data」です。
このライブラリで提供されるのは、16ピクセルフォントになります。
表現可能なフォントは？
「efont Unicode BDF Font Data」で対応されているフォントは次の通りです。
| フォント | ライブラリ内の対応ヘッダファイル | 文字数 | フォント容量 |
| すべて | efontEnableAll.h | 21,727 | 738,718 |
| ASCII | efontEnableAscii.h | 191 | 6,494 |
| 日本語 | efontEnableJa.h | 10,835 | 368,390 |
| 日本語（常用＋α） | efontEnableJaMini.h | 4,107 | 139,638 |
| CJK漢字 | efontEnableCJK.h | 19,379 | 658,886 |
| 簡体字中国語 | efontEnableCn.h | 18,077 | 614,618 |
| 繁体字中国語 | efontEnableTw.h | 13,555 | 460,870 |
| 韓国語 | efontEnableKr.h | 8,319 | 282,846 |
16ピクセルフォントなので、1文字あたり32Byteの字形データ(PROGMEM領域)と、UTF16の文字コードテーブルで2Byte使うので、1文字あたり34Byteです。
文字描画関数
フォントを画面表示するには、次のものを使用します。
| 項番 | 関数 | 説明 |
| １ | printEfont(char *str ) | *str 表示文字列を描画します。 |
| ２ | printEfont(char *str, int x, int y ) | *str 表示文字列を指定されたカーソル位置（ｘ、ｙ）に描画します。 |
| ３ | printEfont(char *str, int x, int y, int textsize) | *str 表示文字列を指定されたカーソル位置（ｘ、ｙ）にtextsizeのフォントサイズで描画します。 |
| ４ | printEfont(TFT_eSprite *sprite, char *str) | *spriteで指定されたカーソル位置やテキストサイズ、カラー、背景色などをもとに*str 表示文字列を描画します。 |
| 関数 | 説明 |
| M5.Lcd.setCursor(int x, int y) | 画面の中のカーソルの位置を指定します。 |
| M5.Lcd.setTextSize(int size) | フォントサイズ（倍数）を指定します。 |
また、フォントカラーや背景色を指定する場合は、「M5.Lcd」クラスの以下の各関数で指定します。
| 関数 | 説明 |
| M5.Lcd.setTextColor(Fcolor, Bcolor) | フォントの色(Fcolor)および背景色(Bcolor)を指定します。 |
ライブラリを追加する
今回使うライブラリ「efont Unicode Font Data」をインストールします。(ライブラリ名にはBDFはつきません)
※プログラムを実行した際の「efont Unicode Font Data」のバージョンは「1.0.5」です。
ライブラリのインストールは、次の記事で紹介しています。
本記事は、Arduino IDE 1.8.xバージョンのライブラリ管理方法を紹介した記事です。 Arduino IDEは、より新しいバージョン「2.0.x」が発表されています。 機能がよりリッチになった「Ardu[…]
簡単な日本語表示プログラム
Arduino IDEを起動して、「ファイル」メニューから「新規ファイル」を選択し、表示されるスケッチに以下のように記述します。
Arduino IDE スケッチ例
M5Stackへの書き込み
- 「ファイル」メニューから「名前を付けて保存」で任意の名前を付けて保存します。
- 「ツール」メニューから「ボード」情報を確認し、次のものを選択します。この際、「シリアルポート」にマイコンを接続したCOMポートが指定されているかも確認します。
ボード：「M5Stack Arduino」－「M5Stack-Core-ESP32」または、「M5Stack-Core2」または「M5Stack-Tough」
「Partition Scheme」で「Not OTA（Large App)」を選択します。 - 「ツール」メニューから「シリアルモニタ」を選択してシリアルモニタを起動します。（転送速度は「115200」です)
- 「スケッチ」メニューから「マイコンボードに書き込む」を選択します。
プログラム実行結果
M5Stackのディスプレイ上に次のように日本語が表示されます。
時計の日付、曜日を日本語表示するプログラムを作る
それでは、前回作ったM5Stack時計の日付、曜日を日本語表示化してみましょう。
プログラムを修正する箇所は、efontライブラリの定義部と時刻を表示する関数「Clock_screen_display()」内の表示処理になります。
プログラムの作成
Arduino IDEを起動して、「ファイル」メニューから「新規ファイル」を選択し、表示されるスケッチに以下のように記述します。
Arduino IDE スケッチ例
M5Stackへの書き込み
- 「ファイル」メニューから「名前を付けて保存」で任意の名前を付けて保存します。
- 「ツール」メニューから「ボード」情報を確認し、次のものを選択します。この際、「シリアルポート」にマイコンを接続したCOMポートが指定されているかも確認します。
ボード：「M5Stack Arduino」－「M5Stack-Core-ESP32」または、「M5Stack-Core2」または「M5Stack-Tough」
「Partition Scheme」で「Not OTA（Large App)」を選択します。 - 「ツール」メニューから「シリアルモニタ」を選択してシリアルモニタを起動します。（転送速度は「115200」です)
- 「スケッチ」メニューから「マイコンボードに書き込む」を選択します。
プログラム実行結果
M5Stackのディスプレイ上に次のように時計の日付、曜日が日本語表示されます。
編集後記
いかがだったでしょうか。
さて、これで日本語表示までできました。
今後、他の機能を使ったプログラムの実行例などをご紹介していきます。
ご期待ください。
今回の記事は以上になります。
最後までご覧いただきありがとうございました。
これからはじめる方にお勧めの参考図書はこちら！
 |
  |
  |
  |
  |
| アイデアをカタチにする! M5Stack入門&実践ガイド | M5Stack&M5StickCではじめるIoT入門 | みんなのM5Stack入門 | ESP32&Arduino 電子工作 プログラミング入門 | みんなのArduino入門 |
| 確認する | 確認する | 確認する | 確認する | 確認する |
M5Stack の他の記事はこちらからどうぞ！
すけろく ううーん。 どうしたものか。 げんろく どうした？ 浮かない顔をして。 すけろく ChatGPTをマイコンから使ってみたいのだが、 どうすればよいのかわからなくてな。 げんろく そうか。 ChatGPTもAPIをもっているから、マイコンで文章を作って ChatGPT APIに送信すればよいと思うぞ。 今回はそのあたりを使ってみようか！ 皆さん、「ChatGPT」は活用されていますか？ 私 […]
すけろく 最近メダカの飼育が流行っているらしいの～ げんろく そうだな。日本の水質にも適用能力が高い魚だからな。 我が家でも飼育してみるか。 すけろく そうなると、メダカに快適な環境を整える必要があるな。 げんろく よし。 まずは、メダカが快適に過ごせる水温か確認するぞ！ 皆さん、お家で何か動植物を飼っていますか？ 今回、縁あって、げんろく宅にも「メダカ」さんがやってくることになりました。 メダカ […]
すけろく んーどうしたものか。 げんろく どうした？ 深刻な顔をして。 すけろく M5Stackにプログラムを書き込んだら 起動しなくなってな。 電源ON／OFFでも無理なのだ。 げんろく 書き込んだプログラムか、バッテリーの 過放電か。工場出荷時に戻してみてはどうだ？ この記事では、M5Stackにプログラムを書き込んだ結果、うまく動作しなくなった場合の対処方法を記載します。 ご紹介するのは「工 […]
すけろく んー。 どうしたものか… げんろく どうした？深刻な顔をして。 すけろく 「城の守りを固めるため、敵の接近を検知してみせよ！」 と殿から宿題をもらっての。 げんろく なるほど、それならば人感センサーを使ってみてはどうか？ 敵が勝手に部屋に入ったりするのを検知できるぞ！ この記事では、M5Stackと、「人感センサー（HC-SR501）」を使って、人が近づいた際に検知して反応するプログラム […]
すけろく 前回は、RTC非搭載のM5Stackでの時刻同期を行ったが、 RTC搭載の場合はどうするのかな。 げんろく うむ。 RTCは、M5Stack Core 2 などで搭載されている。 ちょっと、プログラム内容が異なるから、実装してみるか。 この記事では、M5StackをアクセスWi-Fiアクセスポイントに接続し、インターネットの時刻サービス(NTPサーバー）と時刻を同期する方法 […]
すけろく ん～。 げんろく どうした難しい顔をして。 すけろく M5Stackのディスプレイにいろいろ描画しているのだが。 画像がチラチラしてみずらいのだ。 げんろく 描画タイミングとか、メモリを使うとか しておるのか？ すけろく ・・・ げんろく 今回は、そのあたりを見てみようか。 この記事では、Arduino IDEを使ってM5Stackのディスプレイに文字や画像を表示する際のちらつきや、安定 […]
すけろく M5StackでPCファンの回転を制御することはできたが LEDの点灯制御はまだだな。 げんろく そうだったな。 LEDの点灯制御もM5Stackで行うことができるぞ！ 実際に動かしてみよう この記事では、M5StackとLED搭載のパソコン用冷却ファンを使ったLED発光制御の方法について紹介します。 前回は、M5Stackで冷却ファンを使った回転速度制御をおこないましたが、今回 […]
すけろく M5Stackを使って、モーターをコントロールしてみたいな。 げんろく それならば、モーターコントロールを学べるPC冷却ファン制御というものをやってみるか。 すけろく ん？ パソコン用の冷却ファンをコントロールできるのか？ げんろく 仕組みはモーターと同じだからな。 とにかくやってみよう！ この記事では、M5Stackとパソコン用の冷却ファンを使って回転速度制御を行い […]
すけろく 標準ライブラリでの画面描画はできた。 しかし、M5Stack向けのライブラリなので 汎用性がないな。 げんろく たしかに。 M5StickCや他のAruduino機器でも使えるものが必要だな。 すけろく そのようなものがあるのか？ げんろく よし。今回は、汎用的に使えるライブラリを紹介しよう。 lovyan03さんが公開されている「Lovyan_GFX」だ。 この記事では、Arduino […]
すけろく M5Stackも時刻同期や日本語表示までできた。 うまくいっておるな。 げんろく ああ、「M5Stack」でもノウハウがたまってきている。 すけろく そういえば、大きな画面を活かしたものを 作ってみたいと思うのだが。 げんろく わかった。今回はM5Stackのディスプレイにおける 画面制御まわりを見てみるか。 この記事では、Arduino IDEを使ってM5Stackのディスプレイに文字 […]
すけろく M5Stackに英語表記で時計を表示することは 前回の記事で行えたが、日本語は表示できないのか？ げんろく いや、方法はあるぞ。 eFontライブラリをM5Stackで実行できるように 修正して提供してくれているものを使うのだ。 すけろく ぜひ、やってみたいの～ この記事では、Arduino IDEを使ってM5Stackのディスプレイに日本語を表示させるための方法を紹介します。 今回使用 […]
すけろく 前回は、Wi-Fiアクセスポイントに 接続することができた。 次は時刻同期かな。 げんろく うむ。 時刻同期は、全ての基本だからな。 実装してみるか。 この記事では、M5StackをアクセスWi-Fiアクセスポイントに接続し、インターネットの時刻サービス(NTPサーバー）と時刻を同期する方法について紹介します。 M5Stackは、内蔵タイマであるRTCが搭載されているモデル（例：M5St […]
すけろく M5Stackは、Wi-Fi機能がついているのか。 げんろく ESP32のおかげだな、2.4GhzのWi-Fi接続に 対応している。 すけろく では、早速Wi-Fi接続してみよう。 げんろく せっかくなので、microSDから読みだした Wi-Fi アクセスポイント情報を使って 接続してみよう！ この記事では、M5Stackに実装されているWi-Fi機能を使って、Wi-Fiルータに接続す […]
すけろく M5StackとほかのWebサービスなどとの データのやり取りにJSON形式を使いたいのだが。 げんろく うむ。 M5StackでもJSON形式が使えるか試してみるか。 この記事では、Arduino IDEを使ってM5StackのプログラムでJSON形式を取り扱う方法を紹介します。 JSON形式データは、Webサービスやほかのコンピュータとのやり取りにも使用される汎用形式なので、取り扱う […]
すけろく M5Stackは、各モデル共通でmicroSDカードの スロットが搭載されているな！ げんろく そうだな。microSDカードへの読み書きが できるのでログの記録や、データ読み出しからの 画面表示ができる。 すけろく ファイルの中身を画面に表示することができるのか！ それはいいな！ げんろく では、手始めにmicroSDカードに入っている テキストファイルの中身を表示してみよう。 この記 […]
すけろく M5StackをArduino IDEで使ってみたいのだが。 げんろく ライブラリも揃っているしな。 開発する前に、M5Stack用の設定をArduino IDEに 施す必要がある。 すけろく M5Stack開発ボードの登録とライブラリの インストールだな。 げんろく わかってきたではないか。 新しい機器をArduino IDEで使う場合の初期設定だな。 この記事では、Arduino I […]
すけろく 今回はM5Stackを取り上げたいと思うがどうだ？ げんろく なんだ、急にやる気を出して。 どういった風の吹き回しだ？ すけろく M5Stickとは異なり、いろいろな種類のモデルがあって 良さそうだからな。 げんろく 開発用モデルから、実用を意識したモデルまで 様々だからな。 面白い、やってみるか！ 今回の記事では、「M5Stack」を各モデルを比較して、用途に応じた使い方をまとめていま […]