LVGLで日本語フォントを使う方法3つ - フォントサイズと見本、容量削減方法など
1.はじめに
公式ドキュメントの Fonts によれば、LVGL に新たにフォント組み込む方法として
- ① Font Converter で予め特定サイズのビットマップフォントを作成しておく方法
- ② FreeType でリアルタイムにビットマップフォントを作成する方法
の2つが解説されています。どちらも TTF または WOFF が利用可能ですが、今回は ① の方法と Google Font で、日本語フォントを利用する方法を掘り下げてみました。
想定は Arduino 環境の ESP32 で、実際の動作確認は ESP32-2432S028R(いわゆる CYD)と以下で行いました。
コンポーネント | バージョン |
---|---|
Arduino IDE | 2.3.4 (CLI 1.1.1) |
ESP32 by Espressf | 3.2.0 (ESP-IDF v5.4.1) |
LittleFS | 同上 |
arduino-littlefs-upload | 1.5.4 |
LVGL | 9.2.2 |
LovyanGFX | 1.2.7 |
2.フォント見本
まずは Google Font から適当に3つのフォントを選び、2.8 インチ LCD に表示させた結果のスクリーンショットを提示します。
ここでの主眼は、高性能な PC での表示と RGB565 ディスプレイの見え方の違いを示すことで、各フォントファミリーに対して3段あるサンプルテキストの上から順に、12ピクセル、14ピクセル、16ピクセルの文字を表示させています。
元のフォントが細過ぎず太過ぎず、かつ表示するフォントの1画素当たりの階調数(bpp)が2ビット以上、できれば bpp = 4 が見た目に望ましいことを感じてもらえればと思います。
ただし bpp が増えれば、当然データサイズも倍々で増えるので、特に複数のフォントサイズが欲しい場合、ESP32 の Flash に収まる容量に制限する必要があります。
- Noto Sans Japanese
TrueType:自らに勝つ事こそ、最も難しい勝利。



- Hachi Maru Pop
TrueType:自らに勝つ事こそ、最も難しい勝利。



- Mochiy Pop One
TrueType:自らに勝つ事こそ、最も難しい勝利。



3.LVGL Font Converter の使い方
続いて TTF または WOFF からフォントのビットマップデータを作成する Font Converter の使い方を紹介します。
3.1 設定

Font Converter はとても便利で優れたツールですが、全部で 11 ある設定項目の使い方次第で作成されるデータサイズが大きく左右されます。
そこで、データサイズを抑えつつ見た目も損なわないフォントデータの作成方法をご紹介したいと思います。
Name
ソースファイル中で参照する lv_font_t
型の変数名を設定します。当然、変数名に使用可能な文字しか使えません。また「LVGLで外部のフォントを読み込ませ表示させる。(日本語表示有り)」で解説されている通り、ここでの指定がすべて大文字化された #define
文が設定されるので、小文字で設定するのが吉です。
Size
作成するフォントのピクセルサイズ(高さ)を指定します。
Bpp
1画素あたりの階調数(Bit Per Pixel)を指定します。8-bit-per-pixel
まで指定可能ですが、RGB565 では無駄になるだけなので、4-bit-per-pixel
以下に設定しましょう。
Fallback
データに無い文字が指定された場合に表示される「□(四角)」の替わりに使う、代替フォントを変数名で指定します。例えば、半角英数字を含まないフォントを作成し、LVGL のデフォルトフォント(変数名 lv_font_montserrat_14
)を指定することで、データサイズを削減できる場合があります。
Output format
作成するフォントデータの形式を、C ソースファイル、またはバイナリデータから選択します。それぞれの使い方は「4.作成したフォントの組み込み方法」で解説します。
TTF/WOFF font
元となるフォントの .ttf
または .woff
ファイルを指定します。
Range
作成する文字の ユニコード を、範囲を指定する場合は「-
(半角のマイナス)」で、複数を指定する場合は「,
(半角のカンマ)」で区切って指定します。
Qiita の記事 を参考に、ユニコードの範囲と対応する文字種を整理してみました。
ユニコード範囲 | 文字種 | 例 | |
---|---|---|---|
🙂 | 0x0020-0x007 |
半角空白、半角記号、半角英数字 | 123!"#$%'(){}[]<>? |
😄 | 0x3040-0x30FF |
全角空白、ひらがな、全角カナ | あいうえおアイウエオ |
0x3280-0x33FF |
全角特殊記号 | ㊀㊁㊂①②③㋿㎖㎝㍿ |
|
0x4E00-0x9FF |
CJK 統合漢字 | 中国、日本、韓国で使用される漢字 | |
😄 | 0xFF00-0xFF9F |
全角記号、全角英数字、半角カナ | 123!”#$%’(){}[]<>? |
顔文字は僕の推奨で、「🙂」は LVGL の組み込みフォントで代替可能な文字、「😄」は入れておいた方が良いと思う文字です。

0x3280-0x33FF
の全角特殊記号は、通常でも使わないと思いますし、またどうやって入力するのか不明な文字が多いので、含めなくて良いと思う範囲です。

また 0x4E00-0x9FF
の CJK 統合漢字は、「Unicode と JIS」で解説されている通り、日本語以外の「漢字」を含み、かつ(全区画のコードが埋まってるワケではありませんが…)膨大な文字数になります。
全体のデータサイズを抑えるには、次の Symbol で必要な文字だけを指定するのがオススメです。
Symbols
予め表示するコンテンツが決まっていれば、ここに必要な文字を入力します。そうでない場合も、JIS や 文化庁が定めた文字セットを使うのがオススメです。ちょっと面倒でしたが、それぞれ元資料から対象の文字だけを抽出し、テキスト化したデータセットを作成しました。
第1水準漢字 テキストデータ(2965文字)
亜唖娃阿哀愛挨姶逢葵茜穐悪握渥旭葦芦鯵梓圧斡扱宛姐虻飴絢綾鮎或院陰隠韻吋右宇烏羽
迂雨卯鵜窺丑碓臼渦嘘唄欝蔚鰻姥厩浦瓜閏噂云運押旺横欧殴王翁襖鴬鴎黄岡沖荻億屋憶臆
桶牡乙俺卸恩温穏音下化仮何魁晦械海灰界皆絵芥蟹開階貝凱劾外咳害崖慨概涯碍蓋街該鎧
骸浬馨蛙粥刈苅瓦乾侃冠寒刊勘勧巻喚堪姦完官寛干幹患感慣憾換敢柑桓棺款歓機帰毅気汽
畿祈季稀紀徽規記貴起軌輝飢騎鬼亀偽儀妓宜戯技擬欺犠疑供侠僑兇競共凶協匡卿叫喬境峡
強彊怯恐恭挟教橋況狂狭矯胸脅興蕎郷掘窟沓靴轡窪熊隈粂栗繰桑鍬勲君薫訓群軍郡卦袈祁
係傾刑兄啓圭珪型検権牽犬献研硯絹県肩見謙賢軒遣鍵険顕験鹸元原厳幻弦減源玄現絃舷后
喉坑垢好孔孝宏工巧巷幸広庚康弘恒慌抗拘控攻昂晃更杭校梗構江洪此頃今困坤墾婚恨懇昏
昆根梱混痕紺艮魂些佐叉唆嵯左差査沙瑳砂詐鎖察拶撮擦札殺薩雑皐鯖捌錆鮫皿晒三傘参山
惨撒散桟燦珊産算纂蚕讃賛次滋治爾璽痔磁示而耳自蒔辞汐鹿式識鴫竺軸宍雫七叱執失嫉室
悉湿漆宗就州修愁拾洲秀秋終繍習臭舟蒐衆襲讐蹴輯週酋酬集醜什住充十従戎勝匠升召哨商
唱嘗奨妾娼宵将小少尚庄床廠彰承抄招掌捷昇昌昭晶松梢拭植殖燭織職色触食蝕辱尻伸信侵
唇娠寝審心慎振新晋森榛浸深申疹真澄摺寸世瀬畝是凄制勢姓征性成政整星晴棲栖正清牲生
盛精聖声製西誠繊羨腺舛船薦詮賎践選遷銭銑閃鮮前善漸然全禅繕膳糎噌塑岨措曾曽楚臓蔵
贈造促側則即息捉束測足速俗属賊族続卒袖其揃存孫尊損村遜他多叩但達辰奪脱巽竪辿棚谷
狸鱈樽誰丹単嘆坦担探旦歎淡湛炭短端箪綻耽帖帳庁弔張彫徴懲挑暢朝潮牒町眺聴脹腸蝶調
諜超跳銚長頂鳥勅捗直朕邸鄭釘鼎泥摘擢敵滴的笛適鏑溺哲徹撤轍迭鉄典填天展店添纏甜貼
転顛董蕩藤討謄豆踏逃透鐙陶頭騰闘働動同堂導憧撞洞瞳童胴萄道銅峠鴇匿如尿韮任妊忍認
濡禰祢寧葱猫熱年念捻撚燃粘乃廼之埜嚢悩濃納能脳膿函箱硲箸肇筈櫨幡肌畑畠八鉢溌発醗
髪伐罰抜筏閥鳩噺塙蛤隼伴判半反鼻柊稗匹疋髭彦膝菱肘弼必畢筆逼桧姫媛紐百謬俵彪標氷
漂瓢票表評豹福腹複覆淵弗払沸仏物鮒分吻噴墳憤扮焚奮粉糞紛雰文聞丙併兵塀幣平法泡烹
砲縫胞芳萌蓬蜂褒訪豊邦鋒飽鳳鵬乏亡傍剖坊妨帽忘忙房暴望某漫蔓味未魅巳箕岬密蜜湊蓑
稔脈妙粍民眠務夢無牟矛霧鵡椋婿娘冥名命諭輸唯佑優勇友宥幽悠憂揖有柚湧涌猶猷由祐裕
誘遊邑郵雄融夕予余与痢裏裡里離陸律率立葎掠略劉流溜琉留硫粒隆竜龍侶慮旅虜了亮僚両
凌蓮連錬呂魯櫓炉賂路露労婁廊弄朗楼榔浪漏牢狼篭老聾蝋郎六麓禄肋録粟袷安庵按暗案闇
鞍杏以伊位依偉囲夷委威尉惟意慰易椅為畏異移維緯胃雲荏餌叡営嬰影映曳栄永泳洩瑛盈穎
頴英衛詠鋭液疫益駅悦謁越閲榎厭円伽価佳加可嘉夏嫁家寡科暇果架歌河火珂禍禾稼箇花苛
茄荷華菓蝦課嘩貨垣柿蛎鈎劃嚇各廓拡撹格核殻獲確穫覚角赫較郭閣隔革学岳楽額顎掛笠樫
汗漢澗潅環甘監看竿管簡緩缶翰肝艦莞観諌貫還鑑間閑関陥韓館舘丸含岸祇義蟻誼議掬菊鞠
吉吃喫桔橘詰砧杵黍却客脚虐逆丘久仇休及吸宮弓急救鏡響饗驚仰凝尭暁業局曲極玉桐粁僅
勤均巾錦斤欣欽琴禁禽筋緊芹菌衿襟契形径恵慶慧憩掲携敬景桂渓畦稽系経継繋罫茎荊蛍計
詣警軽頚鶏芸迎鯨言諺限乎個古呼固姑孤己庫弧戸故枯湖狐糊袴股胡菰虎誇跨鈷雇顧鼓五互
浩港溝甲皇硬稿糠紅紘絞綱耕考肯肱腔膏航荒行衡講貢購郊酵鉱砿鋼閤降裟坐座挫債催再最
哉塞妻宰彩才採栽歳済災采犀砕砦祭斎細菜裁載際剤在酸餐斬暫残仕仔伺使刺司史嗣四士始
姉姿子屍市師志思指支孜斯施旨枝止疾質実蔀篠偲柴芝屡蕊縞舎写射捨赦斜煮社紗者謝車遮
蛇邪借勺尺杓灼爵柔汁渋獣縦重銃叔夙宿淑祝縮粛塾熟出術述俊峻春瞬竣舜駿准循旬楯殉淳
樟樵沼消渉湘焼焦照症省硝礁祥称章笑粧紹肖菖蒋蕉衝裳訟証詔詳象賞醤神秦紳臣芯薪親診
身辛進針震人仁刃塵壬尋甚尽腎訊迅陣靭笥諏須酢図厨誓請逝醒青静斉税脆隻席惜戚斥昔析
石積籍績脊責赤跡蹟碩切拙接摂折設狙疏疎礎祖租粗素組蘇訴阻遡鼠僧創双叢倉喪壮奏爽宋
層匝惣想捜掃挿掻太汰詑唾堕妥惰打柁舵楕陀駄騨体堆対耐岱帯待怠態戴替泰滞胎腿苔袋貸
胆蛋誕鍛団壇弾断暖檀段男談値知地弛恥智池痴稚置致蜘遅馳築畜竹筑蓄沈珍賃鎮陳津墜椎
槌追鎚痛通塚栂掴槻佃漬柘辻蔦綴鍔椿潰坪壷嬬紬爪吊点伝殿澱田電兎吐堵塗妬屠徒斗杜渡
登菟賭途都鍍砥砺努度土奴怒倒党冬得徳涜特督禿篤毒独読栃橡凸突椴届鳶苫寅酉瀞噸屯惇
敦沌豚遁頓呑曇鈍農覗蚤巴把播覇杷波派琶破婆罵芭馬俳廃拝排敗杯盃牌背肺輩配倍培媒梅
叛帆搬斑板氾汎版犯班畔繁般藩販範釆煩頒飯挽晩番盤磐蕃蛮匪卑否妃庇廟描病秒苗錨鋲蒜
蛭鰭品彬斌浜瀕貧賓頻敏瓶不付埠夫婦富冨布府怖扶敷弊柄並蔽閉陛米頁僻壁癖碧別瞥蔑箆
偏変片篇編辺返遍便勉娩弁鞭保舗鋪棒冒紡肪膨謀貌貿鉾防吠頬北僕卜墨撲朴牧睦穆釦勃没
殆堀幌奔本翻凡盆明盟迷銘鳴姪牝滅免棉綿緬面麺摸模茂妄孟毛猛盲網耗蒙儲木黙目杢勿餅
誉輿預傭幼妖容庸揚揺擁曜楊様洋溶熔用窯羊耀葉蓉要謡踊遥陽養慾抑欲寮料梁涼猟療瞭稜
糧良諒遼量陵領力緑倫厘林淋燐琳臨輪隣鱗麟瑠塁涙累論倭和話歪賄脇惑枠鷲亙亘鰐詫藁蕨
椀湾碗腕萎衣謂違遺医井亥域育郁磯一壱溢逸稲茨芋鰯允印咽員因姻引飲淫胤蔭園堰奄宴延
怨掩援沿演炎焔煙燕猿縁艶苑薗遠鉛鴛塩於汚甥凹央奥往応迦過霞蚊俄峨我牙画臥芽蛾賀雅
餓駕介会解回塊壊廻快怪悔恢懐戒拐改橿梶鰍潟割喝恰括活渇滑葛褐轄且鰹叶椛樺鞄株兜竃
蒲釜鎌噛鴨栢茅萱巌玩癌眼岩翫贋雁頑顔願企伎危喜器基奇嬉寄岐希幾忌揮机旗既期棋棄朽
求汲泣灸球究窮笈級糾給旧牛去居巨拒拠挙渠虚許距鋸漁禦魚亨享京謹近金吟銀九倶句区狗
玖矩苦躯駆駈駒具愚虞喰空偶寓遇隅串櫛釧屑屈劇戟撃激隙桁傑欠決潔穴結血訣月件倹倦健
兼券剣喧圏堅嫌建憲懸拳捲伍午呉吾娯後御悟梧檎瑚碁語誤護醐乞鯉交佼侯候倖光公功効勾
厚口向項香高鴻剛劫号合壕拷濠豪轟麹克刻告国穀酷鵠黒獄漉腰甑忽惚骨狛込材罪財冴坂阪
堺榊肴咲崎埼碕鷺作削咋搾昨朔柵窄策索錯桜鮭笹匙冊刷死氏獅祉私糸紙紫肢脂至視詞詩試
誌諮資賜雌飼歯事似侍児字寺慈持時酌釈錫若寂弱惹主取守手朱殊狩珠種腫趣酒首儒受呪寿
授樹綬需囚収周準潤盾純巡遵醇順処初所暑曙渚庶緒署書薯藷諸助叙女序徐恕鋤除傷償鉦鍾
鐘障鞘上丈丞乗冗剰城場壌嬢常情擾条杖浄状畳穣蒸譲醸錠嘱埴飾逗吹垂帥推水炊睡粋翠衰
遂酔錐錘随瑞髄崇嵩数枢趨雛据杉椙菅頗雀裾窃節説雪絶舌蝉仙先千占宣専尖川戦扇撰栓栴
泉浅洗染潜煎煽旋穿箭線操早曹巣槍槽漕燥争痩相窓糟総綜聡草荘葬蒼藻装走送遭鎗霜騒像
増憎退逮隊黛鯛代台大第醍題鷹滝瀧卓啄宅托択拓沢濯琢託鐸濁諾茸凧蛸只逐秩窒茶嫡着中
仲宙忠抽昼柱注虫衷註酎鋳駐樗瀦猪苧著貯丁兆凋喋寵釣鶴亭低停偵剃貞呈堤定帝底庭廷弟
悌抵挺提梯汀碇禎程締艇訂諦蹄逓凍刀唐塔塘套宕島嶋悼投搭東桃梼棟盗淘湯涛灯燈当痘祷
等答筒糖統到奈那内乍凪薙謎灘捺鍋楢馴縄畷南楠軟難汝二尼弐迩匂賑肉虹廿日乳入楳煤狽
買売賠陪這蝿秤矧萩伯剥博拍柏泊白箔粕舶薄迫曝漠爆縛莫駁麦彼悲扉批披斐比泌疲皮碑秘
緋罷肥被誹費避非飛樋簸備尾微枇毘琵眉美斧普浮父符腐膚芙譜負賦赴阜附侮撫武舞葡蕪部
封楓風葺蕗伏副復幅服圃捕歩甫補輔穂募墓慕戊暮母簿菩倣俸包呆報奉宝峰峯崩庖抱捧放方
朋摩磨魔麻埋妹昧枚毎哩槙幕膜枕鮪柾鱒桝亦俣又抹末沫迄侭繭麿万慢満尤戻籾貰問悶紋門
匁也冶夜爺耶野弥矢厄役約薬訳躍靖柳薮鑓愉愈油癒沃浴翌翼淀羅螺裸来莱頼雷洛絡落酪乱
卵嵐欄濫藍蘭覧利吏履李梨理璃類令伶例冷励嶺怜玲礼苓鈴隷零霊麗齢暦歴列劣烈裂廉恋憐
漣煉簾練聯
第2水準漢字 テキストデータ(3390文字)
弌丐丕个丱丶丼丿乂乖乘亂亅豫亊舒弍于亞亟亠亢亰亳亶从仍仄仆仂仗僉僊傳僂僖僞僥僭僣
僮價僵儉儁儂儖儕儔儚儡儺儷儼儻儿兀兒兌兔兢竸辧劬劭劼劵勁勍勗勞勣勦飭勠勳勵勸勹匆
匈甸匍匐匏匕匚匣匯匱匳匸區咫哂咤咾咼哘哥哦唏唔哽哮哭哺哢唹啀啣啌售啜啅啖啗唸唳啝
喙喀咯喊圈國圍圓團圖嗇圜圦圷圸坎圻址坏坩埀垈坡坿垉垓垠垳垤垪垰埃埆埔埒奸妁妝佞侫
妣妲姆姨姜妍姙姚娥娟娑娜娉娚婀婬婉娵娶婢婪媚媼媾嫋嫂屐屏孱屬屮乢屶屹岌岑岔妛岫岻
岶岼岷峅岾峇峙峩峽峺峭嶌峪崋崕崗嵜廖廣廝廚廛廢廡廨廩廬廱廳廰廴廸廾弃弉彝彜弋弑弖
弩弭弸彁彈彌彎弯悄悛悖悗悒悧悋惡悸惠惓悴忰悽惆悵惘慍愕愆惶惷愀惴惺愃愡惻惱愍愎戞
戡截戮戰戲戳扁扎扞扣扛扠扨扼抂抉找抒抓抖拔抃抔拗拑抻拏拿拆擔據擒擅擇撻擘擂擱擧舉
擠擡抬擣擯攬擶擴擲擺攀擽攘攜攅攤攣攫攴攵攷曄暸曖曚曠昿曦曩曰曵曷朏朖朞朦朧霸朮朿
朶杁朸朷杆杞杠杙杣杤枉杰棔棧棕椶椒椄棗棣椥棹棠棯椨椪椚椣椡棆楹楷楜楸楫楔楾楮椹楴
椽楙椰檗蘗檻櫃櫂檸檳檬櫞櫑櫟檪櫚櫪櫻欅蘖櫺欒欖鬱欟欸欷盜欹飮歇歃歉歐沺泛泯泙泪洟
衍洶洫洽洸洙洵洳洒洌浣涓浤浚浹浙涎涕濤涅淹渕渊涵淇漾漓滷澆潺潸澁澀潯潛濳潭澂潼潘
澎澑濂潦澳澣澡澤澹濆澪濟濕濬濔濘燹燿爍爐爛爨爭爬爰爲爻爼爿牀牆牋牘牴牾犂犁犇犒犖
犢犧犹犲狃狆狄瓠瓣瓧瓩瓮瓲瓰瓱瓸瓷甄甃甅甌甎甍甕甓甞甦甬甼畄畍畊畉畛畆畚畩畤癲癶
癸發皀皃皈皋皎皖皓皙皚皰皴皸皹皺盂盍盖盒盞盡盥盧盪蘯盻眈眇磧磚磽磴礇礒礑礙礬礫祀
祠祗祟祚祕祓祺祿禊禝禧齋禪禮禳禹禺秉秕秧筺笄筍笋筌筅筵筥筴筧筰筱筬筮箝箘箟箍箜箚
箋箒箏筝箙篋篁篌篏箴篆紂紜紕紊絅絋紮紲紿紵絆絳絖絎絲絨絮絏絣經綉絛綏絽綛綺綮綣綵
緇綽罅罌罍罎罐网罕罔罘罟罠罨罩罧罸羂羆羃羈羇羌羔羞羝羚羣羯羲羹羮羶隋腆脾腓腑胼腱
腮腥腦腴膃膈膊膀膂膠膕膤膣腟膓膩膰膵膾膸膽臀臂膺茵茴茖茲茱荀茹荐荅茯茫茗茘莅莚莪
莟莢莖茣莎莇莊荼莵荳荵莠莉莨菴蕁蘂蕋蕕薀薤薈薑薊薨蕭薔薛藪薇薜蕷蕾薐藉薺藏薹藐藕
藝藥藜藹蘊蘓蝓蝣蝪蠅螢螟螂螯蟋螽蟀蟐雖螫蟄螳蟇蟆螻蟯蟲蟠蠏蠍蟾蟶蟷蠎蟒蠑蠖襦襤襭
襪襯襴襷襾覃覈覊覓覘覡覩覦覬覯覲覺覽覿觀觚觜觝觧觴觸訃訖譟譬譯譴譽讀讌讎讒讓讖讙
讚谺豁谿豈豌豎豐豕豢豬豸豺貂貉貅貊貍貎蹇蹉蹌蹐蹈蹙蹤蹠踪蹣蹕蹶蹲蹼躁躇躅躄躋躊躓
躑躔躙躪躡躬躰軆躱躾遏遐遑遒逎遉逾遖遘遞遨遯遶隨遲邂遽邁邀邊邉邏邨邯邱邵郢郤扈郛
鄂錙錢錚錣錺錵錻鍜鍠鍼鍮鍖鎰鎬鎭鎔鎹鏖鏗鏨鏥鏘鏃鏝鏐鏈鏤鐚鐔鐓鐃陝陟陦陲陬隍隘隕
隗險隧隱隲隰隴隶隸隹雎雋雉雍襍雜霍雕雹霄霆霈霓顱顴顳颪颯颱颶飄飃飆飩飫餃餉餒餔餘
餡餝餞餤餠餬餮餽餾饂饉饅饐饋髻鬆鬘鬚鬟鬢鬣鬥鬧鬨鬩鬪鬮鬯鬲魄魃魏魍魎魑魘魴鮓鮃鮑
鮖鮗鮟鮠鮨鵝鵞鵤鵑鵐鵙鵲鶉鶇鶫鵯鵺鶚鶤鶩鶲鷄鷁鶻鶸鶺鷆鷏鷂鷙鷓鷸鷦鷭鷯鷽堯槇遙瑤
凜熙仞仭仟价伉佚估佛佝佗佇佶侈侏侘佻佩佰侑佯來侖儘俔俟俎俘俛俑俚俐俤兩兪兮冀冂囘
册冉冏冑冓冕冖冤冦冢冩冪冫决冱冲冰况冽凅凉凛几處凩凭卆卅丗卉卍凖卞卩卮夘卻卷厂厖
厠厦厥厮厰厶參簒雙叟曼燮叮叨叭叺吁吽喟啻啾喘喞單啼喃喩喇喨嗚嗅嗟嗄嗜嗤嗔嘔嗷嘖嗾
嗽嘛嗹噎噐營嘴嘶嘲嘸埓堊埖埣堋堙堝塲堡塢塋塰毀塒堽塹墅墹墟墫墺壞墻墸墮壅壓壑壗壙
壘壥媽嫣嫗嫦嫩嫖嫺嫻嬌嬋嬖嬲嫐嬪嬶嬾孃孅孀孑孕孚孛孥孩孰孳孵學斈孺宀崟崛崑崔崢崚
崙崘嵌嵒嵎嵋嵬嵳嵶嶇嶄嶂嶢嶝嶬嶮嶽嶐嶷嶼巉巍巓巒巖巛彑彖彗彙彡彭彳彷徃徂彿徊很徑
徇從徙徘徠徨徭徼忖忻忤忸忱忝悳忿怡恠慇愾愨愧慊愿愼愬愴愽慂慄慳慷慘慙慚慫慴慯慥慱
慟慝慓慵憙憖憇憬憔憚拈拜拌拊拂拇抛拉挌拮拱挧挂挈拯拵捐挾捍搜捏掖掎掀掫捶掣掏掉掟
掵捫收攸畋效敖敕敍敘敞敝敲數斂斃變斛斟斫斷旃旆旁旄旌旒旛旙无旡旱杲昊枩杼杪枌枋枦
枡枅枷柯枴柬枳柩枸柤柞柝柢柮枹柎柆柧檜栞框栩桀桍栲桎楡楞楝榁楪榲榮槐榿槁槓榾槎寨
槊槝榻槃榧樮榑榠榜榕榴槞槨樂樛槿權槹歙歔歛歟歡歸歹歿殀殄殃殍殘殕殞殤殪殫殯殲殱殳
殷殼毆毋毓毟毬毫毳毯淦涸淆淬淞淌淨淒淅淺淙淤淕淪淮渭湮渮渙湲湟渾渣湫渫湶湍渟湃渺
湎渤濱濮濛瀉瀋濺瀑瀁瀏濾瀛瀚潴瀝瀘瀟瀰瀾瀲灑灣炙炒炯烱炬炸炳炮烟烋烝狎狒狢狠狡狹
狷倏猗猊猜猖猝猴猯猩猥猾獎獏默獗獪獨獰獸獵獻獺珈玳珎畧畫畭畸當疆疇畴疊疉疂疔疚疝
疥疣痂疳痃疵疽疸疼疱痍痊痒痙痣痞痾痿眄眩眤眞眥眦眛眷眸睇睚睨睫睛睥睿睾睹瞎瞋瞑瞠
瞞瞰瞶瞹瞿瞼瞽瞻矇矍秬秡秣稈稍稘稙稠稟禀稱稻稾稷穃穗穉穡穢穩龝穰穹穽窈窗窕窘窖窩
竈窰篝篩簑簔篦篥籠簀簇簓篳篷簗簍篶簣簧簪簟簷簫簽籌籃籔籏籀籐籘籟籤籖綫總綢綯緜綸
綟綰緘緝緤緞緻緲緡縅縊縣縡縒縱縟縉縋縢繆繦縻縵縹繃縷羸譱翅翆翊翕翔翡翦翩翳翹飜耆
耄耋耒耘耙耜耡耨耿耻聊聆聒聘聚聟聢聨臉臍臑臙臘臈臚臟臠臧臺臻臾舁舂舅與舊舍舐舖舩
舫舸舳艀艙艘艝艚艟艤萓菫菎菽萃菘萋菁菷萇菠菲萍萢萠莽萸蔆菻葭萪萼蕚蒄葷葫蒭葮蒂葩
葆萬蘋藾藺蘆蘢蘚蘰蘿虍乕虔號虧虱蚓蚣蚩蚪蚋蚌蚶蚯蛄蛆蚰蛉蠣蚫蛔蛞蛩蛬蠕蠢蠡蠱蠶蠹
蠧蠻衄衂衒衙衞衢衫袁衾袞衵衽袵衲袂袗袒袮袙袢袍袤袰袿訐訌訛訝訥訶詁詛詒詆詈詼詭詬
詢誅誂誄誨誡誑誥誦誚誣諄諍諂諚諫諳諧貔豼貘戝貭貪貽貲貳貮貶賈賁賤賣賚賽賺賻贄贅贊
贇贏贍贐齎贓賍贔贖赧軅軈軋軛軣軼軻軫軾輊輅輕輒輙輓輜輟輛輌輦輳輻輹轅轂輾轌轉轆轎
轗轜鄒鄙鄲鄰酊酖酘酣酥酩酳酲醋醉醂醢醫醯醪醵醴醺釀釁釉釋釐釖釟釡釛釼鐇鐐鐶鐫鐵鐡
鐺鑁鑒鑄鑛鑠鑢鑞鑪鈩鑰鑵鑷鑽鑚鑼鑾钁鑿閂閇閊閔閖閘閙霎霑霏霖霙霤霪霰霹霽霾靄靆靈
靂靉靜靠靤靦靨勒靫靱靹鞅靼鞁靺鞆鞋鞏饑饒饌饕馗馘馥馭馮馼駟駛駝駘駑駭駮駱駲駻駸騁
騏騅駢騙騫騷驅驂驀驃鮴鯀鯊鮹鯆鯏鯑鯒鯣鯢鯤鯔鯡鰺鯲鯱鯰鰕鰔鰉鰓鰌鰆鰈鰒鰊鰄鰮鰛鰥
鰤鰡鸚鸛鸞鹵鹹鹽麁麈麋麌麒麕麑麝麥麩麸麪麭靡黌黎黏黐黔黜點黝黠黥黨黯俥倚倨倔倪倥
倅伜俶倡倩倬俾俯們倆偃假會偕偐偈做偖偬偸傀傚傅傴傲凰凵凾刄刋刔刎刧刪刮刳刹剏剄剋
剌剞剔剪剴剩剳剿剽劍劔劒剱劈劑辨呀听吭吼吮吶吩吝呎咏呵咎呟呱呷呰咒呻咀呶咄咐咆哇
咢咸咥咬哄哈咨噫噤嘯噬噪嚆嚀嚊嚠嚔嚏嚥嚮嚶嚴囂嚼囁囃囀囈囎囑囓囗囮囹圀囿圄圉壜壤
壟壯壺壹壻壼壽夂夊夐夛梦夥夬夭夲夸夾竒奕奐奎奚奘奢奠奧奬奩它宦宸寃寇寉寔寐寤實寢
寞寥寫寰寶寳尅將專對尓尠尢尨尸尹屁屆屎屓巫已巵帋帚帙帑帛帶帷幄幃幀幎幗幔幟幢幤幇
幵并幺麼广庠廁廂廈廐廏怙怐怩怎怱怛怕怫怦怏怺恚恁恪恷恟恊恆恍恣恃恤恂恬恫恙悁悍惧
悃悚憊憑憫憮懌懊應懷懈懃懆憺懋罹懍懦懣懶懺懴懿懽懼懾戀戈戉戍戌戔戛捩掾揩揀揆揣揉
插揶揄搖搴搆搓搦搶攝搗搨搏摧摯摶摎攪撕撓撥撩撈撼昃旻杳昵昶昴昜晏晄晉晁晞晝晤晧晨
晟晢晰暃暈暎暉暄暘暝曁暹曉暾暼梳栫桙档桷桿梟梏梭梔條梛梃檮梹桴梵梠梺椏梍桾椁棊椈
棘椢椦棡椌棍槲槧樅榱樞槭樔槫樊樒櫁樣樓橄樌橲樶橸橇橢橙橦橈樸樢檐檍檠檄檢檣麾氈氓
气氛氤氣汞汕汢汪沂沍沚沁沛汾汨汳沒沐泄泱泓沽泗泅泝沮沱沾滿渝游溂溪溘滉溷滓溽溯滄
溲滔滕溏溥滂溟潁漑灌滬滸滾漿滲漱滯漲滌烙焉烽焜焙煥煕熈煦煢煌煖煬熏燻熄熕熨熬燗熹
熾燒燉燔燎燠燬燧燵燼玻珀珥珮珞璢琅瑯琥珸琲琺瑕琿瑟瑙瑁瑜瑩瑰瑣瑪瑶瑾璋璞璧瓊瓏瓔
珱痼瘁痰痺痲痳瘋瘍瘉瘟瘧瘠瘡瘢瘤瘴瘰瘻癇癈癆癜癘癡癢癨癩癪癧癬癰矗矚矜矣矮矼砌砒
礦砠礪硅碎硴碆硼碚碌碣碵碪碯磑磆磋磔碾碼磅磊磬窶竅竄窿邃竇竊竍竏竕竓站竚竝竡竢竦
竭竰笂笏笊笆笳笘笙笞笵笨笶筐籥籬籵粃粐粤粭粢粫粡粨粳粲粱粮粹粽糀糅糂糘糒糜糢鬻糯
糲糴糶糺紆縲縺繧繝繖繞繙繚繹繪繩繼繻纃緕繽辮繿纈纉續纒纐纓纔纖纎纛纜缸缺聳聲聰聶
聹聽聿肄肆肅肛肓肚肭冐肬胛胥胙胝胄胚胖脉胯胱脛脩脣脯腋艢艨艪艫舮艱艷艸艾芍芒芫芟
芻芬苡苣苟苒苴苳苺莓范苻苹苞茆苜茉苙葯葹萵蓊葢蒹蒿蒟蓙蓍蒻蓚蓐蓁蓆蓖蒡蔡蓿蓴蔗蔘
蔬蔟蔕蔔蓼蕀蕣蕘蕈蛟蛛蛯蜒蜆蜈蜀蜃蛻蜑蜉蜍蛹蜊蜴蜿蜷蜻蜥蜩蜚蝠蝟蝸蝌蝎蝴蝗蝨蝮蝙
袱裃裄裔裘裙裝裹褂裼裴裨裲褄褌褊褓襃褞褥褪褫襁襄褻褶褸襌褝襠襞諤諱謔諠諢諷諞諛謌
謇謚諡謖謐謗謠謳鞫謦謫謾謨譁譌譏譎證譖譛譚譫赭赱赳趁趙跂趾趺跏跚跖跌跛跋跪跫跟跣
跼踈踉跿踝踞踐踟蹂踵踰踴蹊轢轣轤辜辟辣辭辯辷迚迥迢迪迯邇迴逅迹迺逑逕逡逍逞逖逋逧
逶逵逹迸釵釶鈞釿鈔鈬鈕鈑鉞鉗鉅鉉鉤鉈銕鈿鉋鉐銜銖銓銛鉚鋏銹銷鋩錏鋺鍄錮閠閨閧閭閼
閻閹閾闊濶闃闍闌闕闔闖關闡闥闢阡阨阮阯陂陌陏陋陷陜陞鞐鞜鞨鞦鞣鞳鞴韃韆韈韋韜韭齏
韲竟韶韵頏頌頸頤頡頷頽顆顏顋顫顯顰騾驕驍驛驗驟驢驥驤驩驫驪骭骰骼髀髏髑髓體髞髟髢
髣髦髯髫髮髴髱髷鰰鱇鰲鱆鰾鱚鱠鱧鱶鱸鳧鳬鳰鴉鴈鳫鴃鴆鴪鴦鶯鴣鴟鵄鴕鴒鵁鴿鴾鵆鵈黴
黶黷黹黻黼黽鼇鼈皷鼕鼡鼬鼾齊齒齔齣齟齠齡齦齧齬齪齷齲齶龕龜龠
常用漢字 テキストデータ(2136文字)
亜哀挨愛曖悪握圧扱宛嵐安案暗以衣位囲医依委威為畏胃尉異移萎偉椅彙意違維慰遺緯域育
一壱逸茨芋引印因咽姻員院淫陰飲隠韻右宇羽雨唄鬱畝浦運雲永泳英映栄営詠影鋭衛易疫益
液駅悦越謁閲円延沿炎怨宴媛援園煙猿遠鉛塩演縁艶汚王凹央応往押旺欧殴桜翁奥横岡屋億
憶臆虞乙俺卸音恩温穏下化火加可仮何花佳価果河苛科架夏家荷華菓貨渦過嫁暇禍靴寡歌箇
稼課蚊牙瓦我画芽賀雅餓介回灰会快戒改怪拐悔海界皆械絵開階塊楷解潰壊懐諧貝外劾害崖
涯街慨蓋該概骸垣柿各角拡革格核殻郭覚較隔閣確獲嚇穫学岳楽額顎掛潟括活喝渇割葛滑褐
轄且株釜鎌刈干刊甘汗缶完肝官冠巻看陥乾勘患貫寒喚堪換敢棺款間閑勧寛幹感漢慣管関歓
監緩憾還館環簡観韓艦鑑丸含岸岩玩眼頑顔願企伎危机気岐希忌汽奇祈季紀軌既記起飢鬼帰
基寄規亀喜幾揮期棋貴棄毀旗器畿輝機騎技宜偽欺義疑儀戯擬犠議菊吉喫詰却客脚逆虐九久
及弓丘旧休吸朽臼求究泣急級糾宮救球給嗅窮牛去巨居拒拠挙虚許距魚御漁凶共叫狂京享供
協況峡挟狭恐恭胸脅強教郷境橋矯鏡競響驚仰暁業凝曲局極玉巾斤均近金菌勤琴筋僅禁緊錦
謹襟吟銀区句苦駆具惧愚空偶遇隅串屈掘窟熊繰君訓勲薫軍郡群兄刑形系径茎係型契計恵啓
掲渓経蛍敬景軽傾携継詣慶憬稽憩警鶏芸迎鯨隙劇撃激桁欠穴血決結傑潔月犬件見券肩建研
県倹兼剣拳軒健険圏堅検嫌献絹遣権憲賢謙鍵繭顕験懸元幻玄言弦限原現舷減源厳己戸古呼
固股虎孤弧故枯個庫湖雇誇鼓錮顧五互午呉後娯悟碁語誤護口工公勾孔功巧広甲交光向后好
江考行坑孝抗攻更効幸拘肯侯厚恒洪皇紅荒郊香候校耕航貢降高康控梗黄喉慌港硬絞項溝鉱
構綱酵稿興衡鋼講購乞号合拷剛傲豪克告谷刻国黒穀酷獄骨駒込頃今困昆恨根婚混痕紺魂墾
懇左佐沙査砂唆差詐鎖座挫才再災妻采砕宰栽彩採済祭斎細菜最裁債催塞歳載際埼在材剤財
罪崎作削昨柵索策酢搾錯咲冊札刷刹拶殺察撮擦雑皿三山参桟蚕惨産傘散算酸賛残斬暫士子
支止氏仕史司四市矢旨死糸至伺志私使刺始姉枝祉肢姿思指施師恣紙脂視紫詞歯嗣試詩資飼
誌雌摯賜諮示字寺次耳自似児事侍治持時滋慈辞磁餌璽鹿式識軸七𠮟失室疾執湿嫉漆質実芝
写社車舎者射捨赦斜煮遮謝邪蛇尺借酌釈爵若弱寂手主守朱取狩首殊珠酒腫種趣寿受呪授需
儒樹収囚州舟秀周宗拾秋臭修袖終羞習週就衆集愁酬醜蹴襲十汁充住柔重従渋銃獣縦叔祝宿
淑粛縮塾熟出述術俊春瞬旬巡盾准殉純循順準潤遵処初所書庶暑署緒諸女如助序叙徐除小升
少召匠床抄肖尚招承昇松沼昭宵将消症祥称笑唱商渉章紹訟勝掌晶焼焦硝粧詔証象傷奨照詳
彰障憧衝賞償礁鐘上丈冗条状乗城浄剰常情場畳蒸縄壌嬢錠譲醸色拭食植殖飾触嘱織職辱尻
心申伸臣芯身辛侵信津神唇娠振浸真針深紳進森診寝慎新審震薪親人刃仁尽迅甚陣尋腎須図
水吹垂炊帥粋衰推酔遂睡穂随髄枢崇数据杉裾寸瀬是井世正生成西声制姓征性青斉政星牲省
凄逝清盛婿晴勢聖誠精製誓静請整醒税夕斥石赤昔析席脊隻惜戚責跡積績籍切折拙窃接設雪
摂節説舌絶千川仙占先宣専泉浅洗染扇栓旋船戦煎羨腺詮践箋銭潜線遷選薦繊鮮全前善然禅
漸膳繕狙阻祖租素措粗組疎訴塑遡礎双壮早争走奏相荘草送倉捜挿桑巣掃曹曽爽窓創喪痩葬
装僧想層総遭槽踪操燥霜騒藻造像増憎蔵贈臓即束足促則息捉速側測俗族属賊続卒率存村孫
尊損遜他多汰打妥唾堕惰駄太対体耐待怠胎退帯泰堆袋逮替貸隊滞態戴大代台第題滝宅択沢
卓拓託濯諾濁但達脱奪棚誰丹旦担単炭胆探淡短嘆端綻誕鍛団男段断弾暖談壇地池知値恥致
遅痴稚置緻竹畜逐蓄築秩窒茶着嫡中仲虫沖宙忠抽注昼柱衷酎鋳駐著貯丁弔庁兆町長挑帳張
彫眺釣頂鳥朝貼超腸跳徴嘲潮澄調聴懲直勅捗沈珍朕陳賃鎮追椎墜通痛塚漬坪爪鶴低呈廷弟
定底抵邸亭貞帝訂庭逓停偵堤提程艇締諦泥的笛摘滴適敵溺迭哲鉄徹撤天典店点展添転塡田
伝殿電斗吐妬徒途都渡塗賭土奴努度怒刀冬灯当投豆東到逃倒凍唐島桃討透党悼盗陶塔搭棟
湯痘登答等筒統稲踏糖頭謄藤闘騰同洞胴動堂童道働銅導瞳峠匿特得督徳篤毒独読栃凸突届
屯豚頓貪鈍曇丼那奈内梨謎鍋南軟難二尼弐匂肉虹日入乳尿任妊忍認寧熱年念捻粘燃悩納能
脳農濃把波派破覇馬婆罵拝杯背肺俳配排敗廃輩売倍梅培陪媒買賠白伯拍泊迫剝舶博薄麦漠
縛爆箱箸畑肌八鉢発髪伐抜罰閥反半氾犯帆汎伴判坂阪板版班畔般販斑飯搬煩頒範繁藩晩番
蛮盤比皮妃否批彼披肥非卑飛疲秘被悲扉費碑罷避尾眉美備微鼻膝肘匹必泌筆姫百氷表俵票
評漂標苗秒病描猫品浜貧賓頻敏瓶不夫父付布扶府怖阜附訃負赴浮婦符富普腐敷膚賦譜侮武
部舞封風伏服副幅復福腹複覆払沸仏物粉紛雰噴墳憤奮分文聞丙平兵併並柄陛閉塀幣弊蔽餅
米壁璧癖別蔑片辺返変偏遍編弁便勉歩保哺捕補舗母募墓慕暮簿方包芳邦奉宝抱放法泡胞俸
倣峰砲崩訪報蜂豊飽褒縫亡乏忙坊妨忘防房肪某冒剖紡望傍帽棒貿貌暴膨謀頰北木朴牧睦僕
墨撲没勃堀本奔翻凡盆麻摩磨魔毎妹枚昧埋幕膜枕又末抹万満慢漫未味魅岬密蜜脈妙民眠矛
務無夢霧娘名命明迷冥盟銘鳴滅免面綿麺茂模毛妄盲耗猛網目黙門紋問冶夜野弥厄役約訳薬
躍闇由油喩愉諭輸癒唯友有勇幽悠郵湧猶裕遊雄誘憂融優与予余誉預幼用羊妖洋要容庸揚揺
葉陽溶腰様瘍踊窯養擁謡曜抑沃浴欲翌翼拉裸羅来雷頼絡落酪辣乱卵覧濫藍欄吏利里理痢裏
履璃離陸立律慄略柳流留竜粒隆硫侶旅虜慮了両良料涼猟陵量僚領寮療瞭糧力緑林厘倫輪隣
臨瑠涙累塁類令礼冷励戻例鈴零霊隷齢麗暦歴列劣烈裂恋連廉練錬呂炉賂路露老労弄郎朗浪
廊楼漏籠六録麓論和話賄脇惑枠湾腕
Font Converter の良い点は、例えば JIS 第1水準と第2水準をマルっとコピペしても、ちゃんと全部を処理してくれるところです。0x4E00-0x9FF
の全区画を指定するより、よっぽど先方のサーバーに負荷を掛けずに軽量のフォントデータが得られます 👍
その他の設定
ちょうど中間に3つのチェックボックスがありますが、僕は試していませんので悪しからず。ここでは公式の 解説 を意訳するにとどめさせて下さい 😅
-
Font compression
bpp が大きい場合に有効にすると良い様ですが、レンダリングが 30% 程度遅くなります。 -
Horizontal subpixel rendering
LCD の RGB 各画素が水平方向に並んでいる場合に効果のある サブピクセルレンダリング を有効にします。水平方向の解像度が仮想的に3倍相当になるとのことです。 -
アイコンのグレースケール化
PC では 🍁 とか 🙆♂️ などカラー化されたアイコン文字が入力出来ますが、どうやらコレらをグレースケール化するチェックボックスの様です。当然カラー情報を含んだフォントファイルが必要と思います。
3.2 Flash メモリ容量の見積もり
現在試作中の MP3Player 用に、幾つかのパターンでバイナリファイルを作成し、容量を見積もってみました。表中の 「😄」は推奨する文字範囲を示し、Fallback にはそれぞれ代替フォントとして lv_font_montserrat_12
、lv_font_montserrat_14
を指定しています。
ユニコード範囲 (bpp) | 12ピクセル 容量 | 14ピクセル 容量 | 合計容量 |
---|---|---|---|
😄+0x4E00-0x9FFF (bpp = 2) | 588,604 | 735,428 | 1,324,032 |
😄+JIS 第1水準+第2水準 (bpp = 4) | 535,264 | 686,324 | 1,221,588 |
😄+JIS 第1水準 (bpp = 4) | 260,480 | 333,684 | 594,164 |
😄+文化庁 常用漢字 (bpp = 4) | 193,228 | 247,092 | 440,320 |
1番目のパターンでは、パーティションを Huge APP (3MB No OTA/1MB SPIFFS)
に設定しても APP
領域には収まりませんでした。
2番目のパターンは何とか APP
領域に収まりましたが、曲名やアーティスト名、アルバム名には第1水準までで十分かと思いますし、一般的には常用漢字のセットで十分カモです。
Sketch uses 3121430 bytes (99%) of program storage space. Maximum is 3145728 bytes.
Global variables use 118508 bytes (36%) of dynamic memory, leaving 209172 bytes for local variables. Maximum is 327680 bytes.
4.作成したフォントの組み込み方法
いよいよ、タイトルに掲げた3つの組み込み方法についての説明です。それぞれにメリット/デメリットがあるので、実行環境に合った方法を選択して下さい。
4.1. LVGL ライブラリに組み込む
作成した C ソースファイルに定義された lv_font_t
型の変数を組み込む方法です。
この方法のメリットは、複数のプロジェクトで共通に作成したフォントが利用可能になることですが、LVGL のバージョンアップ毎に組み込み直す必要があることがデメリットとなります。
- 生成した C ソースファイルの修正と配置
ファイル先頭の#include "lvgl/lvgl.h"
を#include "../../lvgl.h"
に修正し、LVGL のライブラリフォルダ lvgl/src/core/font/ の下に配置します。
#ifdef LV_LVGL_H_INCLUDE_SIMPLE
#include "lvgl.h"
#else
#include "../../lvgl.h" // <-- "lvgl/lvgl.h" を修正
#endif
- フォント変数の宣言
lv_conf.h
中のシンボルLV_FONT_CUSTOM_DECLARE
に作成したフォント変数の宣言を追加します。次の例ではnoto_sans_jp_12
とnoto_sans_jp_14
を追加しています。
/** Optionally declare custom fonts here.
*
* You can use any of these fonts as the default font too and they will be available
* globally. Example:
*
* @code
* #define LV_FONT_CUSTOM_DECLARE LV_FONT_DECLARE(my_font_1) LV_FONT_DECLARE(my_font_2)
* @endcode
*/
#define LV_FONT_CUSTOM_DECLARE LV_FONT_DECLARE(noto_sans_jp_12) LV_FONT_DECLARE(noto_sans_jp_14)
4.2. スケッチ毎に組み込む
前述の「4.1. LVGL ライブラリに組み込む」とはメリット/デメリットが真逆になります。
- 生成した C ソースファイルの修正と配置
lvgl.h
が正しく読み込まれるよう、ファイル先頭でLV_LVGL_H_INCLUDE_SIMPLE
の定義を追加し、修正後のファイルを.ino
ファイルと共にスケッチフォルダに配置します。
#define LV_LVGL_H_INCLUDE_SIMPLE // <-- 追加する
#ifdef LV_LVGL_H_INCLUDE_SIMPLE
#include "lvgl.h"
#else
#include "lvgl/lvgl.h"
#endif
- フォント変数の宣言
使用するフォントをヘッダファイルなどで宣言します。例えば変数noto_sans_jp_12
とnoto_sans_jp_14
を追加する場合は次の様にします。
LV_FONT_DECLARE(noto_sans_jp_12);
LV_FONT_DECLARE(noto_sans_jp_14);
4.3. ファイルシステムを利用する
3つ目は、LittleFS や SD にフォントの .bin
データを配置し、ランタイム時に RAM 上に展開する方法です。少量の .bin
データであれば SRAM 上に展開することもあり得ますが、PSRAM を使うのが現実的でしょう。
ここでは少々面倒な LittleFS を使う方法を、順を追って説明します。
-
フォントデータを準備する
.ino
ファイルのあるスケッチフォルダにdata
フォルダを作成し、生成したバイナリの.bin
ファイルを入れます。 -
フォントデータを Flash に転送する
パーティション設定で.bin
データを格納するのに十分なサイズのSPIFFS
領域を確保し、arduino-littlefs-upload などでdata
中のフォントデータを Flash に転送します。
LittleFS 用 Flash 転送プラグインについて
今回 LittleFS の扱いが初めてだったので、プラグインを色々と調べました。厄介なことに主要なプラグインが複数見つり、またその派生も多数あるため、更新状況や「Insights > Network」などを確認し、使うプラグインを決めました。
-
https://github.com/earlephilhower/arduino-littlefs-upload
Arduino のフォーラム で紹介され、Arduino IDE 2.x 互換プラグインのリスト に掲載されたプラグイン。 -
https://github.com/me-no-dev/arduino-esp32fs-plugin
Espressif の中の人? ESP32 のコア開発 でよく見かける人が開発したプラグイン。 -
https://github.com/lorol/arduino-esp32fs-plugin
LittleFS の元々の開発者?me-no-dev
のプラグインをフォークしたバージョン。
僕は1番目の arduino-littlefs-upload をチョイスしました。以下そのインストール方法と使い方です。
-
一旦 Arduino IDE を終了します。
-
最新版の
.vsix
ファイルをダウンロードし、.arduinoIDE
フォルダ 下のplugins
フォルダ(無ければ作成)に.vsix
ファイルを入れます。 -
IDE の再起動後、該当のスケッチを開き、キーボードショートカット
Ctrl
+Shift
+P
(Mac の場合は⌘
+Shift
+P
)で コマンドパレット を表示させます。 -
Upload LittleFS to Pico/ESP8266/ESP32
を選択し、data
フォルダ中のファイルを Flash に転送します。
転送時にシリアルモニタが開いていると失敗するので、閉じておきましょう。
また「ボード情報が得れない」、「data
フォルダが未定義」などのエラーが生じた場合、一旦他のボードタイプ(任意)を開き再び元のボードタイプに戻す → IDE を再起動するなどして、転送に必要な情報を IDE に再設定させます。
またある時はコマンドパレットにプラグインが現れず、パソコンを再起動したら直った、なんてこともありました 😅
- LittleFS 用ファイルシステムを LVGL に設定する
LVGL ではストレージデバイスの物理層を抽象化した ファイルシステム を構築することができ、各デバイスをアルファベット1文字の「ドライブレター」で区別します。この仕組みを有効にするため、lv_conf.h で以下の設定を行います。(注:v9.2 の lv_conf.h ではLV_FS_ARDUINO_ESP_LITTLEFS_PATH
はまだ未設定で、v9.3 以降向けと思われます)
/** API for Arduino LittleFs. */
#define LV_USE_FS_ARDUINO_ESP_LITTLEFS 1 // <-- 有効化する
#if LV_USE_FS_ARDUINO_ESP_LITTLEFS
#define LV_FS_ARDUINO_ESP_LITTLEFS_LETTER 'L' // <-- LittleFSを識別する任意のアルファベット
#define LV_FS_ARDUINO_ESP_LITTLEFS_PATH "" // <-- ドライブのルートから作業フォルダまでのパス
#endif
- PSRAM を使用する場合の設定をする
少し古いですが、ESP32 PSRAM configure for LVGL #3244 に寄せられた情報が v9.2 でも有効で、lv_conf.h に ps_malloc() の設定を追加します。
/** Set an address for the memory pool instead of allocating it as a normal array. Can be in external SRAM too. */
#define LV_MEM_ADR 0 /**< 0: unused*/
/* Instead of an address give a memory allocator that will be called to get a memory pool for LVGL. E.g. my_malloc */
#if LV_MEM_ADR == 0
#define LV_MEM_POOL_INCLUDE <esp32-hal-psram.h> // <-- ココを修正
#define LV_MEM_POOL_ALLOC ps_malloc // <-- ココを修正
#endif
- フォントデータをメモリに展開する
次のコード例の参考にlv_font_t
型のデータを作成します。
lv_font_t *my_font = lv_binfont_create("L:/noto_sans_jp_12.bin");
if(my_font == NULL) return;
/* 作成したフォントをスタイルに反映する(表示中はフォントデータをキープすること)*/
/* 表示が終了し、フォントデータが不要になったら解放できる */
lv_binfont_destroy(my_font);
4.4. サンプルプログラム
冒頭に示したフォント見本を表示するプログラムを LVGL_Arduino_FontManager に上げてあります。ヤッツケで作ったので実用的ではありませんが、「4.2. スケッチ毎に組み込む」と「4.3. ファイルシステムを利用する」を試しているので、部分的には参考になると思います。
ただ PSRAM が使えない CYD で試しているため、LittleFS 利用時のフォントデータは SRAM 上に展開しています(LVGL オリジナルの lv_malloc()
が使われているハズ)。
終わりに…

余談ですが、.ttf
ファイルの中身を覗くには FontForge が便利でした。今回紹介した文字以外にも面白い文字が見つかるカモです。
さて、前回 でオーディオファイルの再生を、今回で曲名やアーティスト名の日本語表示ができました。
絵心のない僕なのでへっぽこな GUI ですが、SquareLine Studio の 30 日トライアル期間内で何とかテンプレート的なコードの生成も出来ました。現在は少しずつ中身を埋めているところです 🎶