当前位置：首页 > news >正文

luatos框架中LVGL如何使用中文字体〈二〉编写脚本设置中文字体

news 2025/9/17 17:23:51

本节内容，将和大家一同学习，在luatos环境中，使用lvgl库，一步步的编译固件、编写脚本，最终实现中文字体的显示。
芯片：AIR101
LCD屏：ST7789

上一节，我们一同学习了，硬件引脚具体的接法，硬件连接好了，接下来，就是见证奇迹（编写脚本，操控LCD屏显示内容）的时刻了。

第一步：先初始化外部硬件（让芯片知道增加了一个外部硬件）

LCD屏，肯定是属于LCD库的操控权限内，所以我们找到LUATOS文档中，lcd驱动模块
在这里插入图片描述
接下来的第一步，就是初始化设备了，函数参数，文档里写得很清楚，咱们就不再赘述了
初始化参数中，注意:lcd初始化之前需要先初始化spi

local spi_lcd = spi.deviceSetup(0, pin.PB04, 0, 0, 8, 20 * 1000 * 1000, spi.MSB, 1, 1)

lcd.init("st7789",{port = "device",pin_dc = pin.PB01,pin_pwr = pin.PB00,pin_rst = pin.PB03,direction = 0,w = 240,h = 320,xoffset = 0,yoffset = 0},spi_lcd)

要想让屏显示内容，必须要先让屏工作起来，亮起来。所以我们把背光点亮

pwm.open(0,1000,50,0,100)
lcd.on()  --这句可加可不加，初始状态，就会亮起来

到这里，LCD屏就准备就绪了，接下来就是LVGL库的使用了

第二步：先了解luatos LVGL库的使用方法

与上面LCD模块初始化同理，使用LVGL也需要先做初始化

lvgl.init()

今天我们主要是学习如何显示中文内容
1、先基于LVGL画布创建一个按钮

local btn2 = lvgl.btn_create(lvgl.scr_act(), nil)

2、设置按钮的位置，LVGL官方源码中是支持多种位置的，比如ALIGN_TOP_MID，ALIGN_LEFT_MID,但是好像LustOS的LVGL库中，并没有支持，至少我使用ALIGN_TOP_MID的时候，会报错

lvgl.obj_align(btn2, nil, lvgl.ALIGN_CENTER, 0,0)

3、给按钮添加文字前，先要基于按钮创建一个标签，标签才可以显示文字

label = lvgl.label_create(btn2, nil)

4、给标签设置文字,如果是英文字符，就可以使用默认字体，直接显示了

lvgl.label_set_text(label, "hello world")

5、设置中文字体，直接使用中文，按钮将不显示任何文字

lvgl.label_set_text(label, "中国制造")

第三步、重点来了，如何显示中文字体（仅限luatos环境中）

1、因为芯片的固件中，为了固件的大小考虑，并没有加入中文字体，所以我们要先重新编译一个带有中文字体的固件。
注意两个红框的地方，先要正确选择芯片型号，另外要保证固件大小
在这里插入图片描述
除了上图中基础的要选择以外，下面是本次测试要用到的东西

最最重要的，就是上图，因为我们现在用的是LVGL库，所以必须要选择LVGL库专用字体，在这里为了照顾固件的大小，选择了10PIX字号的

第三步，给label标签设置文字，使期支持中文字体

先看一下lustos 文档
在这里插入图片描述
到这里，如果直接使用示例中的代码，你会发现仍然不会显示文字
问题有两点：
1）lvgl.font_get(“opposans_m_12”)，示例中使用的字体是12号的，我们添加到固件是10号的，正确应该lvgl.font_get(“opposans_m_10”)
2）最后一句lvgl.scr_load(screen_label)，这里会导致整个屏，不显示任何内容，正确应该是重新加载整个画板：lvgl.scr_load(lvgl.scr_act()),这一句不加也可以

重新回到我们自己的脚本代码中，具体给标签设置中文的代码如下
第二步中，我们已经创建了标签，也设置了标签的内容，现在只需要给标签增加样式就可以了

local label_style = lvgl.style_create() --创建一个样式对象
log.info("set_text_style",lvgl.style_set_text_font(label_style,lvgl.STATE_DEFAULT, lvgl.font_get("opposans_m_10"))) --设置使用的字体
log.info("add style",lvgl.obj_add_style(label, lvgl.LABEL_PART_MAIN, label_style))
--把样式增加到标签label

在这里插入图片描述
最后，送上完整的脚本代码，仅供参考

PROJECT = "air101_test"
VERSION = "1.0.1"
sys = require "sys"
local spi_lcd = spi.deviceSetup(0, pin.PB04, 0, 0, 8, 20 * 1000 * 1000, spi.MSB, 1, 1)
log.info("lcd.init",lcd.init("st7789",{port = "device",pin_dc = pin.PB01,pin_pwr = pin.PB00,pin_rst = pin.PB03,direction = 0,w = 240,h = 320,xoffset = 0,yoffset = 0},spi_lcd)
)
pwm.open(0,1000,50,0,100)
-- lcd.on()
log.info("lvgl_init",lvgl.init())
local label
local btn2 = lvgl.btn_create(lvgl.scr_act(), nil)
lvgl.obj_align(btn2, nil, lvgl.ALIGN_CENTER, 0,0)
label = lvgl.label_create(btn2, nil)
local str = "中国制造#"
lvgl.label_set_text(label, str)
log.info("set_text_style",lvgl.style_set_text_font(label_style,lvgl.STATE_DEFAULT, lvgl.font_get("opposans_m_10")))
log.info("add style",lvgl.obj_add_style(label, lvgl.LABEL_PART_MAIN, label_style))
--vgl.scr_load(lvgl.scr_act())