LoginSignup
3
0

More than 1 year has passed since last update.

LovyanGFXで画面描画(9):日本語フォントのうち必要なシェイプのみをデータ化

Last updated at Posted at 2022-12-22

LovyanGFXで画面描画(6)~(8) にて、内蔵フォントの紹介をしました。しかしながら IPAフォント/efont を使うと特に大きなフォントシェイプで表示したい場合、数千も自分の文字シェイプデータがプログラムに組み込まれてしまいます。
Flash 領域に制限のあるマイコンではなるべく削減したいところです。

そのような問題の解決について、https://github.com/lovyan03/LovyanGFX/blob/master/examples/HowToUse/3_fonts/3_fonts.ino
には

// ※ やまねこ氏の 日本語フォントサブセットジェネレーター
// を使用することで、必要な文字だけを含む小サイズのフォントデータを作成できます。

とあります。

内蔵フォントのうち、IPAフォントとefont については、このツールを使うことで表示に必要な文字だけのフォントシェイプをデータ化してプログラムに組み込むことができます。

日本語フォントサブセットジェネレータを使ってみる

経由で

にアクセスします。
image.png

以下のように入力して「生成」してみました。
image.png

「ダウンロード」すると myFont.cpp がダウンロードされました。

内容は以下のようになってました。

// このファイルは「日本語フォントサブセットジェネレーター for LovyanGFX」によって生成されました。
// https://github.com/yamamaya/lgfxFontSubsetGenerator
// フォントデータは、文字情報技術促進協議会によるIPAフォントから派生した、LovyanGFX内の日本語フォントに基づいています。
// LovyanGFX
// https://github.com/lovyan03/LovyanGFX
// IPAフォントのライセンスについては以下を参照してください。
// https://moji.or.jp/ipafont/license/
// このソースをスケッチに追加した後、フォントを利用するソースには、以下の定義を追加してください。
// extern const lgfx::U8g2font myFont;
// フォントを使用するときは、以下のようにsetFont関数で指定してください。
// lcd.setFont(&myFont);

#include <LovyanGFX.hpp>

const uint8_t myFont_data[533] = {
    0x4B, 0x00, 0x03, 0x02, 0x05, 0x05, 0x06, 0x06, 0x06, 0x14, 0x18, 0x00, 0xFB, 0x0F, 0xFC, 0x0F,
    0xFC, 0x00, 0x00, 0x00, 0x00, 0x00, 0x01, 0x00, 0x00, 0x04, 0xFF, 0xFF, 0x30, 0x57, 0x21, 0x0C,
    0x96, 0x1F, 0x0D, 0x1D, 0xD3, 0x31, 0x1D, 0xD3, 0x31, 0x1D, 0xD3, 0x31, 0x1D, 0xD3, 0x31, 0x1D,
    0xD3, 0x31, 0x1D, 0xDA, 0x91, 0x21, 0x07, 0xA4, 0x58, 0x13, 0xD5, 0x41, 0x05, 0x30, 0x5F, 0x28,
    0x10, 0x8A, 0x20, 0x5D, 0x9D, 0xA0, 0x13, 0x72, 0x4A, 0xA2, 0x03, 0x0F, 0x39, 0xA6, 0x13, 0x72,
    0x4A, 0x36, 0x0C, 0xA1, 0x96, 0x63, 0x39, 0x41, 0x27, 0xE8, 0x84, 0x30, 0x87, 0xC4, 0x1C, 0x8A,
    0x73, 0x40, 0x07, 0x0E, 0x01, 0x30, 0x6E, 0x27, 0xD0, 0x89, 0x20, 0xDD, 0x61, 0xC8, 0x81, 0x29,
    0x1A, 0x35, 0x51, 0x12, 0xD5, 0x28, 0x55, 0x87, 0x34, 0x1E, 0xD2, 0x78, 0x95, 0xD7, 0x1C, 0x18,
    0x32, 0x1D, 0x18, 0xB2, 0x1C, 0x90, 0x14, 0x59, 0x3C, 0xE4, 0xE0, 0x0A, 0x30, 0x7E, 0x26, 0x0E,
    0x8E, 0x20, 0x7D, 0x20, 0x87, 0x73, 0xB8, 0x3A, 0x7C, 0xD0, 0xD1, 0x1C, 0xCE, 0x81, 0x70, 0x18,
    0xB2, 0x61, 0x87, 0x73, 0x38, 0x47, 0x86, 0x1D, 0xD0, 0x86, 0xB4, 0xB2, 0x89, 0xD9, 0x34, 0xA8,
    0x09, 0x00, 0x30, 0x92, 0x2A, 0x2E, 0x8E, 0x1F, 0x5D, 0x1D, 0xCD, 0xE1, 0x48, 0x1C, 0x0E, 0x39,
    0x92, 0xA3, 0x3A, 0xA8, 0xEC, 0xC8, 0xA4, 0x29, 0xEA, 0x20, 0xA5, 0xA3, 0x36, 0xE4, 0x90, 0x94,
    0x23, 0x5A, 0x8E, 0xE8, 0x68, 0x0E, 0xEB, 0x40, 0x3C, 0x0C, 0x0A, 0x00, 0x51, 0xFA, 0x28, 0x30,
    0x8A, 0x1F, 0x7D, 0x40, 0x27, 0xE8, 0x88, 0x68, 0x12, 0x4D, 0xA2, 0x49, 0x34, 0x89, 0xA6, 0xE1,
    0x41, 0x12, 0xED, 0x88, 0x0E, 0xA8, 0xEA, 0x90, 0xAA, 0x43, 0xAA, 0x0E, 0xA9, 0x3A, 0xA4, 0xEA,
    0xF0, 0x83, 0x8E, 0x0A, 0x58, 0xCA, 0x3C, 0x52, 0x86, 0x1F, 0x7D, 0x30, 0x47, 0x74, 0x20, 0x47,
    0xA4, 0xE1, 0x49, 0x07, 0x72, 0x44, 0x07, 0xE2, 0x61, 0x19, 0x0E, 0x99, 0x16, 0x25, 0x36, 0x2D,
    0x4A, 0x6C, 0xDA, 0x70, 0xC8, 0x74, 0x20, 0x47, 0x94, 0xE1, 0x21, 0x52, 0x95, 0x2C, 0x1B, 0x22,
    0x8B, 0x32, 0x44, 0x43, 0x36, 0x49, 0x53, 0xA6, 0xA3, 0x89, 0xB2, 0x03, 0x47, 0x39, 0x07, 0x01,
    0x5B, 0x50, 0x26, 0x12, 0x86, 0x1F, 0xAD, 0xE1, 0x41, 0x27, 0xEC, 0x04, 0x9D, 0xB0, 0x13, 0x74,
    0x92, 0x4E, 0xD2, 0x91, 0xE1, 0x77, 0x44, 0x27, 0xE9, 0x24, 0x9D, 0xA4, 0x93, 0x74, 0x92, 0x0E,
    0x47, 0x3A, 0x3C, 0xE8, 0x08, 0x00, 0x5D, 0x29, 0x3A, 0x51, 0x86, 0x1E, 0xAD, 0x54, 0xCD, 0x52,
    0x35, 0x4B, 0xD5, 0x6C, 0x78, 0xD0, 0xC9, 0xC3, 0x34, 0x0C, 0x51, 0x18, 0xA5, 0x51, 0x18, 0xA5,
    0x51, 0x18, 0xA5, 0xD1, 0x30, 0x0D, 0x43, 0x14, 0x46, 0x69, 0x14, 0x46, 0x69, 0x34, 0x4C, 0xC3,
    0x90, 0x88, 0x51, 0x9A, 0x88, 0x51, 0x9A, 0xA4, 0x51, 0x3A, 0x55, 0xA4, 0x21, 0xDD, 0x21, 0x00,
    0x69, 0x1C, 0x36, 0x32, 0x86, 0x1F, 0xBD, 0x78, 0x47, 0xE2, 0x24, 0x47, 0x52, 0x29, 0x07, 0x42,
    0xD3, 0xB0, 0x0C, 0x87, 0x4C, 0xD2, 0x42, 0x49, 0x0A, 0x73, 0x64, 0x1A, 0x6E, 0x83, 0x92, 0xB5,
    0xB4, 0x95, 0x94, 0x6C, 0x38, 0xD5, 0x32, 0xA9, 0x79, 0xC8, 0x81, 0x38, 0xCA, 0x81, 0x54, 0x53,
    0xB3, 0x75, 0x8B, 0x74, 0x24, 0x01, 0x96, 0x7D, 0x3D, 0x51, 0x8A, 0x1E, 0x8D, 0x41, 0x1A, 0x06,
    0x29, 0x92, 0xE2, 0xA8, 0x16, 0x47, 0xB5, 0x61, 0x90, 0x12, 0x2D, 0x8E, 0x92, 0x70, 0x18, 0xA4,
    0x44, 0x87, 0xA3, 0x1C, 0x8E, 0x86, 0x4F, 0x5A, 0x8E, 0x64, 0xD1, 0x70, 0x89, 0x14, 0x97, 0x64,
    0x48, 0xA4, 0x96, 0x4C, 0x52, 0xA4, 0x24, 0x96, 0xB2, 0x24, 0x95, 0xB4, 0x24, 0x8D, 0x34, 0x25,
    0x07, 0x27, 0x00, 0x00, 0x00
};
extern const lgfx::U8g2font myFont = { myFont_data };

// 収録されている文字の一覧
// U+3057 "し", U+305F "た", U+306E "の", U+307E "ま", U+3092 "を", U+51FA "出", U+58CA "壊", U+5B50 "子"
// U+5D29 "崩", U+691C "検", U+967D "陽"

myFont.cpp を利用する

先程の myFont.cpp を、スケッチと同じ場所に置き、以下のように #define を追加しておきます。

// フォントを使用するときは、以下のようにsetFont関数で指定してください。
// lcd.setFont(&myFont);
#define LGFX_USE_V1
#include <LovyanGFX.hpp>

そのうえで、以下のようなスケッチを作成しました。

#define LGFX_USE_V1
#include "arduinolib_for_PC.hpp"
#include <LovyanGFX.hpp>
#include <LGFX_AUTODETECT.hpp>


static LGFX display ( 256,128,2 );
static LGFX_Sprite sprite(&display);
extern const lgfx::U8g2font myFont;
const uint8_t myFont40_data[1]={0};
char str[]=  "陽子の崩壊を検出しました";

void setup() {
  display.init();
  display.setSwapBytes(true); 
  sprite.createSprite(256,30);
}

void loop(){
  int strwidth = display.textWidth(str);
  sprite.clear();
  sprite.fillRect(0,0,256,30,TFT_RED);
  sprite.setTextDatum( textdatum_t::middle_center   );
  sprite.setTextSize(1);
  sprite.setFont(&myFont);
  sprite.setTextColor(TFT_YELLOW);
  sprite.setCursor((sprite.width()-strwidth)/2,(sprite.height()-20)/2);
  // sprite.setCursor(strwidth/2,sprite.height()/2);
  // sprite.printf(str);
  sprite.drawString(str,  sprite.width() / 2,  sprite.height() / 2);
  sprite.pushSprite(0,49);
  delay(5000);
}



コンパイルオプションに myFont.cpp も一緒に指定してビルドします。
VSCode を使っている場合は tasks.json に追記すればいいかな?

image.png

3
0
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
3
0