LVGL9.5 设置 label 长文本自动换行

说明

  • LVGL 9.5 版本(当前最新)

  • label 作为文本显示,可能内容会很长,需要设置 label 文本过长后自动换行的功能

  • 设置 lv_label_set_long_mode(label, LV_LABEL_LONG_MODE_WRAP); 后,发现 label 文本没有自动换行,有了滚动条,如下

自动换行

  • 解决方法:还需要设置 label 的宽度 width

  • 比如 lv_obj_set_width(label, 500);

示例如下

c 复制代码
/**
 * Load a font with FreeType
 */
void lv_example_freetype_1(void)
{
    /*Create a font*/
    lv_font_t * font = lv_freetype_font_create(/* "D:../lvgl/examples/libs/freetype/Lato-Regular.ttf", */
                                    "D:../apps/fonts/HYQIHEI-55J.ttf",
                                               LV_FREETYPE_FONT_RENDER_MODE_BITMAP,
                                               24,
                                               LV_FREETYPE_FONT_STYLE_NORMAL);

    if(!font) {
        LV_LOG_ERROR("freetype font create failed.");
        return;
    }

    /*Create style with the new font*/
    static lv_style_t style;
    lv_style_init(&style);
    lv_style_set_text_font(&style, font);
    lv_style_set_text_align(&style, LV_TEXT_ALIGN_CENTER);

    /*Create a label with the new style*/
    lv_obj_t * label = lv_label_create(lv_screen_active());
    lv_obj_add_style(label, &style, 0);
    lv_label_set_text(label, "大家好!!Hello world!I'm a font created with FreeType!"
        "lv_log_register_print_cb 可以设置 LVGL 的打印回调函数!");
    lv_label_set_long_mode(label, LV_LABEL_LONG_MODE_WRAP);
    lv_obj_set_width(label, 500);
    lv_obj_center(label);
}

显示效果

小结

  • 先设置好 label 的宽度 width,再设置自动换行(LV_LABEL_LONG_MODE_WRAP)即可
c 复制代码
    lv_label_set_long_mode(label, LV_LABEL_LONG_MODE_WRAP);
    lv_obj_set_width(label, 500);
相关推荐
map_3d_vis14 天前
JSAPIThree 标签使用学习笔记:在地图上添加文字和图标
学习笔记·标签·label·初学者·mapvthree·jsapithree·文字标签·图标标签
学嵌入式的长路16 天前
正点原子imx6ull移植lvgl v8.3及触摸屏调试
linux·驱动开发·lvgl·imx6ull·触摸屏
sayang_shao18 天前
STM32 F4移植LVGL 9.4.0版本教程(Keil工程,裸机)
stm32·gui·lvgl
xiaohai@Linux1 个月前
STM32在LVGL上实现移植FatFs文件系统(保姆级详细教程)
stm32·单片机·嵌入式硬件·lvgl·fatfs
YouEmbedded1 个月前
解码LVGL样式
linux·lvgl·lvgl样式
Industio_触觉智能2 个月前
重大更新,LVGL有UI编辑器用了
lvgl·瑞芯微·rk3506·lvgl pro·ui编辑器
jz_ddk2 个月前
[LVGL] 从0开始,学LVGL:进阶应用与项目实战(上)
linux·信息可视化·嵌入式·gui·lvgl·界面设计
jz_ddk2 个月前
[LVGL] 从0开始,学LVGL:基础构建篇 - 掌握UI的核心构建块
linux·网络协议·ui·rpc·嵌入式·gui·lvgl
SundayBear2 个月前
LVGL 开发指南:从入门到精通的嵌入式 GUI 实战心法
单片机·嵌入式·lvgl