智能硬件嵌入式硬件开发【免费下载链接】X-TRACKA GPS bicycle speedometer that supports offline maps and track recording项目地址https://gitcode.com/gh_mirrors/xt/X-TRACK点击查看免费下载LVGLLittlevGL把每个字母glyph渲染为位图集合字体即存储在lv_font_t变量中、通过样式的text_font字段生效。本文以 X-TRACK 项目基于 LVGL 的 GPS 自行车码表为落点系统讲解 LVGL 字体的 bpp 位深原理、Unicode 与内置字体、特殊字体特性BiDi/阿拉伯波斯文/亚像素/压缩、在线与离线字体转换工具、运行时加载、自定义字体引擎以及 fallback 回退链并给出 X-TRACK 中真实可查证的代码示例与配置路径。字体与 bpp每像素位深核心概念在 LVGL 中字体并不是简单的 TTF 文件而是一组**位图bitmap**以及渲染每个字母所需的附加信息。字体保存在lv_font_t类型的变量中通过样式的text_font字段引用。在 X-TRACK 中你可以看到大量类似下面的用法lv_style_set_text_font(my_style, lv_font_montserrat_28); /*Set a larger font*/字体具有bppbits per pixel每像素位深属性它表示字体中用多少个二进制位来描述一个像素而该像素存储的值决定了该像素的不透明度opacity。bpp 越高字母边缘的抗锯齿就越平滑可选值为1、2、4、8数值越大质量越高。bpp 直接影响字体占用的内存量例如bpp 4的字体体积约为bpp 1的四倍。这一点在 X-TRACK 这类内存敏感的嵌入式 UI 中尤为重要——字体资源直接以 C 数组形式编译进固件详见下文“X-TRACK 中的字体落地方式”。从源码结构看LVGL 的字形描述符lv_font_glyph_dsc_t中显式包含uint8_t bpp: 4; /* Bit-per-pixel: 1, 2, 4, 8*/字段见 lv_font.h渲染引擎正是依据该字段逐位解码位图流。字体结构体lv_font_t则通过两个回调get_glyph_dsc与get_glyph_bitmap向外提供字形信息见 lv_font.h。Unicode 支持UTF-8 编码与 LV_SYMBOLLVGL 支持UTF-8编码的 Unicode 字符。使用前需要确保编辑器保存代码/文本时为 UTF-8 编码通常为默认lv_conf.h中LV_TXT_ENC设置为LV_TXT_ENC_UTF8这也是默认值。在 X-TRACK 的 LVGL 配置中确实如此——lv_conf.h 中定义了LV_TXT_ENC默认值为LV_TXT_ENC_UTF8。文本编码除了 UTF8 外还有LV_TXT_ENC_ASCII可选。测试 Unicode 是否生效可以创建一个标签并设置内置符号文本lv_obj_t * label1 lv_label_create(lv_scr_act(), NULL); lv_label_set_text(label1, LV_SYMBOL_OK);如果一切正常界面应显示一个 ✓ 字符。内置字体Montserrat 系列与特殊字体LVGL 提供了多种尺寸的内置字体可以在lv_conf.h中通过LV_FONT_...宏开关启用。X-TRACK 的 lv_conf.h 完整保留了这些开关默认全部关闭仅通过LV_FONT_DEFAULT指向lv_font_montserrat_10见 lv_conf.h。常规字体Normal fonts包含全部 ASCII 字符、度数符号U00B0、项目符号U2022以及内置符号见下文LV_FONT_MONTSERRAT_1212 px 字体LV_FONT_MONTSERRAT_1414 px 字体LV_FONT_MONTSERRAT_1616 px 字体LV_FONT_MONTSERRAT_1818 px 字体LV_FONT_MONTSERRAT_2020 px 字体LV_FONT_MONTSERRAT_2222 px 字体LV_FONT_MONTSERRAT_2424 px 字体LV_FONT_MONTSERRAT_2626 px 字体LV_FONT_MONTSERRAT_2828 px 字体LV_FONT_MONTSERRAT_3030 px 字体LV_FONT_MONTSERRAT_3232 px 字体LV_FONT_MONTSERRAT_3434 px 字体LV_FONT_MONTSERRAT_3636 px 字体LV_FONT_MONTSERRAT_3838 px 字体LV_FONT_MONTSERRAT_4040 px 字体LV_FONT_MONTSERRAT_4242 px 字体LV_FONT_MONTSERRAT_4444 px 字体LV_FONT_MONTSERRAT_4646 px 字体LV_FONT_MONTSERRAT_4848 px 字体特殊字体Special fontsLV_FONT_MONTSERRAT_12_SUBPX同 12 px 常规字体但带亚像素渲染LV_FONT_MONTSERRAT_28_COMPRESSED同 28 px 常规字体但以压缩字体形式存储bpp 3LV_FONT_DEJAVU_16_PERSIAN_HEBREW16 px 字体覆盖常规字符集 希伯来语、阿拉伯语、波斯语字母及其全部变形LV_FONT_SIMSUN_16_CJK16 px 字体常规字符集 1000 个最常见的 CJK 部首LV_FONT_UNSCII_88 px 逐像素完美字体仅含 ASCII 字符LV_FONT_UNSCII_1616 px 逐像素完美字体仅含 ASCII 字符内置字体是全局变量命名形如lv_font_montserrat_1616 px 高度。使用时只需将指向字体变量的指针赋给样式如第一节所示。bpp 4 的内置字体包含 ASCII 字符字体字形源自 Montserrat 字体此外还从 FontAwesome 字体中加入了下列符号详见原文档内置符号图/misc/symbols.png仓库内未收录该图符号的用法有三种/* 单独使用 */ lv_label_set_text(my_label, LV_SYMBOL_OK); /* 与字符串拼接编译期字符串常量拼接 */ lv_label_set_text(my_label, LV_SYMBOL_OK Apply); /* 多个符号叠加 */ lv_label_set_text(my_label, LV_SYMBOL_OK LV_SYMBOL_WIFI LV_SYMBOL_PLAY);特殊字体特性双向BiDi文本支持多数语言采用从左到右LTR书写方向而希伯来语、波斯语、阿拉伯语等采用从右到左RTL方向。LVGL 不仅支持纯 RTL 文本还支持混合文本即双向文本BiDi渲染。BiDi 支持由lv_conf.h中的LV_USE_BIDI开启X-TRACK 默认关闭见 lv_conf.h。所有文本都有一个基础方向LTR 或 RTL它决定部分渲染规则和文本默认对齐方式靠左或靠右。注意基础方向在 LVGL 中是适用于所有对象的通用属性不只作用于标签未设置时从父对象继承因此只需设置屏幕的基础方向所有对象都会继承。屏幕的默认基础方向由lv_conf.h中的LV_BIDI_BASE_DIR_DEF设置X-TRACK 中为LV_BASE_DIR_AUTO见 lv_conf.h。用lv_obj_set_base_dir(obj, base_dir)为对象设置基础方向可选值LV_BIDI_DIR_LTR从左到右基础方向LV_BIDI_DIR_RTL从右到左基础方向LV_BIDI_DIR_AUTO自动检测基础方向LV_BIDI_DIR_INHERIT从父对象继承基础方向非屏幕对象使用默认值RTL 基础方向对各对象的影响汇总对象默认创建在右侧lv_tabview标签页从右到左显示lv_checkbox复选框显示在右侧lv_btnmatrix按钮从右到左排列lv_list图标显示在右侧lv_dropdown选项右对齐lv_table、lv_btnmatrix、lv_keyboard、lv_tabview、lv_dropdown、lv_roller中的文本会经过“BiDi 处理”以正确显示阿拉伯语与波斯语支持阿拉伯语和波斯语字符有特殊显示规则字符形态取决于其在文本中的位置。同一个字母在孤立、词首、词中、词尾位置需要使用不同形态此外还要考虑连字conjunction规则。LVGL 在LV_USE_ARABIC_PERSIAN_CHARS开启时支持这些规则X-TRACK 默认关闭见 lv_conf.h。但存在以下限制仅支持文本显示如标签不支持文本输入如 text area静态文本const文本不会被处理。例如lv_label_set_text()设置的文本会被“阿拉伯语处理”而lv_label_set_text_static()不会文本获取函数如lv_label_get_text()返回的是处理后的文本。亚像素渲染Subpixel rendering亚像素渲染通过在 R、G、B 三个颜色通道上渲染抗锯齿边缘而非像素级粒度将水平分辨率提升三倍。它利用了物理像素中各颜色通道的位置使字母抗锯齿质量更高。使用亚像素渲染需要以特殊设置生成字体在线转换器勾选Subpixel复选框命令行工具使用--lcd标志。注意生成的字体需要约三倍内存。亚像素渲染仅当像素的 R、G、B 通道呈水平排列左右相邻而非上下堆叠时有效。颜色通道顺序还需与库的设置匹配LVGL 默认按RGB顺序假设可通过在lv_conf.h中设置LV_SUBPX_BGR 1交换X-TRACK 中定义为LV_FONT_SUBPX_BGR 0即 RGB 顺序见 lv_conf.h。源码中lv_font_t也包含uint8_t subpx : 2; /** An element of lv_font_subpx_t*/字段见 lv_font.hlv_font_subpx_t枚举定义了LV_FONT_SUBPX_NONE / HOR / VER / BOTH四种亚像素模式见 lv_font.h。压缩字体Compressed fonts字体位图可以通过以下方式压缩在线转换器勾选Compressed复选框离线转换器不传--no-compress标志默认即压缩。压缩对大字体和高 bpp效果更好但渲染压缩字体大约慢 30%。因此官方建议只压缩 UI 中最大的那几个字体因为它们占用内存最多、压缩率最好而且通常比中等字体用得少性能开销更小。添加新字体到项目有三种途径为项目添加新字体最简单使用在线字体转换器。设置参数后点击Convert按钮把生成的字体内核复制到项目中使用。务必仔细阅读该网站提供的步骤否则转换时会报错。使用离线字体转换器需要安装 Node.js。生成类内置字体如果你想要不同尺寸/字符范围的 Montserrat 符号字体可以使用lvgl/scripts/built_in_font文件夹中的built_in_font_gen.py脚本需要安装 Python 与lv_font_conv。X-TRACK 仓库自带该脚本及其依赖的 TTF/WOFF 源文件Montserrat-Medium.ttf、DejaVuSans.ttf、SimSun.woff、FontAwesome5-SolidBrandsRegular.woff、unscii-8.ttf以及配套的generate_all.py见 built_in_font。在文件中声明字体使用LV_FONT_DECLARE(my_font_name)要让字体全局可用类似内置字体把它们加入lv_conf.h的LV_FONT_CUSTOM_DECLAREX-TRACK 中该宏默认为空见 lv_conf.h。添加新符号内置符号源自 FontAwesome 字体添加自定义符号的完整步骤如下在 FontAwesome 网站搜索目标符号例如 USB 符号其 Unicode ID 为0xf287打开在线字体转换器添加FontAwesome.woff字体文件设置名称Name、尺寸Size、BPP 等参数这个名称将用于在代码中声明和使用字体在字符范围range字段中填入符号的 Unicode ID例如0xf287多个符号用,枚举转换字体并把生成的源码复制到项目确保编译该字体的 .c 文件用extern lv_font_t my_font_name;或LV_FONT_DECLARE(my_font_name);声明字体。使用符号把 Unicode 值转换为 UTF-8例如0xf287的 Hex UTF-8 字节为EF 8A 87由 UTF-8 值构造define字符串#define MY_USB_SYMBOL \xEF\x8A\x87创建标签并设置文本例如lv_label_set_text(label, MY_USB_SYMBOL)。注意lv_label_set_text(label, MY_USB_SYMBOL)会在样式style.text.font属性指定的字体中查找该符号因此要使用该符号可能需要在样式中切换字体例如style.text.font my_font_name。X-TRACK 中的字体落地方式ResourcePool 统一管理X-TRACK 并未直接引用 LVGL 内置字体而是将自定义生成的字体统一收编进资源池ResourcePool。这一点是原文档在嵌入式项目中的典型落地实践值得展开仓库中的字体资源位于 Font 目录共五个自定义字体均由官方在线/离线转换器生成.c文件头部标注尺寸与 bpp例如 font_bahnschrift_13.c 标注Size: 13 px / Bpp: 4font_bahnschrift_13.c13 pxbpp 4font_bahnschrift_17.c17 pxbpp 4font_bahnschrift_32.c32 pxbpp 4font_bahnschrift_65.c65 pxbpp 4font_agencyb_36.c36 pxbpp 4如 font_agencyb_36.c这些.c文件内部是标准的glyph_bitmap[]位图流每个像素按 bpp 位编码与字形索引表与转换器输出完全一致。在 ResourcePool.cpp 中通过宏IMPORT_FONT(name)展开为LV_FONT_DECLARE(font_##name)并注册进全局ResourceManager#define IMPORT_FONT(name) \ do{\ LV_FONT_DECLARE(font_##name)\ Font_.AddResource(#name, (void*)font_##name);\ }while(0) /* Import Fonts */ IMPORT_FONT(bahnschrift_13); IMPORT_FONT(bahnschrift_17); IMPORT_FONT(bahnschrift_32); IMPORT_FONT(bahnschrift_65); IMPORT_FONT(agencyb_36);ResourcePool::Init()还会把默认字体设为LV_FONT_DEFAULT见 ResourcePool.cpp并提供GetFont(const char* name)按名称取出lv_font_t*见 ResourcePool.cpp。各页面通过名称取字体并赋给样式例如 DialplateView.cpp 用bahnschrift_65渲染大号速度数字、bahnschrift_17渲染辅助信息见 DialplateView.cppStartUpView.cpp 用agencyb_36渲染开机画面标题StatusBar.cpp 用bahnschrift_13渲染状态栏。这正对应原文档“将字体指针赋给样式的 text_font 字段”的用法。运行时加载字体lv_font_load可以从文件加载字体但该文件必须是 LVGL 专用的二进制格式不是 TTF 或 WOFF。使用lv_font_conv的--format bin选项生成 LVGL 兼容的字体文件。注意加载字体需要启用 LVGL 的文件系统filesystem并添加对应驱动参见 LVGL 的 file-system 概览。示例lv_font_t * my_font; my_font lv_font_load(X/path/to/my_font.bin); /*使用字体*/ /*不再需要时释放字体*/ lv_font_free(my_font);添加新的字体引擎LVGL 的字体接口设计得十分灵活你也可以用自研字体引擎替换 LVGL 内部实现。例如用 FreeType 从 TTF 字体实时渲染字形或用外部 Flash 存储字体位图、在库需要时读取。现成的 FreeType 集成可参考 lv_freetype 仓库。为此需要手工构造一个自定义lv_font_t变量/*描述字体的属性*/ lv_font_t my_font; my_font.get_glyph_dsc my_get_glyph_dsc_cb; /*设置获取字形信息的回调*/ my_font.get_glyph_bitmap my_get_glyph_bitmap_cb; /*设置获取字形位图的回调*/ my_font.line_height height; /*任意文本都能容纳的真实行高*/ my_font.base_line base_line; /*从行高顶部测量的基线*/ my_font.dsc something_required; /*存储任何实现相关数据*/ my_font.user_data user_data; /*可选的额外用户数据*/字形信息回调/* 获取 font 字体中 unicode_letter 的字形信息。 * 结果存到 dsc_out。 * 下一个字符unicode_letter_next可用于计算该字形所需宽度字距 kerning */ bool my_get_glyph_dsc_cb(const lv_font_t * font, lv_font_glyph_dsc_t * dsc_out, uint32_t unicode_letter, uint32_t unicode_letter_next) { /*你的代码*/ /* 存储结果例如…… */ dsc_out-adv_w 12; /*字形所需的水平空间单位 px*/ dsc_out-box_h 8; /*位图高度单位 px*/ dsc_out-box_w 6; /*位图宽度单位 px*/ dsc_out-ofs_x 0; /*位图的 X 偏移单位 px*/ dsc_out-ofs_y 3; /*从基线测量的 Y 偏移单位 px*/ dsc_out-bpp 2; /*每像素位数1/2/4/8*/ return true; /*true: 找到字形false: 未找到*/ }位图回调/* 从 font 获取 unicode_letter 的位图。 */ const uint8_t * my_get_glyph_bitmap_cb(const lv_font_t * font, uint32_t unicode_letter) { /* 你的代码 */ /* 位图应是连续位流每个像素由 bpp 位表示 */ return bitmap; /*未找到时返回 NULL*/ }使用字体回退Font Fallback可以在lv_font_t中指定fallback提供字体回退当字体找不到某个字母的字形时会交给fallback字体处理。fallback可以链式设置直到没有 fallback 为止。/* Roboto 字体不支持 CJK 字形 */ lv_font_t *roboto my_font_load_function(); /* Droid Sans Fallback 字形更多但字型不如 Roboto 好看 */ lv_font_t *droid_sans_fallback my_font_load_function(); /* 这样既能对支持的字符显示 Roboto又拥有更广的字符集覆盖 */ roboto-fallback droid_sans_fallback;源码层面lv_font_t结构体自带const struct _lv_font_t * fallback; /** Fallback font for missing glyph. Resolved recursively */字段见 lv_font.h且lv_font_glyph_dsc_t中的resolved_font字段记录了“处理 fallback 链后实际找到字形”的字体见 lv_font.h印证了 fallback 的递归解析机制。小结与 X-TRACK 实践要点bpp 权衡bpp 决定抗锯齿质量与内存开销的平衡1/2/4/8 可选4 倍于 1。X-TRACK 的五个自定义字体全部采用 bpp 4在码表大数字bahnschrift_65和状态栏小字bahnschrift_13上兼顾了显示质量。字符集规划LVGL 默认 UTF-8内置 Montserrat 系列仅覆盖 ASCII 少量符号若要显示 CJK、阿拉伯/波斯语需启用对应特殊字体或自行生成含目标字符范围的字体。资源管理在嵌入式项目中建议像 X-TRACK 一样将转换器生成的.c字体文件收编进统一的 ResourcePool通过名称引用避免散落的extern声明。内存与性能大字体优先压缩约慢 30% 但省内存亚像素渲染约需 3 倍内存且对像素通道排列有硬件要求运行时加载字体需开启文件系统并采用--format bin二进制格式。回退链借助fallback链可在主字体缺字时自动降级是混合字符集 UI 的重要设计手段。核心源码与配置参考lv_font.h字体结构定义、lv_conf.h字体/编码/BiDi 开关、ResourcePool.cpp字体注册与获取、Font转换器生成的字体源码、built_in_font内置字体生成脚本与源字体。赞分享智能硬件嵌入式硬件开发【免费下载链接】X-TRACKA GPS bicycle speedometer that supports offline maps and track recording项目地址https://gitcode.com/gh_mirrors/xt/X-TRACK点击查看免费下载相关推荐mkdocs-material 字体定制完全指南从 Google Fonts 配置到自托管与系统字体回退mkdocs material 字体定制完全指南从 Google Fonts 配置到自托管与系统字体回退 Material for MkDocs 原生集成 G前端文档模板引擎clip自定义字体配置从系统字体到自定义字体的完全指南clip自定义字体配置从系统字体到自定义字体的完全指南 想要让你的命令行图表脱颖而出吗clip 命令行图表工具的终极字体自定义功能能够彻底改变你的数据可视化Flet 字体实战指南系统字体、自定义字体导入与可变字体处理Flet 字体实战指南系统字体、自定义字体导入与可变字体处理 本文是 Flet 官方 Cookbook 中 Fonts 指南 https://link.git前端跨平台桌面应用移动开发上一篇DXVK终极配置手册从入门到精通下一篇Node.js 7.8.0 (Current) 版本发布全解析从 Notable Changes 到 SHASUMS 校验的完整指南创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考