内蔵フォントではないフォントを LovyanGFX で使うには、どうしたらいいでしょうか?
今回は、TrueType フォントから、ビットマップフォトを作って LovyanGFX で使う方法を試してみます。
以下は、ASCIIフォント用の作業です。日本語フォントについては、23日目記事
「LovyanGFXで画面描画(11):内蔵以外の日本語フォントを使用して高速道路っぽい表示を作る」
https://qiita.com/nanbuwks/items/6dff294da9f7a5111440
を参照ください
フォントファイルを用意
1001freefonts から、SEGMENT 16C フォントを使ってみました。
https://www.1001freefonts.com/segment16c.font
ダウンロードして、解凍します。
$ unzip segment16c.zip
$ ls -og
合計 852
-rw-rw-r-- 1 7230 12月 29 2017 Segment16.txt
-rw-rw-r-- 1 202240 12月 29 2017 'Segment16C Bold Italic.ttf'
-rw-rw-r-- 1 188504 12月 29 2017 'Segment16C Bold.ttf'
-rw-rw-r-- 1 200780 12月 29 2017 'Segment16C Italic.ttf'
-rw-rw-r-- 1 191364 12月 29 2017 'Segment16C Regular.ttf'
-rw-rw-r-- 1 69200 12月 26 2017 Segment16C.jpg
fontconvert
Adafruit GFX Library
https://github.com/adafruit/Adafruit-GFX-Library/
の fontcovnert ツールを使ってみます。
先んじて freetype のライブラリをインストールしておきます。
$ sudo apt install libfreetype6-dev
次に Adafruit GFX Library をクローン
$ git clone https://github.com/adafruit/Adafruit-GFX-Library.git
$ cd Adafruit-GFX-Library/fontconvert
$ ls -og
合計 32
-rw-rw-r-- 1 236 12月 27 00:52 Makefile
-rw-rw-r-- 1 4487 12月 27 00:52 bdf2adafruit.py
-rw-rw-r-- 1 10270 12月 27 00:52 fontconvert.c
-rw-rw-r-- 1 3831 12月 27 00:52 fontconvert_win.md
-rwxrwxr-x 1 1221 12月 27 00:52 makefonts.sh
Makefile があるのでこれを使います。
$ make clean
$ make
$ ls -og
合計 48
-rw-rw-r-- 1 236 12月 27 00:52 Makefile
-rw-rw-r-- 1 4487 12月 27 00:52 bdf2adafruit.py
-rwxrwxr-x 1 14472 12月 27 00:53 fontconvert
-rw-rw-r-- 1 10270 12月 27 00:52 fontconvert.c
-rw-rw-r-- 1 3831 12月 27 00:52 fontconvert_win.md
-rwxrwxr-x 1 1221 12月 27 00:52 makefonts.sh
fontconvert ができているので試してみます。
$ ./fontconvert ../../"Segment16C Bold Italic.ttf" 24 > ../../Segment16C_Bold_Italic_24P.h
できた Segment16C_Bold_Italic_24P.h をスケッチと同じフォルダに移します。
スケッチ
Segment16C_Bold_Italic_24P.h の中身は以下のようになっていました。
const uint8_t Segment16C_Bold_Italic24pt7bBitmaps[] PROGMEM = {
0x00, 0x00, 0x03, 0xF8, 0x00, 0x0F, 0xE0, 0x00, 0x5F, 0x00, 0x03, 0x80,
0x00, 0x1E, 0x20, 0x00, 0x71, 0x80, 0x01, 0xCE, 0x00, 0x07, 0x30, 0x00,
0x1D, 0xC0, 0x00, 0xF7, 0x00, 0x03, 0xDC, 0x00, 0x0F, 0xE0, 0x00, 0x3B,
.
.
.
0x2F, 0xB0, 0x00, 0x7F, 0x00, 0x00, 0xF8, 0x00 };
const GFXglyph Segment16C_Bold_Italic24pt7bGlyphs[] PROGMEM = {
{ 0, 1, 1, 26, 0, 0 }, // 0x20 ' '
{ 1, 22, 35, 26, 2, -34 }, // 0x21 '!'
{ 98, 22, 15, 26, 3, -32 }, // 0x22 '"'
.
.
.
{ 6399, 22, 19, 26, 3, -34 } }; // 0x7E '~'
const GFXfont Segment16C_Bold_Italic24pt7b PROGMEM = {
(uint8_t *)Segment16C_Bold_Italic24pt7bBitmaps,
(GFXglyph *)Segment16C_Bold_Italic24pt7bGlyphs,
0x20, 0x7E, 47 };
このうちの2箇所
const GFXfont Segment16C_Bold_Italic24pt7b PROGMEM = {
const GFXfont Segment16C_Bold_Italic24pt7b PROGMEM = {
を
const ::lgfx::GFXfont Segment16C_Bold_Italic24pt7b PROGMEM = {
const ::lgfx::GFXfont Segment16C_Bold_Italic24pt7b PROGMEM = {
と書き換えます。
この `` をスケッチにインクルードすると使えるようになります。
今回作成したスケッチは以下のとおりです。
#define LGFX_USE_V1
#include "arduinolib_for_PC.hpp"
#include <LovyanGFX.hpp>
#include <LGFX_AUTODETECT.hpp>
#include "Segment16C_Bold_Italic_24P.h"
#include <time.h> // for PC
static LGFX display ( 256,256,1 );
static LGFX_Sprite sprite(&display);
extern const lgfx::GFXfont Segment16C_Bold_Italic24pt7b;
char str[]= "12:45 ABC Brown Fox";
void setup() {
display.init();
display.setSwapBytes(true);
sprite.createSprite(256,256);
}
void loop(){
struct tm *newtime;
time_t ltime;
time(<ime);
newtime = localtime(<ime);
sprite.clear();
sprite.fillRect(0,0,256,256,display.color888(0,40,0));
sprite.setTextSize(1);
sprite.setFont(&Segment16C_Bold_Italic24pt7b);
sprite.setTextColor(display.color888(100,255,150));
sprite.setCursor(20,10);
sprite.printf("%02d:%02d:%02d\n",
newtime->tm_hour, newtime->tm_min, newtime->tm_sec);
sprite.print("TheQuickBrownFoxJumpsOverTheLazyDog");
sprite.pushSprite(0,0);
delay(1000);
}
フォントがかっこいいのでデジタル時計にしてみました。
おまけ u8g 形式で試してみた結果
今回は GFX 形式のフォントデータを使いましたが、u8g 形式のフォントだとどうかな?
bdf2u8g を使って試してみましたが、こちらは全然だめでした。
https://github.com/olikraus/u8glib/wiki/bdf2u8g
$ otf2bdf -p 12 -r 72 Segment16C\ Bold\ Italic.ttf -o Segment16C_Bold_Italic.bdf
$ cc bdf2u8g.c -o bdf2u8g
$ ./bdf2u8g Segment16C_Bold_Italic.bdf Segment16C_Bold_Italic Segment16C_Bold_Italic.c
できた Segment16C_Bold_Italic.c の中身
/*
Fontname: -FreeType-Segment16C-Bold-I-Normal--12-120-72-72-P-51-ISO10646-1
Copyright: -FreeType-Segment16C-Bold-I-Normal--12-120-72-72-P-51-ISO10646-1
Capital A Height: 9, '1' Height: 8
Calculated Max Values w= 6 h= 9 x= 5 y= 8 dx= 7 dy= 0 ascent= 9 len= 9
Font Bounding box w= 8 h=12 x=-1 y=-2
Calculated Min Values x=-1 y= 0 dx= 0 dy= 0
Pure Font ascent = 9 descent= 0
X Font ascent = 9 descent= 0
Max Font ascent = 9 descent= 0
*/
#include "u8g.h"
const u8g_fntpgm_uint8_t Segment16C_Bold_Italic[2604] U8G_FONT_SECTION("Segment16C_Bold_Italic") = {
0,8,12,255,254,9,1,187,3,117,32,255,0,9,0,9,
0,0,0,0,7,0,0,5,9,9,7,1,0,24,32,48,
48,0,0,0,0,192,5,4,4,7,1,5,128,136,136,136,
5,8,8,7,1,1,40,40,40,208,40,40,72,240,5,9,
9,7,1,0,248,160,160,160,208,40,40,72,240,5,9,9,
7,1,0,224,160,176,176,208,104,168,200,48,5,9,9,7,
0,0,48,48,48,48,104,144,152,176,224,1,3,3,7,3,
6,128,128,128,1,6,6,7,4,2,128,128,0,0,128,128,
2,7,7,7,1,1,64,64,64,0,64,128,128,4,7,7,
7,1,1,96,112,112,208,96,208,224,4,7,7,7,1,2,
32,32,32,208,32,32,64,2,4,4,7,1,1,192,64,128,
128,4,1,1,7,1,4,208,1,1,1,0,255,1,128,4,
6,6,7,1,2,16,16,0,64,128,128,6,9,9,7,0,
0,124,68,76,76,0,164,196,196,248,2,8,8,7,4,0,
.
.
.
これを書き換えてみましたが・・・
こちらはあまり追求してません。