U8g2 库自定义字体生成和使用

U8G2 库自定义字体生成和使用


U8g2 库自带字体虽然很多,但是有时候自带的字体没法满足个性化需求。想仿数码管字体只有大号的字体,对于SSD1306这种小屏幕没法显示。

  • U8g2自带的仿数码管字体:
c 复制代码
u8g2_font_7Segments_26x42_mn
u8g2_font_7_Seg_33x19_mn
u8g2_font_7_Seg_41x21_mn
  • 所有包含的字体定义在u8g2.h中。
  • 调用U8g2的API函数汉字显示:
c 复制代码
	u8g2_ClearBuffer(&u8g2);
	u8g2_SetFont(&u8g2,myFont_16);//自定义字体
	u8g2_DrawUTF8(&u8g2,0, 15,"碧玉妆成一树高");
	u8g2_DrawUTF8(&u8g2,0, 30,"万条垂下绿丝绦");
	u8g2_DrawUTF8(&u8g2,0, 45,"不知细叶谁裁出");
	u8g2_DrawUTF8(&u8g2,0, 60,"二月春风似剪刀");
	u8g2_SendBuffer(&u8g2);
  • 调用U8g2的API函数图标显示:
c 复制代码
	u8g2_ClearBuffer(&u8g2);
	u8g2_SetFont(&u8g2,u8g2_font_open_iconic_weather_8x_t);
	u8g2_DrawGlyph(&u8g2,0, 42,2);
	u8g2_SendBuffer(&u8g2);
  • 调用U8g2的API函数ASCII显示:
c 复制代码
	u8g2_ClearBuffer(&u8g2);
	u8g2_SetFont(&u8g2,u8g2_font_10x20_mf);
	u8g2_DrawStr(&u8g2,30,10,"free");
	u8g2_SendBuffer(&u8g2);

自定义ASCII仿数码管字体制作

  • 工具:FontForge

  • 仿数码管字体下载地址:

c 复制代码
https://www.dafont.com/seven-segment.font
https://fontstruct.com/gallery/set/32/lcd-segment
  • 下载自己喜欢的字体文件(.ttf)

  • 设置像素大小

  • 导出.bdf文件:

  • 通过U8g2自带的转换工具bdfconv.exe转换,这里我们只提取了33-125编码的字符。

c 复制代码
./bdfconv.exe -v -f 1 -m "33-125" SevenSegmentRegular-15.bdf -n SevenSegmentRegular_tn16 -o SevenSegmentRegular_tn16.c

起始位置:

结束位置:

  • 执行后得到对于的.c文件

  • 🔧提取的C数组放置到\u8g2\u8g2_fonts.c文件中。

  • 🔨外部引用\u8g2\u8g2.h文件中,例如:

c 复制代码
extern const uint8_t SevenSegmentRegular_tn16[1220] U8G2_FONT_SECTION("SevenSegmentRegular_tn16");
extern const uint8_t myFont_16[1870] U8G2_FONT_SECTION("myFont_16");
c 复制代码
/*
  Fontname: -FontForge-Seven Segment-Book-R-Normal--15-110-100-100-P-72-ISO10646-1
  Copyright: (null)
  Glyphs: 90/166
  BBX Build Mode: 0
*/
const uint8_t SevenSegmentRegular_tn16[1220] U8G2_FONT_SECTION("SevenSegmentRegular_tn16") = 
  "Z\0\3\3\6\4\3\5\7#\16\0\377\13\0\13\0\1\212\3#\4\247!\7\301\26\16q \42\6"
  "B\64\23!#\17\306\25\42\27\11E\42\246H\304\222&\3$\17F\367!\25\244D\63\223\243Yh"
  "\61\0%\34\311\26.\17\210\3b\301P$\24\213\244\206\342\200X\60\24\11\305\42\241`(\16&'"
  "\342\26\216C\307%\216k\34\327\70\256q\234i\34\313\31C\301p\306P\60\234\61\24\14g\14EI"
  "\341\70\200\26\4(\13\304\26\32C\313\16\210e\34)\15\304\26\32\61\214e\7\304\322(\0*\13\203"
  "\371\32\23\212XB\21\0+\24I\22*\31\207\304!qH\220B\214C\342\220\70$\10,\6A\24"
  "\16\21-\6D\264\32A.\6A\24\16\21/\16\206\26\42\33\24\246\6\243\301\324(\0\60\16\306\26"
  "\42C\11j\14\7\65F(\0\61\7\301\26\16Q)\62\15\306\26\42C\216f\241D\63S\0\63\15"
  "\305\26\36A\15&V\203\211\25\0\64\14\306\26\42\21\324\61B\216\346\0\65\15\306\26\42C\211f&"
  "G\263P\0\66\16\306\26\42C\211f\246\4\65F(\0\67\13\305\26\36A\15f\7\5s\70\17\306"
  "\26\42C\11j\214P\202\32#\24\0\71\16\306\26\42C\11j\214\220\243Y(\0:\7\1\25\16\21"
  "\12<\14\302\26\22\23\221\244E\222\42\1=\10\6U\42a\207\32>\15\302\26\22\21I\212\304\42\222"
  "\24\0\77\14\306\26\42C\216f\241Ds\5@\23\306\26\42C\11*QB\222\220$$\11\251\204)"
  "\0A\15\306\26\42C\11j\214P\202:\6B\17\306\26\42C\11j\214P\202\32#\24\0C\13\305"
  "\26\36S\314\16\12f%D\16\306\26\42C\11j\14\7\65F(\0E\12\305\26\36S\314Z\314J"
  "F\13\305\26\36S\314Z\314\21\0G\17\306\26\42C\211f\7L\202\32#\24\0H\14\306\26\42\21"
  "\324\61B\11\352\30I\7\301\26\16Q)J\14\306\26\42\233\347\240\306\10\5\0K\20\306\26\42\21\224"
  "EB)\61)%\250c\0L\13\305\26\36\21\314\35\24\314JM\23\310\26*\63\221\304B\262\220,"
  "$\13\305!a\235\3N\14\306\26\42C\11j\14\7u\14O\16\306\26\42C\11j\14\7\65F("
  "\0P\15\306\26\42C\11j\214P\242\271\2Q\15\306\26\42C\11j\14\7\265\205\12R\21\306\26\42"
  "C\11j\214P\204\221X(-\22\14S\15\306\26\42C\211f&G\263P\0T\14\307\26&\61\231"
  "\205\263\203\363\6U\15\306\26\42\21\324\61\34\324\30\241\0V\17\306\26\42\21\324\61\34\34IB\331D"
  "\0W\24\310\26*\21\326\71\16\211\205d!YH\26\212L$\0X\23\306\26\42\21\224\205\362\22\7"
  "Eb\241,\261H\60\0Y\15\306\26\42\21\324\61B\216f\241\0Z\16\306\26\42QM\214\306a\301"
  "h\60\134[\13\304\26\32C\313\16\210e\34\134\16\206\26\42\21\216\206\243\341\250\64\34\15]\15\304\26"
  "\32\61\214e\7\304\322(\0^\13\312\264\62G\234I\344\200\0_\6G\24&qa\15\306\26\42C"
  "\11j\214P\202:\6b\17\306\26\42C\11j\214P\202\32#\24\0c\13\305\26\36S\314\16\12f"
  "%d\16\306\26\42C\11j\14\7\65F(\0e\12\305\26\36S\314Z\314Jf\13\305\26\36S\314"
  "Z\314\21\0g\17\306\26\42C\211f\7L\202\32#\24\0h\14\306\26\42\21\324\61B\11\352\30i"
  "\7\301\26\16Q)j\14\306\26\42\233\347\240\306\10\5\0k\20\306\26\42\21\224EB)\61)%\250"
  "c\0l\13\305\26\36\21\314\35\24\314Jm\23\310\26*\63\221\304B\262\220,$\13\305!a\235\3"
  "n\14\306\26\42C\11j\14\7u\14o\16\306\26\42C\11j\14\7\65F(\0p\15\306\26\42C"
  "\11j\214P\242\271\2q\15\306\26\42C\11j\14\7\265\205\12r\21\306\26\42C\11j\214P\204\221"
  "X(-\22\14s\15\306\26\42C\211f&G\263P\0t\14\307\26&\61\231\205\263\203\363\6u\15"
  "\306\26\42\21\324\61\34\324\30\241\0v\17\306\26\42\21\324\61\34\34IB\331D\0w\24\310\26*\21"
  "\326\71\16\211\205d!YH\26\212L$\0x\23\306\26\42\21\224\205\362\22\7Eb\241,\261H\60"
  "\0y\15\306\26\42\21\324\61B\216f\241\0z\16\306\26\42QM\214\306a\301h\60\134{\14\305\26"
  "\36\65\11f\213\6\263\16|\7\1\27\16q(}\15\306\26\36\61\216f\226E\63\315\0\0\0\0\4"
  "\377\377\0";
c 复制代码
void Display_SEG()
{
	u8g2_ClearBuffer(&u8g2);
	u8g2_SetFont(&u8g2,SevenSegmentRegular_tn16);
	u8g2_DrawStr(&u8g2,0, 16,"12:32-59.{-}");
	u8g2_DrawStr(&u8g2,0, 32,"ABCDEFGHIJK");
	u8g2_DrawStr(&u8g2,0, 48,"MLNOPRSTUVW");
	u8g2_DrawStr(&u8g2,0, 64,"XYZ[\\+/(|)]");
		   u8g2_SendBuffer(&u8g2);
		   HAL_Delay(1000);
}
  • 仿数码管显示字符:
汉字字体编码生成

这里利用到了一个开源的小工具来生成汉字编码。

  • 个人修改过的小工具:Easy-u8g2-font-generate-tools
c 复制代码
https://gitee.com/perseverance51/Easy-u8g2-font-generate-tools

原作者项目地址:

c 复制代码
https://gitee.com/createskyblue/Easy-u8g2-font-generate-tools
  • 只需要准备好字体文件(.ttf),具体使用可以参考项目里的.md说明文档,写的很详细。
  • 两首诗的汉字编码
c 复制代码
const uint8_t myFont_16[1870] U8G2_FONT_SECTION("myFont_16") = 
  "\71\0\3\2\4\4\3\4\6\17\20\0\375\13\376\14\377\0\0\0\0\0\2\0\0\0\4\377\377N\0\10"
  "\35\365\27\37\2N\7\34\335\265\367\350\360\240\346h\216\16;\20\346@\30\247qZN\343\60\213\302t"
  "\3N\12\34\336\275\327\71\234\303\71\234\303a\216\14;\222\303\71\234\303\71\234\303i\62<\10N\13\35"
  "\355\265\367\350\360 \347h\216\346\350\216E:\222\351@\216\346h\216\346h\216\306\0N\15\35\335\275\27"
  "\37\342\34\315A\35\324\261$\212\243,\314\302(L\325\34\315\321\34\215\1N\26!\336=\270Z\32\205"
  "i\24\246Q\230\15\17R\61\215\302\64\12\323(L\243a\215\302\64\207\207\7N\35\33\334\306Wi\61"
  "-fI\244DI\26\35\322\60-FJ\272\15\71\333\360\4N\214\17\255\275\367X\66\34t\376_\206"
  "\207\0N\216\33\335\265\367X\70\34r Gs\64G\343\341!\316\321\34\315\321\34\315\261\31N\221\30"
  "\335\255\367X\70\34r^\207\207\70\7s\60G\303\270:\334\346\4N\272\34\334>\270:\226\203\71\250"
  "c:\224\344P\222Cu \214\303\64\316rd\307\2O<'\356\275w\71\32\245a\224f\245\232\24"
  ")Q\22\245a\224\206Q\230F\225\64\232\304(\213\262\64\223\62\35\314\21\0O`%\355\275wR\216"
  "D\71\222\345H\66\14Q\65R\262\60I\343,)FmQIJ\262R\232E\331\34\246\0P\134#"
  "\355\64wu$\214\223\341\224\15bV\323\6)\311\342$\31NI\216E\303\220\245q\32\247q(\2"
  "Q\372\35\353\266\267\71\226\206\331\230%a\226\204Y\62\34\342\64\14\305P\14\305px\307\2R\0\27"
  "\314\265\67\303A\355\77\306a\234\345@\226\3Q\70$:\20\1Rj+\376\265\227\231\16%a\62<"
  "H\203\22\205Y\22\205\203\22\205\203\22\205Y\22\205Q\32Fa:\34r$\314\201\64\325\316!\0S"
  "\366!\375\265\367H\216\206CX\12Ka)\31Na),\205\341\20\226\302:\220\243\71\232\243!\0"
  "WP!\335\275\327\71T\323\32\263(\315\42-Q\242$\252\224\266D\7\245p\70\344@\216\306\303C"
  "\0W\202#\356\65\370\320\70\14\71\232\303a\64<\204Q\35\210j\303\203\30\325\201\250\66<\350@\16"
  "\207\321\360\2Y\4\42\335>Xb\234\306i:,i\26\211Y\224\230\262h\210\262\70\311r \314\1"
  "-\216duP\0Y}'\376\64w\71\234\15c\16D\303\230FY\34eq\222\14\203\22\205i\24"
  "\306I\230\3b\16$Y\134\215\305\34\6Y\206#\355\275wa\16\204\245,N\262\60\251\14\203R+"
  "FY\32e\331\224E\265\71U\303(\214\304P\7[\266#\355\275\327\71\20\346\300\227\34\36\6\35\311"
  "\261M\214\224\64\212dI\311\264$J\245LQ\242\34\223\1[\322!\355\265\327\71\32\17\17Z)\32"
  "\16q\226\16\207\70\13\207\207L\313\201H\11\305h\10uX\4\134q\31\332>\227\71\224C\71\224f"
  "\241\26j\241\26j\241\26j\341\360\216\4_\204#\355\265wq\30\15[\16d\71\22\207\71\20)["
  "\224*:\322\64\14Y\32\247q\32'\303)\307\0b\20&\356\274\367\200\216F:\224#\303S\230#"
  "a\246\15J\24fI\24fI\65\213\324,\22#)Q\252\341\16\3e\234'\356=\230q*\247\211"
  "\224\204\231R\13\253S\71L\262aH\312\361\224T\206,J\302(\213\262()\247\71\20\1f%\42"
  "\355\265\267\71\232#\303A\32\356@\216\14\17Y\230\16\267(L\266\60\7\356@\230\3w \14\1f"
  "Z-\375\265\367@\216d\351\20\15R%+%Q\30\15\227!\211*Q\22U\242d\30\222(K\262"
  "!K\262\64\252fQ\30\16Y\16\1g\10\35\332=w\303\220\245Y\232\15C\226fi\66\14Y\232"
  "\245Q\34\305I:\344@\2g\11\37\355\265\267\71Z\31\36\302\34\34\206\70\15\327,\32\206\70\215\207"
  "!N\343\64N\343P\3ga\37\354\266w\71\230\203\303\252\245Q\222\206\71\226\344\200f\313\226\341\232"
  "\344H\24\331\62U\6g\227$\355=xi\234\306I\26\15C\62li*\36\242-\351)\211*\245"
  "$\213\262$\213\262\64N\343\64\3g\253(\355\265W\71\32\15C\26\205\245\60\32\246$\214\224b\224"
  "(\331R\312\24K\224DJ)\211\214I\32&\261\244#\1h\21'\335\275W\71\20\346@\230\14J"
  "\64H\303\24Fa\224D\331\220\264)%)\211\222\250R*&i\230\3a,\1m\361\37\335\255W"
  "\331\60D\325\34\211:FI\251\244\306\311p\12\307\212X\251\225Z\264\64\16\1r\61!\374\265\367\320"
  "\62\14:\224\205i\66<\246bi\70\244\71\70\314Z\32%i\266I\332\226#\0s\211\36\335\255\367"
  "`\64<\347h\216\346h\216\14\207\34\310\321(\207\262\34\311r$\35\36\4uL\35\333\276\67\303)"
  "+\15\247\254\64\234*\71\220\245\323\260dQV\316\322\60S\63\0v}\31\332\277\227\71\222C\361p"
  "\320\21\35\321\221\341\35\321\21\35\31\336\221\0w\345\37\334\265W\71\230c\71\70(\303\224u\33\206$"
  "\353\247$\312\242\312\240dI\226\3Y\0w\363\37\355\66\370`\62<\244\71\230\203\71\32\207\303-\211"
  "\243r\32\247q:\14j\234\346\20\0x\247%\375\265\267Y\70(R\230\15bV\233\6\61\253M\203"
  "\242\246\303C\230\203\303 \312Y\22\247\303\240\346\20\0~\242\35\315\305W:\230\203\331\60D\265\60+"
  "\16a\234\226\262p\10s\250:d\241\64\34~\306\42\315=X\71T\33\206$\232\42-\211*S\267"
  "aH\302\250\62$Q\71\252E\245!\33\206\70\15~\346'\376\264\367H\16\204\71\22\16b\255\224\64"
  "&i\34*C\24I\35\323i\30r,G\242\244\64D\255Z\35\21\1~\377#\355\255w\71\32\15"
  "b\16dQ\62HY\232-\303 \245\265\250K\333\250CIi\230\42\35\311A\21\202\261 \335\275\227"
  "Y\216d\341\360\20f\71\222\223r \214\302JhL\242\35H\242\254\230\25\7\1\210\301%\335\275w"
  "a\16\204I\64\14I\24\26\207\207\34\11\207!\211\262\64\312\42\245\246\204Y\22I%)i\312\14\214"
  "\1$\354\266\367@\232Ea\224\203\303 f\331p\211\224L\213\262\60\31.J\26*Y\30\15\203\230"
  "\203\71\0\217f\36\355\275\267\71\30'\303C\230\203Q\216d\305\341\216\344h<<\304\71\232\243\71\32"
  "\3\217\334!\334\275\67\71\222%\303\220\345l\303[\24fQ\230Ea\224%Q-\211\222pPtt"
  "\30\2\227\34%\335\265w\303m\70(i\26%\207t\31\322,\35\226A\323\6mH\262(\311\6%"
  "\312\212\331 f)\0\230\316$\335\265\367X\70\34s L\223\60\211\212Q\22\205Y\61\223\302(\211"
  "\302$K\262$L\226\34\332\301\0\232\330!\355\265\327\71\32\17\17\331\60\304i<\14\71m\70H\321"
  " \265EmQi\220\332\242:\242\0\0";
c 复制代码
void Display_CN()
{
	static uint8_t i=0;
	u8g2_ClearBuffer(&u8g2);
	u8g2_SetFont(&u8g2,myFont_16);// myFont_16
//	u8g2_SetCursor(0, 20);
//	u8g2_DrawStr(&u8g2,0, 16,"12:32-59.");
//		 u8g2_DrawStr(&u8g2,0, 16,"信息角度菜单");
//	u8g2_DrawStr(&u8g2,0, 16,"信息角度菜单");
	if(++i<6)
	{
	u8g2_DrawUTF8(&u8g2,0, 15,"远上寒山石径斜");
	u8g2_DrawUTF8(&u8g2,0, 30,"白云深处有人家");
	u8g2_DrawUTF8(&u8g2,0, 45,"停车坐爱枫林晚");
	u8g2_DrawUTF8(&u8g2,0, 60,"霜叶红于二月花");
	}else{
		if(i>12) i=0 ;
	u8g2_DrawUTF8(&u8g2,0, 15,"碧玉妆成一树高");
	u8g2_DrawUTF8(&u8g2,0, 30,"万条垂下绿丝绦");
	u8g2_DrawUTF8(&u8g2,0, 45,"不知细叶谁裁出");
	u8g2_DrawUTF8(&u8g2,0, 60,"二月春风似剪刀");
	}
	   u8g2_SendBuffer(&u8g2);
		   HAL_Delay(1000);
}
  • 汉字显示效果: