Embedded/lvgl
1
0
Fork 0
mirror of https://github.com/lvgl/lvgl.git synced 2025-01-14 06:42:58 +08:00
Code Issues Projects Releases Wiki Activity

feat(example) add style examples

Browse Source
This commit is contained in:
Gabor Kiss-Vamosi 2021-05-27 11:50:04 +02:00
parent 5bc529bc46
commit 0cafde653d
22 changed files with 461 additions and 177 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
docs/overview/style.md
View File

@ -287,42 +287,17 @@ Built-in themes can be extended.
If a custom theme is created a parent theme can be selected. The parent theme's styles will be added before the custom theme's styles.
Any number of themes can be chained this way. E.g. default theme -> custom theme -> dark theme.
Here is an example about creating a custom theme based on the currently active theme.
```c
/*Declare the style used in the theme*/
static lv_style_t style_btn;
...
`lv_theme_set_parent(new_theme, base_theme)` extends the `base_theme` with the `new_theme`.
/*Initialize the styles*/
lv_style_init(&style_btn);
lv_style_set_bg_color(&style_btn, lv_color_green());
/*Initialize the new theme from the current theme*/
lv_theme_t * th_act = lv_disp_get_theme(NULL);
static lv_theme_t th_new;
th_new = *th_act;
/*Set the parent theme ans the style applay callback for the new theme*/
lv_theme_set_parent(&th_new, th_act);
lv_theme_set_apply_cb(&th_new, new_theme_apply_cb);
/*Assign the new theme the the current display*/
lv_disp_set_theme(NULL, &th_new);
...
/*Will be called when the styles of the base theme are already added
to add new styles*/
void new_theme_apply_cb(lv_theme_t * th, lv_obj_t * obj)
{
if(lv_obj_check_type(obj, &lv_btn_class)) {
lv_obj_add_style(obj, &style_btn, 0);
}
}
```
There is an example for it below.
## Examples
```eval_rst
.. include:: ../../examples/styles/index.rst
```
## API
```eval_rst

1
docs/widgets/extra/chart.md
View File

@ -22,6 +22,7 @@ Charts also support:
- `LV_PART_ITEMS` Refers to the line or bar series.
- Line chart: The *line* properties are used by the lines. `width`, `height`, `bg_color` and `radius` is used to set the appearance of points.
- Bar chart: The typical background properties are used to style the bars.
- `LV_PART_INDICATOR` Refers to the points on line and scatter chart (small circles or squares).
- `LV_PART_CURSOR` *Line* properties are used to style the cursors. `width`, `height`, `bg_color` and `radius` is used to set the appearance of points.
- `LV_PART_TICKS` *Line* and *Text* style properties are used to style the ticks

1
examples/lv_examples.h
View File

@ -22,6 +22,7 @@ extern "C" {
#include "scroll/lv_example_scroll.h"
#include "anim/lv_example_anim.h"
#include "event/lv_example_event.h"
#include "styles/lv_example_style.h"
/*********************
* DEFINES

97
examples/styles/index.rst Normal file
View File

@ -0,0 +1,97 @@
C
^
Size styles
"""""""""""""""""""
.. lv_example:: style/lv_example_style_1
:language: c
Background styles
"""""""""""""""""""
.. lv_example:: style/lv_example_style_2
:language: c
Border styles
""""""""""""""""
.. lv_example:: style/lv_example_style_3
:language: c
Outline styles
""""""""""""""""
.. lv_example:: style/lv_example_style_4
:language: c
Shadow styles
""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_5
:language: c
Image styles
""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_6
:language: c
Arc styles
""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_7
:language: c
Text styles
""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_8
:language: c
Line styles
""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_9
:language: c
Transition
""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_10
:language: c
Using multiple styles
""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_11
:language: c
Local styles
""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_12
:language: c
Add styles to parts and states
"""""""""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_13
:language: c
Extending the current theme
"""""""""""""""""""""""""""""""""""""""""""""
.. lv_example:: style/lv_example_style_14
:language: c
MicroPython
^^^^^^^^^^^
No examples yet.

9
examples/styles/lv_example_style.h
View File

@ -29,13 +29,16 @@ void lv_example_style_1(void);
void lv_example_style_2(void);
void lv_example_style_3(void);
void lv_example_style_4(void);
//void lv_example_style_5(void);
//void lv_example_style_6(void);
void lv_example_style_5(void);
void lv_example_style_6(void);
void lv_example_style_7(void);
void lv_example_style_8(void);
void lv_example_style_9(void);
//void lv_example_style_10(void);
void lv_example_style_10(void);
void lv_example_style_11(void);
void lv_example_style_12(void);
void lv_example_style_13(void);
void lv_example_style_14(void);
/**********************
* MACROS

36
examples/styles/lv_example_style_1.c
View File

@ -1,29 +1,31 @@
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Using the background style properties
* Using the Size, Position and Padding style properties
*/
void lv_example_style_1(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_radius(&style, 5);
static lv_style_t style;
lv_style_init(&style);
lv_style_set_radius(&style, 5);
/*Make a gradient*/
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 3));
lv_style_set_bg_grad_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_bg_grad_dir(&style, LV_GRAD_DIR_VER);
/*Make a gradient*/
lv_style_set_width(&style, 150);
lv_style_set_height(&style, LV_SIZE_CONTENT);
/*Shift the gradient to the bottom*/
lv_style_set_bg_main_stop(&style, 128);
lv_style_set_bg_grad_stop(&style, 192);
lv_style_set_pad_ver(&style, 20);
lv_style_set_pad_left(&style, 5);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_center(obj);
lv_style_set_x(&style, lv_pct(50));
lv_style_set_y(&style, 80);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_t * label = lv_label_create(obj);
lv_label_set_text(label, "Hello");
}
#endif

76
examples/styles/lv_example_style_10.c
View File

@ -1,36 +1,40 @@
typedef int _keep_pedantic_happy;
//#include "../../lv_examples.h"
//
///**
// * Using the transitions style properties
// */
//void lv_example_style_10(void)
//{
// static lv_style_t style;
// lv_style_init(&style);
//
// /*Set a background color and a radius*/
// lv_style_set_radius(&style, LV_STATE_DEFAULT, 5);
// lv_style_set_bg_opa(&style, LV_STATE_DEFAULT, LV_OPA_COVER);
// lv_style_set_bg_color(&style, LV_STATE_DEFAULT, lv_color_grey_lighten_3());
//
// /*Set different background color in pressed state*/
// lv_style_set_bg_color(&style, LV_STATE_PRESSED, lv_palette_main(LV_PALETTE_GREY));
//
// /*Set different transition time in default and pressed state
// *fast press, slower revert to default*/
// lv_style_set_transition_time(&style, LV_STATE_DEFAULT, 500);
// lv_style_set_transition_time(&style, LV_STATE_PRESSED, 200);
//
// /*Small delay to make transition more visible*/
// lv_style_set_transition_delay(&style, LV_STATE_DEFAULT, 100);
//
// /*Add `bg_color` to transitioned properties*/
// lv_style_set_transition_prop_1(&style, LV_STATE_DEFAULT, LV_STYLE_BG_COLOR);
//
// /*Create an object with the new style*/
// lv_obj_t * obj = lv_obj_create(lv_scr_act());
// lv_obj_add_style(obj, LV_OBJ_PART_MAIN, &style);
// lv_obj_align(obj, NULL, LV_ALIGN_CENTER, 0, 0);
//}
//
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Creating a transition
*/
void lv_example_style_10(void)
{
static const lv_style_prop_t props[] = {LV_STYLE_BG_COLOR, LV_STYLE_BORDER_COLOR, LV_STYLE_BORDER_WIDTH, 0};
/* A default transition
* Make it fast (100ms) and start with some delay (200 ms)*/
static lv_style_transition_dsc_t trans_def;
lv_style_transition_dsc_init(&trans_def, props, lv_anim_path_linear, 100, 200, NULL);
/* A special transition when going to pressed state
* Make it slow (500 ms) but start without delay*/
static lv_style_transition_dsc_t trans_pr;
lv_style_transition_dsc_init(&trans_pr, props, lv_anim_path_linear, 500, 0, NULL);
static lv_style_t style_def;
lv_style_init(&style_def);
lv_style_set_transition(&style_def, &trans_def);
static lv_style_t style_pr;
lv_style_init(&style_pr);
lv_style_set_bg_color(&style_pr, lv_palette_main(LV_PALETTE_RED));
lv_style_set_border_width(&style_pr, 6);
lv_style_set_border_color(&style_pr, lv_palette_darken(LV_PALETTE_RED, 3));
lv_style_set_transition(&style_pr, &trans_pr);
/*Create an object with the new style_pr*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style_def, 0);
lv_obj_add_style(obj, &style_pr, LV_STATE_PRESSED);
lv_obj_center(obj);
}
#endif

50
examples/styles/lv_example_style_11.c
View File

@ -1,22 +1,50 @@
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_ARC
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Using the Arc style properties
* Using multiple styles
*/
void lv_example_style_11(void)
{
static lv_style_t style;
lv_style_init(&style);
/*A base style*/
static lv_style_t style_base;
lv_style_init(&style_base);
lv_style_set_bg_color(&style_base, lv_palette_main(LV_PALETTE_LIGHT_BLUE));
lv_style_set_border_color(&style_base, lv_palette_darken(LV_PALETTE_LIGHT_BLUE, 3));
lv_style_set_border_width(&style_base, 2);
lv_style_set_radius(&style_base, 10);
lv_style_set_shadow_width(&style_base, 10);
lv_style_set_shadow_ofs_y(&style_base, 5);
lv_style_set_shadow_opa(&style_base, LV_OPA_50);
lv_style_set_text_color(&style_base, lv_color_white());
lv_style_set_width(&style_base, 100);
lv_style_set_height(&style_base, LV_SIZE_CONTENT);
lv_style_set_arc_color(&style, lv_palette_main(LV_PALETTE_RED));
lv_style_set_arc_width(&style, 4);
/*Set only the properties that should be different*/
static lv_style_t style_warning;
lv_style_init(&style_warning);
lv_style_set_bg_color(&style_warning, lv_palette_main(LV_PALETTE_YELLOW));
lv_style_set_border_color(&style_warning, lv_palette_darken(LV_PALETTE_YELLOW, 3));
lv_style_set_text_color(&style_warning, lv_palette_darken(LV_PALETTE_YELLOW, 4));
/*Create an object with the base style only*/
lv_obj_t * obj_base = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj_base, &style_base, 0);
lv_obj_align(obj_base, LV_ALIGN_LEFT_MID, 20, 0);
/*Create an object with the new style*/
lv_obj_t * obj = lv_arc_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_center(obj);
lv_obj_t * label = lv_label_create(obj_base);
lv_label_set_text(label, "Base");
lv_obj_center(label);
/*Create an other object with the base style and earnings style too*/
lv_obj_t * obj_warning = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj_warning, &style_base, 0);
lv_obj_add_style(obj_warning, &style_warning, 0);
lv_obj_align(obj_warning, LV_ALIGN_RIGHT_MID, -20, 0);
label = lv_label_create(obj_warning);
lv_label_set_text(label, "Warning");
lv_obj_center(label);
}
#endif
#endif

24
examples/styles/lv_example_style_12.c Normal file
View File

@ -0,0 +1,24 @@
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Local styles
*/
void lv_example_style_12(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_bg_color(&style, lv_palette_main(LV_PALETTE_GREEN));
lv_style_set_border_color(&style, lv_palette_lighten(LV_PALETTE_GREEN, 3));
lv_style_set_border_width(&style, 3);
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
/*Overwrite the background color locally*/
lv_obj_set_style_bg_color(obj,lv_palette_main(LV_PALETTE_ORANGE), LV_PART_MAIN);
lv_obj_center(obj);
}
#endif

29
examples/styles/lv_example_style_13.c Normal file
View File

@ -0,0 +1,29 @@
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Add styles to parts and states
*/
void lv_example_style_13(void)
{
static lv_style_t style_indic;
lv_style_init(&style_indic);
lv_style_set_bg_color(&style_indic, lv_palette_lighten(LV_PALETTE_RED, 3));
lv_style_set_bg_grad_color(&style_indic, lv_palette_main(LV_PALETTE_RED));
lv_style_set_bg_grad_dir(&style_indic, LV_GRAD_DIR_HOR);
static lv_style_t style_indic_pr;
lv_style_init(&style_indic_pr);
lv_style_set_shadow_color(&style_indic_pr, lv_palette_main(LV_PALETTE_RED));
lv_style_set_shadow_width(&style_indic_pr, 10);
lv_style_set_shadow_spread(&style_indic_pr, 3);
/*Create an object with the new style_pr*/
lv_obj_t * obj = lv_slider_create(lv_scr_act());
lv_obj_add_style(obj, &style_indic, LV_PART_INDICATOR);
lv_obj_add_style(obj, &style_indic_pr, LV_PART_INDICATOR | LV_STATE_PRESSED);
lv_slider_set_value(obj, 70, LV_ANIM_OFF);
lv_obj_center(obj);
}
#endif

64
examples/styles/lv_example_style_14.c Normal file
View File

@ -0,0 +1,64 @@
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
static lv_style_t style_btn;
/*Will be called when the styles of the base theme are already added
to add new styles*/
static void new_theme_apply_cb(lv_theme_t * th, lv_obj_t * obj)
{
if(lv_obj_check_type(obj, &lv_btn_class)) {
lv_obj_add_style(obj, &style_btn, 0);
}
}
static void new_theme_init_and_set(void)
{
/*Initialize the styles*/
lv_style_init(&style_btn);
lv_style_set_bg_color(&style_btn, lv_palette_main(LV_PALETTE_GREEN));
lv_style_set_border_color(&style_btn, lv_palette_darken(LV_PALETTE_GREEN, 3));
lv_style_set_border_width(&style_btn, 3);
/*Initialize the new theme from the current theme*/
lv_theme_t * th_act = lv_disp_get_theme(NULL);
static lv_theme_t th_new;
th_new = *th_act;
/*Set the parent theme ans the style applay callback for the new theme*/
lv_theme_set_parent(&th_new, th_act);
lv_theme_set_apply_cb(&th_new, new_theme_apply_cb);
/*Assign the new theme the the current display*/
lv_disp_set_theme(NULL, &th_new);
}
/**
* Extending the current theme
*/
void lv_example_style_14(void)
{
lv_obj_t * btn;
lv_obj_t * label;
btn = lv_btn_create(lv_scr_act());
lv_obj_align(btn, LV_ALIGN_TOP_MID, 0, 20);
label = lv_label_create(btn);
lv_label_set_text(label, "Original theme");
new_theme_init_and_set();
btn = lv_btn_create(lv_scr_act());
lv_obj_align(btn, LV_ALIGN_BOTTOM_MID, 0, -20);
label = lv_label_create(btn);
lv_label_set_text(label, "New theme");
}
#endif

18
examples/styles/lv_example_style_2.c
View File

@ -2,23 +2,23 @@
#if LV_BUILD_EXAMPLES
/**
* Using the border style properties
* Using the background style properties
*/
void lv_example_style_2(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_radius(&style, 5);
/*Set a background color and a radius*/
lv_style_set_radius(&style, 10);
/*Make a gradient*/
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 3));
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
lv_style_set_bg_grad_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_bg_grad_dir(&style, LV_GRAD_DIR_VER);
/*Add border to the bottom+right*/
lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_border_width(&style, 5);
lv_style_set_border_opa(&style, LV_OPA_50);
lv_style_set_border_side(&style, LV_BORDER_SIDE_BOTTOM | LV_BORDER_SIDE_RIGHT);
/*Shift the gradient to the bottom*/
lv_style_set_bg_main_stop(&style, 128);
lv_style_set_bg_grad_stop(&style, 192);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());

16
examples/styles/lv_example_style_3.c
View File

@ -2,7 +2,7 @@
#if LV_BUILD_EXAMPLES
/**
* Using the outline style properties
* Using the border style properties
*/
void lv_example_style_3(void)
{
@ -10,14 +10,15 @@ void lv_example_style_3(void)
lv_style_init(&style);
/*Set a background color and a radius*/
lv_style_set_radius(&style, 5);
lv_style_set_radius(&style, 10);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 3));
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
/*Add outline*/
lv_style_set_outline_width(&style, 2);
lv_style_set_outline_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_outline_pad(&style, 8);
/*Add border to the bottom+right*/
lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_border_width(&style, 5);
lv_style_set_border_opa(&style, LV_OPA_50);
lv_style_set_border_side(&style, LV_BORDER_SIDE_BOTTOM | LV_BORDER_SIDE_RIGHT);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
@ -26,4 +27,3 @@ void lv_example_style_3(void)
}
#endif

14
examples/styles/lv_example_style_4.c
View File

@ -2,7 +2,7 @@
#if LV_BUILD_EXAMPLES
/**
* Using the Shadow style properties
* Using the outline style properties
*/
void lv_example_style_4(void)
{
@ -12,13 +12,12 @@ void lv_example_style_4(void)
/*Set a background color and a radius*/
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 3));
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
/*Add a shadow*/
lv_style_set_shadow_width(&style, 8);
lv_style_set_shadow_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_shadow_ofs_x(&style, 10);
lv_style_set_shadow_ofs_y(&style, 20);
/*Add outline*/
lv_style_set_outline_width(&style, 2);
lv_style_set_outline_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_outline_pad(&style, 8);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
@ -27,3 +26,4 @@ void lv_example_style_4(void)
}
#endif

29
examples/styles/lv_example_style_5.c Normal file
View File

@ -0,0 +1,29 @@
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES
/**
* Using the Shadow style properties
*/
void lv_example_style_5(void)
{
static lv_style_t style;
lv_style_init(&style);
/*Set a background color and a radius*/
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 1));
/*Add a shadow*/
lv_style_set_shadow_width(&style, 25);
lv_style_set_shadow_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_shadow_ofs_x(&style, 10);
lv_style_set_shadow_ofs_y(&style, 20);
/*Create an object with the new style*/
lv_obj_t * obj = lv_obj_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_obj_center(obj);
}
#endif

34
examples/styles/lv_example_style_6.c
View File

@ -1 +1,33 @@
typedef int _keep_pedantic_happy;
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
/**
* Using the Image style properties
*/
void lv_example_style_6(void)
{
static lv_style_t style;
lv_style_init(&style);
/*Set a background color and a radius*/
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 3));
lv_style_set_border_width(&style, 2);
lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_img_recolor(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_img_recolor_opa(&style, LV_OPA_50);
lv_style_set_transform_angle(&style, 300);
/*Create an object with the new style*/
lv_obj_t * obj = lv_img_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
LV_IMG_DECLARE(img_cogwheel_argb);
lv_img_set_src(obj, &img_cogwheel_argb);
lv_obj_center(obj);
}
#endif

24
examples/styles/lv_example_style_7.c
View File

@ -1,33 +1,21 @@
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_LABEL
#if LV_BUILD_EXAMPLES && LV_USE_ARC
/**
* Using the text style properties
* Using the Arc style properties
*/
void lv_example_style_7(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 3));
lv_style_set_border_width(&style, 2);
lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_pad_all(&style, 10);
lv_style_set_text_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_text_letter_space(&style, 5);
lv_style_set_text_line_space(&style, 20);
lv_style_set_text_decor(&style, LV_TEXT_DECOR_UNDERLINE);
lv_style_set_arc_color(&style, lv_palette_main(LV_PALETTE_RED));
lv_style_set_arc_width(&style, 4);
/*Create an object with the new style*/
lv_obj_t * obj = lv_label_create(lv_scr_act());
lv_obj_t * obj = lv_arc_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
lv_label_set_text(obj, "Text of\n"
"a label");
lv_obj_center(obj);
}
#endif

25
examples/styles/lv_example_style_8.c
View File

@ -1,24 +1,31 @@
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_LINE
#if LV_BUILD_EXAMPLES && LV_USE_LABEL
/**
* Using the line style properties
* Using the text style properties
*/
void lv_example_style_8(void)
{
static lv_style_t style;
lv_style_init(&style);
lv_style_set_line_color(&style, lv_palette_main(LV_PALETTE_GREY));
lv_style_set_line_width(&style, 6);
lv_style_set_line_rounded(&style, true);
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 2));
lv_style_set_border_width(&style, 2);
lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_pad_all(&style, 10);
lv_style_set_text_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_text_letter_space(&style, 5);
lv_style_set_text_line_space(&style, 20);
lv_style_set_text_decor(&style, LV_TEXT_DECOR_UNDERLINE);
/*Create an object with the new style*/
lv_obj_t * obj = lv_line_create(lv_scr_act());
lv_obj_t * obj = lv_label_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
static lv_point_t p[] = {{10, 30}, {30, 50}, {100, 0}};
lv_line_set_points(obj, p, 3);
lv_label_set_text(obj, "Text of\n"
"a label");
lv_obj_center(obj);
}

23
examples/styles/lv_example_style_9.c
View File

@ -1,31 +1,24 @@
#include "../lv_examples.h"
#if LV_BUILD_EXAMPLES && LV_USE_IMG
#if LV_BUILD_EXAMPLES && LV_USE_LINE
/**
* Using the Image style properties
* Using the line style properties
*/
void lv_example_style_9(void)
{
static lv_style_t style;
lv_style_init(&style);
/*Set a background color and a radius*/
lv_style_set_radius(&style, 5);
lv_style_set_bg_opa(&style, LV_OPA_COVER);
lv_style_set_bg_color(&style, lv_palette_lighten(LV_PALETTE_GREY, 3));
lv_style_set_border_width(&style, 2);
lv_style_set_border_color(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_img_recolor(&style, lv_palette_main(LV_PALETTE_BLUE));
lv_style_set_img_recolor_opa(&style, LV_OPA_50);
lv_style_set_transform_angle(&style, 300);
lv_style_set_line_color(&style, lv_palette_main(LV_PALETTE_GREY));
lv_style_set_line_width(&style, 6);
lv_style_set_line_rounded(&style, true);
/*Create an object with the new style*/
lv_obj_t * obj = lv_img_create(lv_scr_act());
lv_obj_t * obj = lv_line_create(lv_scr_act());
lv_obj_add_style(obj, &style, 0);
LV_IMG_DECLARE(img_cogwheel_argb);
lv_img_set_src(obj, &img_cogwheel_argb);
static lv_point_t p[] = {{10, 30}, {30, 50}, {100, 0}};
lv_line_set_points(obj, p, 3);
lv_obj_center(obj);
}

10
examples/widgets/chart/index.rst
View File

@ -27,16 +27,22 @@ Show the value of the pressed points
:language: c
Display 1000 data points with zooming and scrolling
"""""""""""""""""""""""""""""""""""""""""""""""""""
""""""""""""""""""""""""""""""""""""""""""""""""""""
.. lv_example:: widgets/chart/lv_example_chart_5
:language: c
Show cursor on the clicked point
Show cursor on the clicked point
"""""""""""""""""""""""""""""""""""
.. lv_example:: widgets/chart/lv_example_chart_6
:language: c
Scatter chart
"""""""""""""""""""""""""""""""""""
.. lv_example:: widgets/chart/lv_example_chart_7
:language: c
MicroPython

13
src/widgets/lv_img.c
View File

@ -419,6 +419,9 @@ static void lv_img_event(const lv_obj_class_t * class_p, lv_event_t * e)
/*Refresh the file name to refresh the symbol text size*/
if(img->src_type == LV_IMG_SRC_SYMBOL) {
lv_img_set_src(obj, img->src);
} else {
/*With transformation it might change*/
lv_obj_refresh_ext_draw_size(obj);
}
}
else if(code == LV_EVENT_REFR_EXT_DRAW_SIZE) {
@ -519,7 +522,6 @@ static void draw_img(lv_event_t * e)
int32_t zoom_final = lv_obj_get_style_transform_zoom(obj, LV_PART_MAIN);
zoom_final = (zoom_final * img->zoom) >> 8;
const lv_area_t * clip_area = lv_event_get_param(e);
if(zoom_final == LV_IMG_ZOOM_NONE) {
if(_lv_area_is_in(clip_area, &obj->coords, 0) == false) {
@ -552,10 +554,11 @@ static void draw_img(lv_event_t * e)
lv_coord_t obj_w = lv_obj_get_width(obj);
lv_coord_t obj_h = lv_obj_get_height(obj);
lv_coord_t pleft = lv_obj_get_style_pad_left(obj, LV_PART_MAIN);
lv_coord_t pright = lv_obj_get_style_pad_right(obj, LV_PART_MAIN);
lv_coord_t ptop = lv_obj_get_style_pad_top(obj, LV_PART_MAIN);
lv_coord_t pbottom = lv_obj_get_style_pad_bottom(obj, LV_PART_MAIN);
lv_coord_t border_width = lv_obj_get_style_border_width(obj, LV_PART_MAIN);
lv_coord_t pleft = lv_obj_get_style_pad_left(obj, LV_PART_MAIN) + border_width;
lv_coord_t pright = lv_obj_get_style_pad_right(obj, LV_PART_MAIN) + border_width;
lv_coord_t ptop = lv_obj_get_style_pad_top(obj, LV_PART_MAIN) + border_width;
lv_coord_t pbottom = lv_obj_get_style_pad_bottom(obj, LV_PART_MAIN) + border_width;
lv_point_t bg_pivot;
bg_pivot.x = img->pivot.x + pleft;

6
src/widgets/lv_slider.c
View File

@ -119,8 +119,7 @@ static void lv_slider_event(const lv_obj_class_t * class_p, lv_event_t * e)
}
}
else if(code == LV_EVENT_PRESSED) {
lv_obj_invalidate_area(obj, &slider->right_knob_area);
if(slider->bar.mode == LV_SLIDER_MODE_SYMMETRICAL) lv_obj_invalidate_area(obj, &slider->left_knob_area);
lv_obj_invalidate(obj);
lv_point_t p;
slider->dragging = true;
@ -245,8 +244,7 @@ static void lv_slider_event(const lv_obj_class_t * class_p, lv_event_t * e)
slider->dragging = false;
slider->value_to_set = NULL;
lv_obj_invalidate_area(obj, &slider->right_knob_area);
if(slider->bar.mode == LV_SLIDER_MODE_SYMMETRICAL) lv_obj_invalidate_area(obj, &slider->left_knob_area);
lv_obj_invalidate(obj);
/*Leave edit mode if released. (No need to wait for LONG_PRESS)*/
lv_group_t * g = lv_obj_get_group(obj);