How to overstriking my font?


how to overstriking my font? should I first find a bold font ttf then convert it?

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

What do you want to achieve?

What have you tried so far?

Code to reproduce

Add a code snippet which can run in the simulator. It should contain only the relevant code that compiles without errors when separated from your main code base.

The code block(s) should be formatted like:

/*You code here*/

Screenshot and/or video

If possible, add screenshots and/or videos about the current state.


typedef struct {
  lv_label_ext_t label;
  bool overstrike;
} lv_label2_ext_t;

lv_design_cb_t ancestor_design;
bool lv_label2_design(lv_obj_t* label, const lv_area_t* mask, lv_design_mode_t mode);

lv_obj_t* lv_label2_create(lv_obj_t*par, lv_obj_t* copy){
  lv_obj_t* new_lb = lv_label_create(par, copy);
  lv_label2_ext_t *ext = (lv_label2_ext_t*) lv_obj_allocate_ext_attr(new_lb, sizeof(lv_label2_ext_t));
  ext->overstrike = false;

  if(ancestor_design==NULL) ancestor_design = lv_obj_get_design_cb(new_lb);
  lv_obj_set_design_cb(new_lb, lv_label2_design);
  return new_lb;

void lv_label2_set_overstrike(lv_obj_t* label, bool en)
  lv_label2_ext_t *ext = (lv_label2_ext_t*) lv_obj_get_ext_attr(label);
  ext->overstrike = !!en;

bool lv_label2_design(lv_obj_t* label, const lv_area_t* mask, lv_design_mode_t mode)
  if(mode == LV_DESIGN_COVER_CHK){
    return false;
  if(mode == LV_DESIGN_DRAW_MAIN){
    lv_label2_ext_t *ext = (lv_label2_ext_t*) lv_obj_get_ext_attr(label);
    ancestor_design(label, mask, mode);
    if(ext->overstrike) {
      lv_style_t* style = (lv_style_t*) lv_obj_get_style(label);
      lv_point_t p1, p2;
      p1.x = label->coords.x1; p1.y = label->coords.y1 + style->text.font->line_height/2;
      p2.x = label->coords.x2; p2.y = p1.y;
      lv_draw_line(&p1, &p2, mask, style, LV_OPA_COVER);
  return true;


  static lv_style_t style; lv_style_copy( &style, &lv_style_plain);
    style.text.color = LV_COLOR_WHITE;      // Text Color
    style.line.color = style.text.color;    // OverStrike Color
    style.line.width = 2;                   // OverStrike Thickness
  lv_obj_t* label = lv_label2_create(lv_scr_act(),NULL);
    lv_obj_set_style(label, &style);
    lv_label2_set_overstrike(label, true);  // Enable OverStrike
    lv_label_set_text(label, "Hello World.");
    lv_obj_align(label, NULL, LV_ALIGN_CENTER, 0,0);  




Beautiful and professional solution!

1 Like

Perhaps we should add the ability to strikeout text on labels. It doesn’t seem like it would be that complex.


It’s cause of amazing c inheritance technic in your littlevgl’s core!

Agree that. Both the ability to strikeout and underline for labels.

emm, I’m sorry that I didn’t make myself clear. If I add a new font A, then I want to make the font bold, how to achieve it, it’s no need to draw a line.Like this I want make letter “A” turn to “A

You must use TrueType Bold font to convert at littlevgl’s online TTF converter

and declare to the littlevgl before use new font.

Why not!
There can be a style.label.strike_y property which draws a line on the given y position with style.line style. It can be used underline texts too.

What do you think?

IMO it would be nicer to just have a flag that enables strikeout/underline and calculates the position automatically. For strikeout we could just use half the height of the character and for the underline we could put it right below the character.

I agree, strike_y really would overcomplicate things.
I’ve added it to dev-7.0 todo list