Tips ： This blog serves as a learning note , If there are mistakes, I hope to correct them

One 、Label brief introduction

1.1 summary Overview

   Labels are the basic object types used to display text .

1.2 Part and style Parts and Styles

• LV_PART_MAIN Use all typical background and text attributes . Fill values can be used to add spaces between text and background .
• LV_PART_SCROLLBAR Scroll bar displayed when the text is larger than the size of the widget ..
• LV_PART_SELECTED Tell the style of the selected text . Only use text_color and bg_color Style attribute .

1.3 Use Usage

1.3.1 Set text Set text

   You can use... At run time lv_label_set_text(label,“New text”) Set the text on the label . It will dynamically allocate a buffer , The supplied string will be copied into the buffer . therefore , After the function returns , You do not need to pass to lv_label_set_text The text of is kept within the scope .
   Use lv_label_set_text_fmt(label, “Value: %d”, 15) have access to printf Formatting text ..
   The tag can display text from the static character buffer . So , Use lv_label_set_text_static(label,“Text”). under these circumstances , Text is not stored in dynamic memory , Instead, use the given buffer directly . This means that the array cannot be a local variable outside the scope when the function exits . Constant string and lv_label_set_text_static It is safe to use together ( Unless LV_LABEL_LONG_DOT Use it together , Because it modifies the buffer in place ), Because they are stored in ROM In the memory , It is always accessible .

1.3.2 New line New line

   The new line character consists of label Object automatic processing . You can use it. \n To wrap . for example :“line1 \ nline2 \ n \ nline4”

1.3.3 Long model Long modes

   By default , The width and height of the label are set to lv_size_content, Therefore, the size of the label automatically expands to the text size . otherwise , If you explicitly set the width or height ( For example, using lv_obj_set_width Or layout ), Lines wider than the label width can be manipulated according to several long mode strategies . Similarly , If the height of the text is greater than the height of the label , You can also apply these strategies .
   Implementation function void lv_label_set_long_mode(lv_obj_t * obj, lv_label_long_mode_t long_mode);

/** Long mode behavior . be used for lv_label_ext_t * / LV_LABEL_LONG_WRAP, /**< Keep the object width , Wrap a line that is too long , Expand object height */
LV_LABEL_LONG_DOT, 			/**< Keep size , If the text is too long , Write a dot at the end */
LV_LABEL_LONG_SCROLL, 			/**< Keep the text size and scroll back and forth */
LV_LABEL_LONG_SCROLL_CIRCULAR, /**< Keep the size and cycle through the text */
LV_LABEL_LONG_CLIP, 			/**< Keep the size and clip the text */

   Please note that ,LV_LABEL_LONG_DOT Manipulate the text buffer in place , In order to add / Delete point .
When using lv_label_set_text or lv_label_set_array_text when , A separate buffer will be allocated , And don't notice the implementation details .lv_label_set_text_static Not so . If you plan to use LV_LABEL_LONG_DOT, Pass to
lv_label_set_text_static The buffer must be writable .

1.3.4 Recolor the text Text recolor

   Implementation function void lv_label_set_recolor(lv_obj_t * obj, bool en); After the re coloring of the font is turned on, the color display format of the font can be set to #0000ff Re-color#, Use “# # ” There should be font color parameters and display content in the middle among “0000ff” Express Hex Color table in format , Can be extracted from online web pages “ Re-color” Represents the content to be displayed and recolored .

1.3.5 The choice of text Text selection

   If you pass LV_LABEL_TEXT_SELECTION Enable , You can select part of the text . It's similar to being in PC Use the mouse to select text . Whole mechanzim( Click and select the text , You drag with your fingers / mouse ) In the text area and label implemeted Components only allow text selection and selection of manually manufactured parts lv_label_get_text_selection_start( label ,start_char_index) and lv_label_get_text_selection_start(label,end_char_index)

1.3.6 A long text Very long texts

  LVGL Can effectively handle very long ( for example > 40k character ), By saving some extra data (~12 byte ) To speed up drawing . stay lv_conf.h Set in LV_LABEL_LONG_TXT_HINT 1 This feature can be enabled .

1.3.7 Symbol Symbols

   Labels can display symbols next to letters ( Or display the symbol itself ). Read the font section to learn more about symbols

1.4 event Events

   Send any special events .

1.5 Key Keys

   The object type does not handle any key.

   This time is mainly about lvgl Of Label,Label( label ) Is the basic object type used to display text . Can be set by Label So as to achieve different ways of font display , The font can be displayed in the center or aligned to the left , Align right , It can also realize the scrolling display of text, clip text, recolor font and other operations .

3、 ... and 、Label API

Where is the alignment of the font
lv_obj_set_style_base_dir(rtl_label, LV_BASE_DIR_LTR, 0);

LV_BASE_DIR_LTR     // Right alignment  
LV_BASE_DIR_RTL     // Align left  
LV_BASE_DIR_AUTO    // Automatically  

lv_obj_t * lv_label_create(lv_obj_t * parent);									// Create a label object 
void lv_label_set_text(lv_obj_t * obj, const char * text);						// Set a new text for the label . Memory will be allocated to labels that store text .
void lv_label_set_text_fmt(lv_obj_t * obj, const char * fmt, ...) LV_FORMAT_ATTRIBUTE(2, 3);// Set a new formatted text for the label . Memory will be allocated to labels that store text .
void lv_label_set_text_static(lv_obj_t * obj, const char * text);				// Set static text . It will not be saved by the tag , therefore 'text' The variable must be “ Alive ”, And labels exist .
void lv_label_set_long_mode(lv_obj_t * obj, lv_label_long_mode_t long_mode);	// Set the behavior of labels whose text length is greater than the size of the object 
void lv_label_set_recolor(lv_obj_t * obj, bool en);								// Enable recolor via inline command 
void lv_label_set_text_sel_start(lv_obj_t * obj, uint32_t index);				// Set where text selection should start 
void lv_label_set_text_sel_end(lv_obj_t * obj, uint32_t index);					// Set the end position of the text selection 
char * lv_label_get_text(const lv_obj_t * obj);									// Get the text of the tag 
lv_label_long_mode_t lv_label_get_long_mode(const lv_obj_t * obj);				// Gets the long pattern of the tag 
bool lv_label_get_recolor(const lv_obj_t * obj);								// Get the recolor attribute 
void lv_label_get_letter_pos(const lv_obj_t * obj, uint32_t char_id, lv_point_t * pos);		// Get the relative of a letter x and y coordinate 
uint32_t lv_label_get_letter_on(const lv_obj_t * obj, lv_point_t * pos_in);		// Get the letter index on the relative position of the label .
bool lv_label_is_char_under_pos(const lv_obj_t * obj, lv_point_t * pos);		// Check whether characters are drawn under dots .
uint32_t lv_label_get_text_selection_start(const lv_obj_t * obj);				// Get the selected starting index .
uint32_t lv_label_get_text_selection_end(const lv_obj_t * obj);					// Get select end index .
void lv_label_ins_text(lv_obj_t * obj, uint32_t pos, const char * txt);			// Insert a text into the label . Label text cannot be static .
void lv_label_cut_text(lv_obj_t * obj, uint32_t pos, uint32_t cnt);				// Remove characters from labels . Label text cannot be static .

Four 、 Example

4.1 Show individual font colors

   Example 1 Realize the basic amount Label Show , Realize the font color re coloring and the scrolling display of the font .

/************************************************* *  The name of the function  : Label_show_1  Achieve basic label Display of  *  ginseng   Count  ：  nothing  *  The functionality  ：  Achieve basic label Display of  *************************************************/
void Label_show_1()
{
    
   lv_obj_t * label1 = lv_label_create(lv_scr_act());          // establish label object  
   lv_label_set_long_mode(label1,LV_LABEL_LONG_WRAP);          // Set up label longmode
   lv_label_set_recolor(label1,true);                          // Set up label  Recolor 
   lv_label_set_text(label1,"#0000ff Re-color# #ff00ff words# #ff0000 of a# label,align the lines to center "
                            "and wrap long text automatically"); // Set up label typeface 
   lv_obj_set_width(label1,150);                               // Set the object width 
   lv_obj_set_style_text_align(label1,LV_TEXT_ALIGN_CENTER,0); // Set the object font style to center 
   lv_obj_align(label1,LV_ALIGN_CENTER,0,-40);                 // Center the object 

   lv_obj_t * label2 = lv_label_create(lv_scr_act());          // establish label object  
   lv_label_set_long_mode(label2,LV_LABEL_LONG_SCROLL_CIRCULAR); // Set up label longmode
   lv_obj_set_width(label2,150);                               // Set the object width 
   lv_label_set_text(label2,"It is a circularly scrolling text");// Set up label typeface 
   lv_obj_align(label2,LV_ALIGN_CENTER,0,40);                  // Center the object 
}

4.2 Font blur effect

   Example 2 Mainly through , The effect of fuzzy font display is realized by displaying the transparency and relative position of the font .

/************************************************* *  The name of the function  : Label_show_2 *  ginseng   Count  ：  nothing  *  The functionality  ：  Use different transparency and relative center to realize the effect of fuzzy shadow display  *************************************************/
void Label_show_2()
{
    
   static lv_style_t style_shadow;                          // Create styles  
   lv_style_init(&style_shadow);                            // Initialize style  

   lv_style_set_text_opa(&style_shadow,LV_OPA_30);          // Set the font transparency of the style 
   lv_style_set_text_color(&style_shadow,lv_color_black()); // Set style font color 

   lv_obj_t * shadow_label = lv_label_create(lv_scr_act()); // Create shadows label
   lv_obj_add_style(shadow_label,&style_shadow,0);          // add to label The style of 

   lv_obj_t * main_label = lv_label_create(lv_scr_act());   // Create master label
   lv_label_set_text(main_label, "A simple method to create\n"
                                 "ahadows on a text.\n"
                                 "It even works with\n\n"
                                 "newlines and spaces.");// Set the main style font 
   lv_label_set_text(shadow_label,lv_label_get_text(main_label)); // Set shadow style font  lv_label_get_text(main_label) obtain label The word content of the object 

   lv_obj_align(main_label,LV_ALIGN_CENTER,0,0);            // The main style is centered 
   lv_obj_align_to(shadow_label,main_label,LV_ALIGN_TOP_LEFT,2,2); // Relative position display 
}

4.3 Display custom Fonts

   Example 3 It mainly realizes the display of custom Fonts , Realize the display of specific Chinese or other words , Font display can be realized without loading font library , What I use here is LvglFontTool.exe , And then in CMakeLists.txt Add the corresponding... To the document .c file , Then add the header file containing the font in our test file , What needs to be modified is in the generated .c Add a suitable... In the file lvgl.h The file of , There will be errors when compiling , This should be because the software has not been adapted yet LVGL8 Font display specifications , We can comment out the contents of the compilation errors .


   Finally, the path of test font is introduced into the document we want to implement , Set up directly label Just display the font .

   LV_FONT_DECLARE(HelloESP32)                                 	// Load font path 
   lv_label_set_text(cz_label, " Hello ！ Lexin , I've been using ESP32 run LVGL, Wish me luck ！");   // Set display font 
   lv_obj_set_style_text_font(cz_label,&HelloESP32,0);        	// Set the display style 

/************************************************* *  The name of the function  : Label_show_3 *  ginseng   Count  ：  nothing  *  The functionality  ：  Show other Fonts  *************************************************/
void Label_show_3()
{
    
   lv_obj_t * ltr_label = lv_label_create(lv_scr_act());             // Create master label
   lv_label_set_text(ltr_label, "In modern terminology, a microcontroller is similar to a system on a chip (SoC).");    // Set word content 
   lv_obj_set_style_text_font(ltr_label, &lv_font_montserrat_16, 0); // Set style content 
   lv_obj_set_width(ltr_label, 310);                                 // Set the width of the object 
   lv_obj_align(ltr_label, LV_ALIGN_TOP_LEFT, 5, 5);                 // Top left center 

   lv_obj_t * rtl_label = lv_label_create(lv_scr_act());             // Create master label
   lv_label_set_text(rtl_label, "מעבד, או בשמו המלא יחידת עיבוד מרכזית (באנגלית: CPU - Central Processing Unit)."); // Set word content 
   lv_obj_set_style_base_dir(rtl_label,LV_BASE_DIR_RTL,0);           // Set style content 
   lv_obj_set_style_text_font(rtl_label,&lv_font_dejavu_16_persian_hebrew,0); // Set the width of the object 
   lv_obj_set_width(rtl_label,310);                                  // Set the width of the object 
   lv_obj_align(rtl_label,LV_ALIGN_LEFT_MID,5,0);                    // Top left center 

   lv_obj_t * cz_label = lv_label_create(lv_scr_act());             // Create master label
   
   LV_FONT_DECLARE(HelloESP32)                                 		// Load font path 
   lv_label_set_text(cz_label, " Hello ！ Lexin , I've been using ESP32 run LVGL, Wish me luck ！");   // Set display font 
   lv_obj_set_style_text_font(cz_label,&HelloESP32,0);         		// Set the display style 

   lv_obj_set_width(cz_label,240);                                   // Set the object width 
   lv_obj_align(cz_label,LV_ALIGN_BOTTOM_LEFT,5,-5);                 // centered 
}

   Note: the picture here shows that it has been verified on the development board