How to apply different size font in theme?

How-to
1

Description

I use the LV_USE_THEME_MATERIAL theme, and set the font configuration in the configuration file lv_conf.h as follows:
#define LV_THEME_DEFAULT_INCLUDE <stdint.h> /Include a header for the init. function/

#define LV_THEME_DEFAULT_INIT               lv_theme_material_init
#define LV_THEME_DEFAULT_COLOR_PRIMARY      LV_COLOR_RED
#define LV_THEME_DEFAULT_COLOR_SECONDARY    LV_COLOR_BLUE
#define LV_THEME_DEFAULT_FLAG               LV_THEME_MATERIAL_FLAG_LIGHT
#define LV_THEME_DEFAULT_FONT_SMALL         &lv_font_montserrat_22
#define LV_THEME_DEFAULT_FONT_NORMAL        &lv_font_montserrat_24
#define LV_THEME_DEFAULT_FONT_SUBTITLE      &lv_font_montserrat_26
#define LV_THEME_DEFAULT_FONT_TITLE         &lv_font_montserrat_32

But when I run the program, all the fonts I use become the same size. such as lv_font_montserrat_32;

What MCU/Processor/Board and compiler are you using?

Arm

What LVGL version are you using?

V7.0

What do you want to achieve?

Apply different size font in theme.

What have you tried so far?

Code to reproduce

This is my code to set the label style：

            // style
            lv_style_init(&style_home_time_label);
            lv_style_set_text_color(&style_home_time_label, LV_STATE_DEFAULT, GUI_APP_WHITE);
            lv_style_set_bg_opa(&style_home_time_label, LV_STATE_DEFAULT, LV_OPA_1);
            lv_style_set_value_font(&style_home_time_label, LV_STATE_DEFAULT, lv_theme_get_font_title());

            lv_obj_t * label = lv_label_create(img, NULL);
            lv_label_set_text(label, "  01:45\n");
            lv_obj_add_style(label, LV_OBJ_PART_MAIN, &style_home_time_label);
            lv_obj_set_pos(label, 27, 32);
            lv_obj_set_size(label, 124, 70);
2

You’re only making use of lv_theme_get_font_title so it will always return LV_THEME_DEFAULT_FONT_TITLE.

3

Actually, I used these functions lv_theme_get_font_title ,lv_theme_get_font_normal,lv_theme_get_font_small and so…However, the screen displays the same size font.

4

Maybe you can try debugging to see if the values of font_small, font_normal, font_subtitle and font_title in the structure (lv_theme_t) are the same.

5

thank you~~,I will try it.

6

I have tried it, and when printing different fonts, the displayed information is different. Logically speaking, this setting is effective. But the font size displayed in the end is still the same, which makes me very confused.

8

Try the following code:

        // style
        lv_style_init(&style_home_time_label);
        lv_style_set_text_color(&style_home_time_label, LV_STATE_DEFAULT, GUI_APP_WHITE);
        lv_style_set_bg_opa(&style_home_time_label, LV_STATE_DEFAULT, LV_OPA_1);
        lv_style_set_text_font(&style_home_time_label, LV_STATE_DEFAULT, lv_theme_get_font_title());
        lv_obj_t * label = lv_label_create(img, NULL);
        lv_label_set_text(label, "  01:45\n");
        lv_obj_add_style(label, LV_LABEL_PART_MAIN, &style_home_time_label);
        lv_obj_set_pos(label, 27, 32);
        lv_obj_set_size(label, 124, 70);
9

Thank you , I try it.

10

Thank you very much.After using your code, the expected effect is achieved.

11

That’s great!