Can you optimize the color wheel control?

When using the color wheel, it is very bad, the color gradient transition is uneven.

ui_Colorwheel = lv_colorwheel_create(ui_led_ctrl_page, true);

    lv_obj_set_width(ui_Colorwheel, 280);
    lv_obj_set_height(ui_Colorwheel, 280);

    lv_obj_set_x(ui_Colorwheel, 0);
    lv_obj_set_y(ui_Colorwheel, 120);

    lv_obj_set_align(ui_Colorwheel, LV_ALIGN_TOP_MID);

    lv_obj_set_style_arc_width(ui_Colorwheel, 40, LV_PART_MAIN | LV_STATE_DEFAULT);

    lv_obj_set_style_border_color(ui_Colorwheel, lv_color_hex(0xFFFFFF), LV_PART_KNOB | LV_STATE_DEFAULT);
    lv_obj_set_style_opa(ui_Colorwheel, 255, LV_PART_KNOB | LV_STATE_DEFAULT);
    lv_obj_set_style_border_opa(ui_Colorwheel, 255, LV_PART_KNOB | LV_STATE_DEFAULT);
    lv_obj_set_style_border_width(ui_Colorwheel, 2, LV_PART_KNOB | LV_STATE_DEFAULT);
    lv_obj_set_style_pad_all(ui_Colorwheel, 0, LV_PART_KNOB | LV_STATE_DEFAULT);

It’s not the most elegant solution, but you can edit LV_CPICKER_DEF_QF in lv_colorwheel.c. Setting it to 1 gives to best resolution but also requires more time to redraw.

Probably you also need to increase line_dsc.width += 2; in draw_disc_grad if there are gaps between the lines.

1 Like

ok i’ll try it, thank you very much for your reply.

I tried it, but it still doesn’t work, what is the best solution?

tried it : line_dsc.width += 2;
the gap is gone, and the effect has been significantly improved.
but the transition is still layered.

The only option I can imagine is using a background image instead of a software rendered gradient.

It seems like a simple update but I’m quite busy with some projects and can not deal with it now. :frowning:

However we have a widget development service exactly for this kind of cases. Please contact me at [email protected], so that we can cooperate in professional way.

1 Like

Thank you for your reply, now the color wheel has reached the desired effect.
I will contact you when custom parts are needed. thank you very much!