9
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

M5StickCのテキスト表示機能を読み解く(1) ~ フォント一覧

Last updated at Posted at 2021-06-07

M5StickCの(というかベースとなっているTFT_eSPIの)テキスト表示機能は謎が多い。M5StickC非公式日本語リファレンスなど親切な情報サイトもあるのだが、私はソースコードを直接見て確認する方が早いし安心できる。ここに調査結果をメモしておくことにする。(→その2)

setTextFont()で選択できるフォント

setTextFont(番号)で選択できるフォントはこのディレクトリ直下に入っている。
https://github.com/m5stack/M5StickC/tree/master/src/Fonts

どの番号がどのフォントに対応するかがわかるテーブルがここ。
https://github.com/m5stack/M5StickC/blob/24b448915d32fecfbcbe4f09a7a3245e77de155d/src/utility/In_eSPI.h#L618-L663

実際どんなグリフなのかよくわからないので、自分で画像化(M5StickCでSpriteに描画しシリアルで吸い出し)してみた。

Font 1 (glcdfont.c)

HelloWorldでおなじみ、デフォルトの5x7フォント。非ASCII(文字コード128以上)にもグリフが割り当てられており、UTF-8エンコードされたバイト列を渡せば表示することができる。(実はdrawStringは正しくエンコードしなくてもなんとなく動いてしまう; 理由についてはその2を参照)

image.png

Font 2 (Font16.*)

高さ16ピクセル。文字コード0x60がバッククォートではなく度記号(°)になっている。Font16.c#define をいじれば変えられるようだ。

image.png

Font 4 (Font32rle.*)

高さ26ピクセル。文字コード0x60が度記号なだけでなく、0x24が$ではなく£になっている。

image.png

Font 6 (Font64rle.*)

高さ48ピクセルの数字フォント。時計用途っぽくam/pmが含まれている。

font6.png

Font 7 (Font7srle.*)

高さ48ピクセルの7セグLED風の数字フォント。

font7.png

Font 8 (Font72rle.*)

高さ75ピクセルのArial数字フォント。M5StickCには大きすぎて少々使いにくい。

font8.png

setFreeFont()で選択できるフォント

GFXfontへのポインタを setFreeFont(&FreeMono12pt7b) のように渡して使う。以下ライブラリにバンドルされているものを紹介する。

ところで、これらのバンドルフォントは In_eSPI.h で豪快に #include されているのだが、ここ↓に
https://github.com/m5stack/M5StickC/blob/24b448915d32fecfbcbe4f09a7a3245e77de155d/src/utility/In_eSPI.h#L412-L413

// We can include all the free fonts and they will only be built into
// the sketch if they are used

と書いてある。へー、そうなんだ。

Fonts/GFXFFディレクトリにあるもの

GNU FreeFont由来のもの

Adafruit GFX Libraryに付いてくるGNU FreeFont由来のフォントがそのまま同梱されている様子。フォント一覧と名称規則はこちらを参照。
https://learn.adafruit.com/adafruit-gfx-graphics-library/using-fonts

TomThumb

3x5ピクセルの極小フォント。使ったことないけど。
https://robey.lag.net/2010/01/23/tiny-monospace-font.html

Fonts/Customディレクトリにあるもの

こちらのディレクトリには装飾性の高いフォントが幾つか入っている。

Orbitron

setFreeFont(&Orbitron_Light_24)

Orbitron_Light_24.png

setFreeFont(&Orbitron_Light_32)

Orbitron_Light_32.png

Roboto

setFreeFont(&Roboto_Thin_24)

Roboto_Thin_24.png

Satisfy

setFreeFont(&Satisfy_24)

Satisfy_24.png

Yellowtail

setFreeFont(&Yellowtail_32)

Yellowtail.png

以上です(・∀・)

9
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
9
8

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?