github-code/lvgl
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(scale): add the lv_scale widget (#4196)

Browse Source 
Co-authored-by: Gabor Kiss-Vamosi <kisvegabor@gmail.com>
This commit is contained in:
Carlos Diaz
2023-08-31 07:09:40 -06:00
committed by GitHub
parent ca54d127c2
commit 5c1fc63647
18 changed files with 1855 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
examples/widgets/lv_example_widgets.h
View File

@@ -115,6 +115,12 @@ void lv_example_roller_1(void);
void lv_example_roller_2(void);
//void lv_example_roller_3(void);
void lv_example_scale_1(void);
void lv_example_scale_2(void);
void lv_example_scale_3(void);
void lv_example_scale_4(void);
void lv_example_scale_5(void);
void lv_example_slider_1(void);
void lv_example_slider_2(void);
void lv_example_slider_3(void);

6
examples/widgets/scale/index.rst Normal file
View File

@@ -0,0 +1,6 @@
Scale with customized section style
""""""""""""""""
.. lv_example:: widgets/scale/lv_example_scale_1
:language: c

24
examples/widgets/scale/lv_example_scale_1.c Normal file
View File

@@ -0,0 +1,24 @@
#include "../../lv_examples.h"
#if LV_USE_SCALE && LV_BUILD_EXAMPLES
/**
* A simple horizontal scale
*/
void lv_example_scale_1(void)
{
lv_obj_t * scale = lv_scale_create(lv_scr_act());
lv_obj_set_size(scale, lv_pct(80), 100);
lv_scale_set_mode(scale, LV_SCALE_MODE_HORIZONTAL_BOTTOM);
lv_obj_center(scale);
lv_scale_set_label_show(scale, true);
lv_scale_set_total_tick_count(scale, 30);
lv_scale_set_major_tick_every(scale, 5);
lv_scale_set_major_tick_length(scale, 10);
lv_scale_set_minor_tick_length(scale, 5);
lv_scale_set_range(scale, 10, 40);
}
#endif

83
examples/widgets/scale/lv_example_scale_2.c Normal file
View File

@@ -0,0 +1,83 @@
#include "../../lv_examples.h"
#if LV_USE_SCALE && LV_BUILD_EXAMPLES
/**
* An vertical scale with section and custom styling
*/
void lv_example_scale_2(void)
{
lv_obj_t * scale = lv_scale_create(lv_scr_act());
lv_obj_set_size(scale, 60, 200);
lv_scale_set_label_show(scale, true);
lv_scale_set_mode(scale, LV_SCALE_MODE_VERTICAL_RIGHT);
lv_obj_center(scale);
lv_scale_set_total_tick_count(scale, 20);
lv_scale_set_major_tick_every(scale, 5);
lv_scale_set_major_tick_length(scale, 10);
lv_scale_set_minor_tick_length(scale, 5);
lv_scale_set_range(scale, 0, 100);
static char * custom_labels[] = {"0 °C", "25 °C", "50 °C", "75 °C", "100 °C", NULL};
lv_scale_set_text_src(scale, custom_labels);
static lv_style_t indicator_style;
lv_style_init(&indicator_style);
/* Label style properties */
lv_style_set_text_font(&indicator_style, &lv_font_montserrat_14);
lv_style_set_text_color(&indicator_style, lv_palette_darken(LV_PALETTE_BLUE, 3));
/* Major tick properties */
lv_style_set_line_color(&indicator_style, lv_palette_darken(LV_PALETTE_BLUE, 3));
lv_style_set_width(&indicator_style, 10U); /*Tick length*/
lv_style_set_line_width(&indicator_style, 2U); /*Tick width*/
lv_obj_add_style(scale, &indicator_style, LV_PART_INDICATOR);
static lv_style_t minor_ticks_style;
lv_style_init(&minor_ticks_style);
lv_style_set_line_color(&minor_ticks_style, lv_palette_lighten(LV_PALETTE_BLUE, 2));
lv_style_set_width(&minor_ticks_style, 5U); /*Tick length*/
lv_style_set_line_width(&minor_ticks_style, 2U); /*Tick width*/
lv_obj_add_style(scale, &minor_ticks_style, LV_PART_ITEMS);
static lv_style_t main_line_style;
lv_style_init(&main_line_style);
/* Main line properties */
lv_style_set_line_color(&main_line_style, lv_palette_darken(LV_PALETTE_BLUE, 3));
lv_style_set_line_width(&main_line_style, 2U); // Tick width
lv_obj_add_style(scale, &main_line_style, LV_PART_MAIN);
/* Add a section */
static lv_style_t section_minor_tick_style;
static lv_style_t section_label_style;
static lv_style_t section_main_line_style;
lv_style_init(&section_label_style);
lv_style_init(&section_minor_tick_style);
lv_style_init(&section_main_line_style);
/* Label style properties */
lv_style_set_text_font(&section_label_style, &lv_font_montserrat_14);
lv_style_set_text_color(&section_label_style, lv_palette_darken(LV_PALETTE_RED, 3));
lv_style_set_line_color(&section_label_style, lv_palette_darken(LV_PALETTE_RED, 3));
lv_style_set_line_width(&section_label_style, 5U); /*Tick width*/
lv_style_set_line_color(&section_minor_tick_style, lv_palette_lighten(LV_PALETTE_RED, 2));
lv_style_set_line_width(&section_minor_tick_style, 4U); /*Tick width*/
/* Main line properties */
lv_style_set_line_color(&section_main_line_style, lv_palette_darken(LV_PALETTE_RED, 3));
lv_style_set_line_width(&section_main_line_style, 4U); /*Tick width*/
/* Configure section styles */
lv_scale_section_t * section = lv_scale_add_section(scale);
lv_scale_section_set_range(section, 80, 100);
lv_scale_section_set_style(section, LV_PART_INDICATOR, &section_label_style);
lv_scale_section_set_style(section, LV_PART_ITEMS, &section_minor_tick_style);
lv_scale_section_set_style(section, LV_PART_MAIN, &section_main_line_style);
}
#endif

27
examples/widgets/scale/lv_example_scale_3.c Normal file
View File

@@ -0,0 +1,27 @@
#include "../../lv_examples.h"
#if LV_USE_SCALE && LV_BUILD_EXAMPLES
/**
* A simple round scale
*/
void lv_example_scale_3(void)
{
lv_obj_t * scale = lv_scale_create(lv_scr_act());
lv_obj_set_size(scale, 150, 150);
lv_scale_set_mode(scale, LV_SCALE_MODE_ROUND_INNER);
lv_obj_set_style_bg_opa(scale, LV_OPA_COVER, 0);
lv_obj_set_style_bg_color(scale, lv_palette_lighten(LV_PALETTE_RED, 5), 0);
lv_obj_set_style_radius(scale, LV_RADIUS_CIRCLE, 0);
lv_obj_center(scale);
lv_scale_set_label_show(scale, true);
lv_scale_set_total_tick_count(scale, 30);
lv_scale_set_major_tick_every(scale, 5);
lv_scale_set_major_tick_length(scale, 10);
lv_scale_set_minor_tick_length(scale, 5);
lv_scale_set_range(scale, 10, 40);
}
#endif

83
examples/widgets/scale/lv_example_scale_4.c Normal file
View File

@@ -0,0 +1,83 @@
#include "../../lv_examples.h"
#if LV_USE_SCALE && LV_BUILD_EXAMPLES
/**
* A round scale with section and custom styling
*/
void lv_example_scale_4(void)
{
lv_obj_t * scale = lv_scale_create(lv_scr_act());
lv_obj_set_size(scale, 150, 150);
lv_scale_set_label_show(scale, true);
lv_scale_set_mode(scale, LV_SCALE_MODE_ROUND_OUTTER);
lv_obj_center(scale);
lv_scale_set_total_tick_count(scale, 20);
lv_scale_set_major_tick_every(scale, 5);
lv_scale_set_major_tick_length(scale, 10);
lv_scale_set_minor_tick_length(scale, 5);
lv_scale_set_range(scale, 0, 100);
static char * custom_labels[] = {"0 °C", "25 °C", "50 °C", "75 °C", "100 °C", NULL};
lv_scale_set_text_src(scale, custom_labels);
static lv_style_t indicator_style;
lv_style_init(&indicator_style);
/* Label style properties */
lv_style_set_text_font(&indicator_style, &lv_font_montserrat_14);
lv_style_set_text_color(&indicator_style, lv_palette_darken(LV_PALETTE_BLUE, 3));
/* Major tick properties */
lv_style_set_line_color(&indicator_style, lv_palette_darken(LV_PALETTE_BLUE, 3));
lv_style_set_width(&indicator_style, 10U); /*Tick length*/
lv_style_set_line_width(&indicator_style, 2U); /*Tick width*/
lv_obj_add_style(scale, &indicator_style, LV_PART_INDICATOR);
static lv_style_t minor_ticks_style;
lv_style_init(&minor_ticks_style);
lv_style_set_line_color(&minor_ticks_style, lv_palette_lighten(LV_PALETTE_BLUE, 2));
lv_style_set_width(&minor_ticks_style, 5U); /*Tick length*/
lv_style_set_line_width(&minor_ticks_style, 2U); /*Tick width*/
lv_obj_add_style(scale, &minor_ticks_style, LV_PART_ITEMS);
static lv_style_t main_line_style;
lv_style_init(&main_line_style);
/* Main line properties */
lv_style_set_arc_color(&main_line_style, lv_palette_darken(LV_PALETTE_BLUE, 3));
lv_style_set_arc_width(&main_line_style, 2U); /*Tick width*/
lv_obj_add_style(scale, &main_line_style, LV_PART_MAIN);
/* Add a section */
static lv_style_t section_minor_tick_style;
static lv_style_t section_label_style;
static lv_style_t section_main_line_style;
lv_style_init(&section_label_style);
lv_style_init(&section_minor_tick_style);
lv_style_init(&section_main_line_style);
/* Label style properties */
lv_style_set_text_font(&section_label_style, &lv_font_montserrat_14);
lv_style_set_text_color(&section_label_style, lv_palette_darken(LV_PALETTE_RED, 3));
lv_style_set_line_color(&section_label_style, lv_palette_darken(LV_PALETTE_RED, 3));
lv_style_set_line_width(&section_label_style, 5U); /*Tick width*/
lv_style_set_line_color(&section_minor_tick_style, lv_palette_lighten(LV_PALETTE_RED, 2));
lv_style_set_line_width(&section_minor_tick_style, 4U); /*Tick width*/
/* Main line properties */
lv_style_set_arc_color(&section_main_line_style, lv_palette_darken(LV_PALETTE_RED, 3));
lv_style_set_arc_width(&section_main_line_style, 4U); /*Tick width*/
/* Configure section styles */
lv_scale_section_t * section = lv_scale_add_section(scale);
lv_scale_section_set_range(section, 80, 100);
lv_scale_section_set_style(section, LV_PART_INDICATOR, &section_label_style);
lv_scale_section_set_style(section, LV_PART_ITEMS, &section_minor_tick_style);
lv_scale_section_set_style(section, LV_PART_MAIN, &section_main_line_style);
}
#endif

78
examples/widgets/scale/lv_example_scale_5.c Normal file
View File

@@ -0,0 +1,78 @@
#include "../../lv_examples.h"
#if LV_USE_SCALE && LV_BUILD_EXAMPLES
/**
* An scale with section and custom styling
*/
void lv_example_scale_5(void)
{
lv_obj_t * scale = lv_scale_create(lv_scr_act());
lv_obj_set_size(scale, lv_disp_get_hor_res(NULL) / 2, lv_disp_get_ver_res(NULL) / 2);
lv_scale_set_label_show(scale, true);
lv_scale_set_total_tick_count(scale, 10);
lv_scale_set_major_tick_every(scale, 5);
lv_scale_set_major_tick_length(scale, 10);
lv_scale_set_minor_tick_length(scale, 5);
lv_scale_set_range(scale, 25, 35);
static char * custom_labels[3] = {"One", "Two", NULL};
lv_scale_set_text_src(scale, custom_labels);
static lv_style_t indicator_style;
lv_style_init(&indicator_style);
/* Label style properties */
lv_style_set_text_font(&indicator_style, &lv_font_montserrat_14);
lv_style_set_text_color(&indicator_style, lv_color_hex(0xff00ff));
/* Major tick properties */
lv_style_set_line_color(&indicator_style, lv_color_hex(0x00ff00));
lv_style_set_width(&indicator_style, 10U); // Tick length
lv_style_set_line_width(&indicator_style, 2U); // Tick width
lv_obj_add_style(scale, &indicator_style, LV_PART_INDICATOR);
static lv_style_t minor_ticks_style;
lv_style_init(&minor_ticks_style);
lv_style_set_line_color(&minor_ticks_style, lv_color_hex(0xff0000));
lv_style_set_width(&minor_ticks_style, 5U); // Tick length
lv_style_set_line_width(&minor_ticks_style, 2U); // Tick width
lv_obj_add_style(scale, &minor_ticks_style, LV_PART_ITEMS);
static lv_style_t main_line_style;
lv_style_init(&main_line_style);
/* Main line properties */
lv_style_set_line_color(&main_line_style, lv_color_hex(0x0000ff));
lv_style_set_line_width(&main_line_style, 2U); // Tick width
lv_obj_add_style(scale, &main_line_style, LV_PART_MAIN);
lv_obj_center(scale);
/* Add a section */
static lv_style_t section_minor_tick_style;
static lv_style_t section_label_style;
lv_style_init(&section_label_style);
lv_style_init(&section_minor_tick_style);
/* Label style properties */
lv_style_set_text_font(&section_label_style, &lv_font_montserrat_14);
lv_style_set_text_color(&section_label_style, lv_color_hex(0xff0000));
lv_style_set_text_letter_space(&section_label_style, 10);
lv_style_set_text_opa(&section_label_style, LV_OPA_50);
lv_style_set_line_color(&section_label_style, lv_color_hex(0xff0000));
// lv_style_set_width(&section_label_style, 20U); // Tick length
lv_style_set_line_width(&section_label_style, 5U); // Tick width
lv_style_set_line_color(&section_minor_tick_style, lv_color_hex(0x0000ff));
// lv_style_set_width(&section_label_style, 20U); // Tick length
lv_style_set_line_width(&section_minor_tick_style, 4U); // Tick width
/* Configure section styles */
lv_scale_section_t * section = lv_scale_add_section(scale);
lv_scale_section_set_range(section, 25, 30);
lv_scale_section_set_style(section, LV_PART_INDICATOR, &section_label_style);
lv_scale_section_set_style(section, LV_PART_ITEMS, &section_minor_tick_style);
}
#endif