Please help to simulate removed lv_meter functionality in v9.2

hello.

so i used lvgl 8.3 version and created gauges, like this (simple meter) Meter (lv_meter) — LVGL documentation now in 9.2 its impossible for me to create a gauge with adjustable colored zones like measuring temperature. how to do this now? I can create working gauge, but not those colored zones.
Capture

Have you looked at lv_scale in version 9.2? There is an example that is similar to what you want to achieve.

Does that not work for you, or have you not seen that as a possibilty? I, too, had to recreate the lost lv_meter from v8.x.x in v9.x.x, and was able to do it with lv_arc and lv_scale

Yes i made perfect gauge using clock example( lv_scale), making tree different colored arcs is pain.

Ok, sooo - did you manage to do it?! Or is something not working? Trying to understand your post so I can offer help, but you need to be more specific about what isn’t working :slight_smile: It went from ‘impossible’ to ‘a pain’ so I guess progress is being made?!

i said is pain, not was pain haha. ok what i want is add one arc, but this one arc has 3 colours. Like in attachment.
3njwkb5hw7u91

1 Like

Screenshot 2024-10-22 at 4.41.01 PM

Produced by this:

static lv_style_t style_scaleNoLine;
  lv_style_init(&style_scaleNoLine);

  lv_style_set_arc_width(&style_scaleNoLine, 0);
  lv_style_set_line_width(&style_scaleNoLine, 0);

  //Scale
  lv_obj_t * scale = lv_scale_create(screen);
  lv_scale_set_label_show(scale, true);
  lv_scale_set_mode(scale, LV_SCALE_MODE_ROUND_INNER);     //Round, ticks on inside
  lv_scale_set_draw_ticks_on_top(scale, true);

  //Ticks
  lv_scale_set_total_tick_count(scale, 5);
  lv_scale_set_major_tick_every(scale, 4);
  lv_obj_set_style_length(scale, 15, LV_PART_INDICATOR);   //Major ticks
  lv_obj_set_style_length(scale, 15, LV_PART_ITEMS);       //Minor ticks

  //Main style
  lv_obj_set_style_radius(scale, LV_RADIUS_CIRCLE, LV_PART_MAIN | LV_STATE_DEFAULT);
  lv_obj_set_style_bg_color(scale, lv_color_white(), LV_PART_MAIN | LV_STATE_DEFAULT);

  //Add style remove outer border line of scale
  lv_obj_add_style(scale, &style_scaleNoLine, LV_PART_MAIN);

  //Add sections to color blue/green/red, width 15
  static lv_style_t style_first_section;
  lv_style_init(&style_first_section);
  lv_style_set_arc_color(&style_first_section, lv_palette_main(LV_PALETTE_BLUE));
  lv_style_set_arc_width(&style_first_section, 15);

  static lv_style_t style_mid_section;
  lv_style_init(&style_mid_section);
  lv_style_set_arc_color(&style_mid_section, lv_palette_main(LV_PALETTE_GREEN));
  lv_style_set_arc_width(&style_mid_section, 15);

  static lv_style_t style_end_section;
  lv_style_init(&style_end_section);
  lv_style_set_arc_color(&style_end_section, lv_palette_main(LV_PALETTE_RED));
  lv_style_set_arc_width(&style_end_section, 15);

  lv_scale_section_t * section_first = lv_scale_add_section(scale);
  lv_scale_section_set_range(section_first, -15, 35);
  lv_scale_section_set_style(section_first, LV_PART_MAIN, &style_first_section);
  lv_scale_section_set_style(section_first, LV_PART_INDICATOR, &style_first_section);
  lv_scale_section_set_style(section_first, LV_PART_ITEMS, &style_first_section);

  lv_scale_section_t * section_mid = lv_scale_add_section(scale);
  lv_scale_section_set_range(section_mid, 35, 50);
  lv_scale_section_set_style(section_mid, LV_PART_MAIN, &style_mid_section);
  lv_scale_section_set_style(section_mid, LV_PART_INDICATOR, &style_mid_section);
  lv_scale_section_set_style(section_mid, LV_PART_ITEMS, &style_mid_section);

  lv_scale_section_t * section_end = lv_scale_add_section(scale);
  lv_scale_section_set_range(section_end, 50, 90);
  lv_scale_section_set_style(section_end, LV_PART_MAIN, &style_end_section);
  lv_scale_section_set_style(section_end, LV_PART_INDICATOR, &style_end_section);
  lv_scale_section_set_style(section_end, LV_PART_ITEMS, &style_end_section);

  //Range and angle / rotation
  lv_scale_set_range(scale, -15, 90);
  lv_scale_set_rotation(scale, 150);
  lv_scale_set_angle_range(scale, 240);

  //Size and alignment
  lv_obj_set_size(scale, 180, 180);
  lv_obj_center(scale);

1 Like

Thanks for help, it worked!

1 Like